{"_id":"react-graph-state","_rev":"103-b4bcb77be12246d019d08a58a57d5e76","name":"react-graph-state","dist-tags":{"latest":"2.1.4","canary":"1.6.2-alpha.43"},"versions":{"0.4.0":{"version":"0.4.0","description":"Digraph-based state management library for React, inspired by Recoil.","main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.2","@types/react":"^16.9.50","eslint":"^7.10.0","eslint-config-lxsmnsyc":"^0.1.18","graph-state":"0.1.0","pridepack":"^0.1.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"de110b2ae3c56f88fd54e4accbd7de0e936eda36","_id":"react-graph-state@0.4.0","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-tg+sDmSbxuPLcPx+XpmB8+oOJcpqLzL+SnVGVtid7OCo0ewNinxDRM3ZOgIIkDOqiGTVIUsHLHIVyu5pHPk26w==","shasum":"304c43197a72dd33bcdf4c780a4af87b930869ba","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.0.tgz","fileCount":80,"unpackedSize":416632,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfgGnSCRA9TVsSAnZWagAAbmYQAIoUL1L0PCz70h3FkAst\nqfdEH84KY42OF87HoV6SCnVAVujF4U+hTn5OhVJ+tZ11GJHU5OzwEeVRr8zh\nDutZoGUfWO+shRwvFKof/FehS7Pg4t8fdB08t7XpVA75nC1sYnHo6Z2Ykvaf\nq8nS2NNiSYQ7B2Gcx6WBtiixKz6va7XbXXgibZ1wGumL2/TfsdC6Mkcb0KfW\ny03TIoEfPpynn9QYMX3XHmoZvA3S4MhSSuDSCEFMywdrktQjWgE9iBDZCosV\n9nMUQGrilus7uofVRvhVSdY8dvjAU0QBTN0Npocz8qxBTSozBjuNmSY7jMcw\nxmW8HKoUree+FAh4YqX250QFZ08gTEgm/ux+4xFVvgYSLENt0GGki0RLQpOh\n8FXNjic77QgliZ9iyAqC47GT3aZSQ3lw0XEIacQCi9pZLupJOjLVjlGmjx1h\ndH9PaG5FbeGsmXZBJYOQwMbuET+cvgJdL1/7EwaILcKqPo5NfdwLnHXWAZia\nlY2n76RlrPpmX9ceai02jhLaQyP+LXwd++8oRo/JLa3rx8gowjUtshZb79Zq\n5Dx+XTJHFOQGj3fMeI2sco30eWZCoK/g05WZiZc7O5lFmuf8hCLBn0tL48Dq\nlfuYM0bZ8VOqFXMj8x1n71wg+4ItCzKebh4sxzCu0OKQTpCjIlaYzJRxH4jV\nvKrK\r\n=ygP4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHDYdKC2Svxs0gIXLI0ayA8RmDfze9CGHvoVHORlD19qAiEA8AEoeo2VW/LhYGUO0o5gexXLhTOIfMN+madZeztmhaQ="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.0_1602251218011_0.6490172518780741"},"_hasShrinkwrap":false},"0.4.1":{"version":"0.4.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.51","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.18","graph-state":"0.1.1","pridepack":"^0.1.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"59518f7c9e7033ad17e9f329eaecf4c36dc4a064","_id":"react-graph-state@0.4.1","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-VUlcx4BTxftZR2H+R8Ac5fUDmugO+IvciH/ASUjz9a/TbbD+/zcPfzJC7L/6FlKc7MFRYDOlQT817GoEACBm3w==","shasum":"d3b800ed0da41885047d309a75929ed89f7fdb71","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.1.tgz","fileCount":80,"unpackedSize":416626,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfgcWQCRA9TVsSAnZWagAA52kP/19RUoVKQZcZBFS1z9Sc\nAr58qx8Uml8Ui2SQEj9KmqAyhHlBJ/Ia+SkOz3iH9NjmDJ9wSTWCJ4V24h9n\np5LJs4l5lv2NBC/VCp3ZQ7XJpHlvn2nIJhigBlHMTmcUGBk1E25ROFQTOz9U\n+5aCvZII5i3XnY7+2A9ySRMhYwDr1GwXb4BiPKUaKTOnGx2NeUBhP/dV6IM9\nrzoSuEAaS77Z3AFkIha4WfaQlPSSXF7Hi9Xhdm6ecrZA6ZHF/Xn0TQEnL4si\nzlfv226PMPTV4kQFe1dublo4v/fLLkZBAEtsOM6QXB2EYzAenWbVX8D44FmD\nVEXXCJ4hDNUbVic8Ax0QCQxbJBcryH6qq4JaPodmJOdnUvaenorcJji80gF8\n6t6gC7YU5XDcf+96WMJ4mIxH7uN13LtotxFXeZjIgBWGsdtISjS2A797EkHC\nIMrXsJL9kzx7Hs3d8UhbkfUthkm037E7r/BopR2w9TrhZTHvCh/ckTsE1slF\nQa+BITNA3KFT529byGsrQnZk2nEMUv9xsn2gTJCXsetX7Ois9aqA0DFUFhoe\nLbRYDg3ENNKKYQG8wN9PSCPh69GkDrk0/rnKE3oKV0t4EBZ0FFyR7Uvy/6fG\nP4ztZeHAwr414lZvjW1C0HGH1ROZNvK/SL/2RVthuyC2BU3GAfxV/lyxSXF4\nvD08\r\n=bvyw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHq8wE5pnP7y1FYKXaxT/5Tw52I7ixUf/UvkI561vBGkAiBuJYLBr3CHDopUAvzcFW7YNu9OJMlMxetas9z8ZG5n2g=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.1_1602340239559_0.9012002156119596"},"_hasShrinkwrap":false},"0.4.2":{"version":"0.4.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.51","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.18","graph-state":"0.1.2","pridepack":"^0.1.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"6c548b7a55616815d71853e024ae7acf48afb65a","_id":"react-graph-state@0.4.2","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-bjvSmb2OI6W6YgYo3KK2VXbEcw5xPMaomffQcRilGojNW+hbwXtRNuwciiCMaM5pjpQrzHg47jZoY8iN9+OmPA==","shasum":"e91c0aef441e811a9b3c43a03e898e6c85123d25","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.2.tgz","fileCount":80,"unpackedSize":416626,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfgns5CRA9TVsSAnZWagAA2eUP/jNCpxwWXdqNfQ87FZOq\nql7eu+rJOXshBLpUAmxXYLb4vcLZwI6cHr8FWaV1izoDm6Sfg9pDsi+T9OQf\ntbsobIL0kPlrCyZtP7UrAjvet8bLiYA0AKzLZZMAtv5vTyk6tP4K6UC8qc+r\nDvhM6POj9rZWr3OxFIAg5XYabPPJbo0eBXp6rskN1X0m5Cf3tAU/jcefmct8\nAPcjiAqQNaSXTnUmM0GvmLPPk0Tgb/GvagRUCT5eRZ2gFUJNRHWUZJyq6/vK\nZ0QBetI34hejqXK77lb8tO/441RwQjTeOwFCpktUNt6KYCylaJOhKXhmtsx6\n60OgZ0qS4AjGatwnXAd2b9240scbxgum3Aw7VFRXHDXBFXxlP7c8q9HEnSXp\npCP8SqcEm+rXJlXeGdQZ6CJor4Fj+N8S4h6p+nhyoC8in6bNm1YtIta261DV\nVwx533df3RKAx22QZkhw1ba1lNFAmE5Zi+tYxMzwj7eIXt82Nz07CP7HioRy\nB4tfEtFnN0IE9eGzEPmdf4f5LTIH+7Dj+CieoZX2Zozo0GZhvfsC4wpYntJw\noJxHwN+Tocr3XEceKAWR0JA374eWEQSyzb6l0AkwHEqcYiaxdbrg58WuVhhK\ngXE/d6bBynf2wZIvzbWv65EuoT7T+tO7KFv/418D/phlvnecck7cfhAip1H7\nyY7K\r\n=rQW2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG4J91lUrPanYwML/dPsj3KgW+LQdGEHT47p0PeCafKdAiB8OgCkGHFmVzPK+xza0ptTWZ/UL9kSvXnCFk8haX88xA=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.2_1602386744639_0.45162714414138394"},"_hasShrinkwrap":false},"0.4.3":{"version":"0.4.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.51","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.18","graph-state":"0.1.3","pridepack":"^0.1.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"56bb42052502b6930e0a407ca43f620d25cddd63","_id":"react-graph-state@0.4.3","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-lVwueTT3qePCAgASK6/soYLmj8I3Vr4b4IF5/iPwyAcxq9kANRRgNn7tVfgkg0fsX0ctjYsb7VyCrAXOADBSDg==","shasum":"e77a501d98446a7b1a304206134b0ea217a13f5c","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.3.tgz","fileCount":80,"unpackedSize":416626,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfhFpeCRA9TVsSAnZWagAAHtIP/RxEnn3g6J7OWmmp9yOq\nwzVvIlporLF2PnMYOQmsZk+ZiK1gla1Xngw/f7TwaTqd2LLPxgz3UAZhigN6\nLo3PKz+O0ebfPgH6s9SC0/esT9g1HyfGB5KFUidI85l5Q4+YPmPw+rvSp8jm\nuWRP85aMboDwUjMFQ3NxXOe8gx55bJ7aOfZAz2sicz9Bzv/76yoN+S/4SbBB\n5ZGm+xBAGv2dQV05BUlJ+i6Y7IFJpU9o/qv89OSEfmnZY8HMWJfoSITqgewn\nkW3ePX6Zmc5KIRrO5VA6NGwKCKI4r6om5QnJEMRY3f8URGQ92CrooWLj68UG\nq0RR1+wn/2V7GttqDJr44Tizuo6ndqkDE72zPocm/e4nGRDbR5ovgt8t3FuB\nmnDCrHIz7SGt3X+9osdLp33nARxOQQaeWurP57CSay1LRtlud6p8lDkN5Ow7\nwtZlUjnS5tYO7sjtfCXjviavLJgJNOIC8S8Uv3bha9dmiYvQtK4GN2JA2eZN\nhYBy42I1Z0fxfQj4ukctroVEKngq6tLs/uRbvFt/O/euMHDFOkPy0gvn6dok\nNAf2FTXks4+u/TlB5TdWordTaiZp9tIlc/NSY5oO/46aVD0JxgKJ5slyrIty\nYQNt7hMYpsaucIUru5JyNqcEk2wjS03hGmVxvGKVW6K+5C4MBlcEjWl9hPGs\ndJ1y\r\n=HQfV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGzBSVzZq+wtTQIAfkefvwdUr9iUTL9d0BIuxIfVs3YjAiEA+jvrlbARZ6YRZI8r3g4oA+1xti1+BH7/TGyNKDIU70Y="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.3_1602509405686_0.9369901122176914"},"_hasShrinkwrap":false},"0.4.4":{"version":"0.4.4","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.51","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.18","graph-state":"0.1.4","pridepack":"^0.1.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"a02445aeac6789ed7754044a62f6b23d2f16bcb9","_id":"react-graph-state@0.4.4","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-NciBjK4+8r/+epPxHeezSuRTUeYIyUWBbpN0KkCr9EX+2gwLWyDWOjh3Fqhv2B5UUaPAUF0RcngZ01Pg1i2QKg==","shasum":"c2e06815f04b72ff91f5af17ceb03686ee17a82e","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.4.tgz","fileCount":80,"unpackedSize":417823,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfhGkPCRA9TVsSAnZWagAAkiEP/3Kz+OFnCwdpqGeO4kOY\nHGumwfp2++Ac7OHgZPIKNLdlqvASb4drVupJe2C0DZw7b1IHfnKva7sj/Jf6\ns/seSjG3+GQ9H4Bq4DSUN15Df906phaM8I/Bw/5IrDai8YNq+zoIoWANQfFf\nc4kmyXBM7b5VyacgZ97Fx6goDDIzlf8bAuA/tP5o1m2We64HlFjE+TFyhfII\nZOttQVyOY14Rxry0ho+Whje7FEtUqaHym2HKtJqB5Lx5kBiYp3T5XlcJgrVD\nxw+P0hWSJpY/Cq2T2EY0B4DXEHQXNRBjUhlPOEYD1sMLNKrkSv5VEdfpfylg\nsijqkAWxEx70bHo2bI314b0AwxMo021kL+6J+Ri23Txrg7IuLZjbqclxMRAc\n3DD9btsJMIOdGtct7miP+yO+h667y9NOG8eHTEWXkZn7txpgqZrWZFETR8fV\nU657Jdxj5vk/HKsBHtmbUfYq/IVDx+Fqu3vbJ8cCrHwhNW8Uz6yFQZfnziSI\nlBECAPAvSug7t2FONOsEKdRFVw9p3b+aqrUEVj2wNZ0fU80AjL9KBuOGveos\nB3NaAUEGKsxW0D2cUbH3AU5s1W1+SdB/t7SCM+HgaRjlQaG3jjT2Fcf2DZkz\niv5nAx6dUfg7WaZlUIIg/DhzgGDE3FieOeywFtovRtZs97jyxcErqpTDLUPd\n7sWN\r\n=+HnO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDX/JW8WuQqq8g7BHt6PHp0l4OP0ZTCZ7XtE0Ux0CPI+AiBeLcUoSBU0vkaLpLjS0EuWhDZ4s5WL+bDEw/BKkMXwzA=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.4_1602513167226_0.8375929421089439"},"_hasShrinkwrap":false},"0.4.5":{"version":"0.4.5","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.1.5","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"4958dcfbffdfe24d8b2e58d35435088e0088524d","_id":"react-graph-state@0.4.5","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-DLuP1cycAyNWpSZ7HXt1T+26oOQzMRghg72nquFKeeSvTzdM4DLirMulA/3BAEF6GXfPHgQpxHURBs+8OBgmpw==","shasum":"ec368bbf1331ba1ac9eab7ca941573357cdad9db","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.4.5.tgz","fileCount":80,"unpackedSize":417823,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfhRvBCRA9TVsSAnZWagAAlaUP/2pPyO7WTozevIobjRrs\nAJ0moSsOKGOTR6o0/MiYHyZ1jmw4VoKEqelxb29ukfKykGVA3MjiBogqoM1O\nQcGy5eCLTwfllKcgKLP9Zd6DTh+36YKrbtvco49WwKXMXdU2+R6bKOi5nTfz\ngWGHiBU75TtfkMNjiiVkaJvdip8b1h1ZRoCjcCzBAmgOW6T2czC4+e3BH0OQ\nmgHlhUa1n6ecesIcYzLQf0sArigFvYv48VkrZRO249RsKiRlAB/8bV5n4ksM\nbjjU8PIh6tylOlenkln7fn29rLhTHc8z9PCX6ukwuvS7WMgptJVD39R0+grp\n9CuhKoKuL3ys5Ps5l2HoZjm9/eTwFR2fyJUIhP3wVrHzcmC4LEyuHfG0PGQo\njgMs6fuqX0xhNfj9nvkuSSfAWYZT7L20bgV37+sB5Qi8nMHHVSVe3LWjF52d\n17leTUPJXyT7UoK70Korit1g9ixYpg9Ag+xvDGiT48PMa5vw+rl965Ipm77K\nDoFJarberM1mtdH9P1PJnMSa4woy7Srw79N999dvD0MTbE6faCwGAMrFAAyA\nKtICeGwaUUDSUNilw3ZuokLKlJlRAnY50rsJw6TQV9Rnz5wzFj1cvpHdOQvC\n/ZlOS86WaTzGBRC9lDZVgwFtyB6/3ds3jIuPaUWw1704HyRTbD8KAuDdCash\ndnjH\r\n=3RQ4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEBcTUZxjg5y4UWqZ2EtaCDUwvn7XAP2rtSP0Gr1XxriAiB1xKYcARJnvHJuXfOYOmvJcA4WRLIZNH8VsTJfEMBJ3g=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.4.5_1602558912919_0.012827016599830543"},"_hasShrinkwrap":false},"0.5.0":{"version":"0.5.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.2.0","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"9f6c5f3f7ac1f0395dcf7be62c660cc267fac45b","_id":"react-graph-state@0.5.0","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-N4TWHBen1pYNnXOIBKfHtHKyZrPc6q31cbefbzqWyXHMdrQ7RDSAy17GC/ODBfYVlNXENZ4qGW5fM+P4rYggsA==","shasum":"d2a51a2497dd760086c1a11cf6513545b369f009","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.5.0.tgz","fileCount":80,"unpackedSize":417819,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfhXzfCRA9TVsSAnZWagAAvF4P/R5lAS276+QGmf9lZ6eT\nFCz2a/FLyOd7McvmavCH+qbzcXfxp9Iz3O18/j6BB5lwbZkrRpjOltyw8pH1\nmJZ5cCE7GYr9wlkz6q4v8KQeJcXSVC9dDg7dsAQhKJGJiF/n64LguU9Vxp3g\nNrZhXjJS9AbjIg3G710bjj3wcycPCT85XRSlGkv+QcpZD6lJV1Iy8RlKxgzm\nynG6SpkDgRSVpCAaiuEtiRYSJq/YWAN6VSxOKNF5JvrWRxTx0/cgJC8+3THu\nk7Ddv+orMernLrv9W3R9d6ZiAZAv8THZwwnOvlW0ibL366OWFszQpt9Y6Yqk\n1ffD3TvlrGwFcnEOc74KJxNlrgjANPR4NmvZtRY5oP1aLSE+iFeOW4PBrAbo\ny0VIl1ofbK3+uoK8wf6sAdcDKb/F4ZR5V7n/LaYQuibuTRlEuFGBBSPDlQ+1\nlB7rdbrQnSLuNo3lXorDvGZJuxMOuqBwYvoNyuypcikz0gPWsRbsH/xuw7D3\ng4Jj/p3N1lSsPRbWwgPmnXlQs+NRHU4tONvxIbNZk2G+JvQ5gzPR00/gw8D4\nWzZpBuVRpL6S1rzZpfurlL8vFa+cTerfjFrqF6RvybjG0ORxVdDxA+P3ttY+\nuh8spbWuyOWNC/HMDLohN5i9+mEhLTbBPNxAy0jJeXVmW7Y42P11lPRFbnlZ\nvOTi\r\n=s1Ky\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE29XpqV1q4p5F58054j3j9ZnXpJbsm4bl18Cz3gRwpVAiEA9F6NykZQu3HzvcBg2m8v/1nFh2yWLf5IHDSNcQzfueI="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.5.0_1602583775539_0.7712690124741994"},"_hasShrinkwrap":false},"0.5.1":{"version":"0.5.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.2.1","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"90b9e88b06026c52a062cc50df13ed65aaa59477","_id":"react-graph-state@0.5.1","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-3V9yHkEYh4Li/70HcYAe+W5l6QmsmtbSUoXct9knA+Y85pUHF86h+rv26wJw86rVrduHZMBjpvmFfc8py5y3NQ==","shasum":"42836c93f493909f7a298a8b2d4ad1535439b623","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.5.1.tgz","fileCount":80,"unpackedSize":417819,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfhYEwCRA9TVsSAnZWagAAprwP/3Ytuot4cWYTl7BWhYFT\nSeNniOeR3X32VBusAxH5rK9rC0I7PKNx58AdklILvljWbktZosqPd9g1zTCM\n8icVmcNE/FBjVDT1mdKMQy/mwjV4YQjAlkAfpZLxUctbAQiN3g3aXCtTzZXM\nXuWP4T+kaTRy9wlWcLY7JfEIs9MWHEAywQL46F5xQw1X/M7C9fiDsvFoPxi+\nBtqqkZIF3sKFq6bUk6jBTME7ppsGhM6iHH/EMVDGJtDEzcAZvZFI9w0iOneR\nbVJiPjQABqBHqa5yECJWyFUI4f/fHr/L6aPk6fdTxCsg0Rby9/0aZcBxnQ4j\nTCXvsdd0g+xWok64URZeEFvvpREB0HNsUe44fFGmII9juvx1CU+ATvjOGB4L\noB09Pe2yxZmq1VZebX/g3ASCwljoAeeA7dtZ2OB0otqwMCBMuVUdmvA7WBB9\n8UE9nQXhJqFKpiAi+EAAxkvTr19YVBIT5rk/jCDzQICZ9qP1XEM9Vy6l1Mh4\npy6pPZ+LvDshETgD3/YS1dMHxn9hYHC8G0NLvBK68nfOd+BkE8bMySFfcc22\nuAAu6YcgqBxtU1XKbFPuqbZXWBSG5Vv6T+z29lTT2ShatKSKKu+nfEXEwDkF\nzcwsq0/sL1n7yQcwbTNEimqJ6XYsQPq7BC4V1GpPKEIiFuqPX4yNQKnLDUbN\n6uUZ\r\n=yYum\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCmFFPIvwPX2G8saDMc70TtJDTl8kQIN41LnxXqbjS2XwIhAJ5tfgrBKaYeseMAx4eOe5B8Z17keha60Mo1tvh/zuwX"}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.5.1_1602584879569_0.2964591454753511"},"_hasShrinkwrap":false},"0.5.2":{"version":"0.5.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.3.0","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"0a547f5de2e3c16483fa10c8ef86bd7ce0051aa3","_id":"react-graph-state@0.5.2","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-u3wPMXlAlG+Rxx0PUypepCqN+EYrwy7j55IW7trmRDtKJRgVsk6oNtDBBADgXUPtTFMbxwbOelFrupOUsvCM/g==","shasum":"2d3b7183ea04bbdfc56221d25b0ccb53f8e51c87","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.5.2.tgz","fileCount":80,"unpackedSize":418885,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfiDknCRA9TVsSAnZWagAAif4P/iLfZpUAQvav6sJ7gfsV\nmOH8u4ALb58EB+ScvAafPdA2Eh9QACpQjLV38MGa3eGLl43EHUHWqRv5Hv5+\nCxA9/lrg2SCm7RS+ZQQFXnYdpTt3BogFQ2VEQkmDBU4SVdV7e/apmcQTFHLC\nD8J05gNbcyv33e3ZOtxIH+4HsybStK0xj3ii4OohrwhzbAC0RDOgmRYPPFQs\n0fO0t9uOw5vU/CEnrdtazNXfuTnJdt5/84cs67UIv6KIkO17WcGASXdJLrLV\n346ECCOM7Ghbf7KEf1GwI1TIGpqlZEDuvDjR3INt5F5L0NU9Uq/Q4SdFW6G9\nHssR01UNdkcWC4PGVQytZpBIpvxMHKG9Qkd31auBK4eAr3ZevPkbDcwek2CT\nVjVdRmy1tsGQLZ5TpCXrI7i0uf5UkgJCMzhoifmzIAwKugbKJBTkqv51AfUY\nO0+5fVMYjqkIq99NI3ibs5ECK6oqTdyFx6IyHaHic4u5DGna+nqoLd5uEYgi\nqzmOySwfvGgUtKOfF9JIJUmDbRxh+E7o4YgGzugzMAbP1EQHVdnbJBKaVv3q\nA7U3MjRdBfYx3+mTbQumUMJ13v0muptverI871zA7ULaq7Z3v9brOKIvt6g7\nDIDrCTBHQZoLmCUVZQfagmQ+BLGNBBm7iihZpPb07aVrebVJyO80c6IQhhgM\nSOcz\r\n=V1b4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEMCIFwA4LRTVNqFGqXC+T6CpS08fI0q5jUk5nuhyjDl7owJAh9cMPPxNryXEDP4nkWKfH4MhLRvBzuVDg8fTmdQXF+4"}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.5.2_1602763046617_0.4878780178536115"},"_hasShrinkwrap":false},"0.5.3":{"version":"0.5.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.3.1","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"82903a7ce27603ecd584191b5258cfd428d31fe3","_id":"react-graph-state@0.5.3","_nodeVersion":"14.4.0","_npmVersion":"lerna/3.22.1/node@v14.4.0+x64 (darwin)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-LS9Ayvg1xjrjP0CpKz4+kdw6mS81+MKamnotQQRyCxZM0xkwcFWOAr1HQvHLrstHhmn+rn+YwCAAQ4VXu6FiPQ==","shasum":"db68833c0fb1386a493dedadb1c02f71b8d3456f","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.5.3.tgz","fileCount":63,"unpackedSize":391213,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfiP1vCRA9TVsSAnZWagAAMXUP/26A0V68JHd6zlEMxh3k\n5n6RdybrA+wMSWx4FfcjJWvuOlT1BfM5+L6cIv55hC42I/54cLAZhaa1wE3X\nkwehCEsWSSV/MDYhbMQmTidDUYHYpbG4pIGZLYYCkkEMJ4P5GSaLLbVVrqLL\nks5Wurz+WBryr9nvvz7dcVtp2iA5YIuojwgcTefLIHscRl0+dXHQn5EHNb66\ndcEP6SGlWBlo1fWqZdca+fBLllAJzQ36a5scbsJhnt8hbYegVjiF9ZDjhSh7\ni0Vv5yoeM+RSsCAaLfXUkMZtxHeA0Wj7NjK0w0Uk9tleTaXP+ORcffh+9Uuh\nZkAz6kEOvsUlPPgtGSG1bmhGJPxF34Xr1A9hGORt1O3R5LKzLeBjrs2Vc3os\ne4z318sGgxwRG/6FT15yLABeOQkYahMn2pVGVA/n1dfVPveBrhptvY/4RTxc\nB7B4f1UevG7hkCHnc4n8n5+9Yx6Nf/gUU9H8aPa1VPMhBQ2dww/IsEWWt9u7\ndcxpqcT2Bx/skfnrHIqKXjY4HY9Ij+br2ofzk4JWdVJx2GJYB9bUo7WOhPy+\nqWTIiwEMFz5KFa0XxyRmcFCa+DvPbyun1dbJYgUU5Vu5FGXlgFKQFNPrZiGx\nQcSaAa2d6YE/3tJH0TENOGIIAtZ6yANgWLrhVlSM2n+z2EZ+SRvBEtDRcr7T\nNPvv\r\n=Z5n+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG7zRQc055wjLto75Xoz8bKlJbVlwCYUXJRr37+7Vo9eAiA5aNjQnspIys+2wfRyL6tpe9ooQEijCsr/dGc7tLH3Cw=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.5.3_1602813295316_0.038243769187543464"},"_hasShrinkwrap":false},"0.6.0":{"version":"0.6.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.0","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"6fb6a09fdb8bf55195ef451f0cdf174110cb31e1","_id":"react-graph-state@0.6.0","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-gw03cMi6nnbVD/FCOf8CrkifqNdOKrwVSYqzSqCdbFzP18ITkkCaRMYX+KGtZYzvcfEqvdiNTMrO6SeFJChTWw==","shasum":"8ee0a7e5cd5cbf1d5fee973b2d8ff07f351fad99","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.0.tgz","fileCount":82,"unpackedSize":430974,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfiaNMCRA9TVsSAnZWagAAdrkP/0xLuCaA1OTpgXMIJpMA\n6Uh2NchtLmN5YGL6GbBa5qSp/CUmSkM2PLsEsrlF1ZpkIKogIx6qiQGzaQ/j\n4am5/tF/Jqqaoq/XdHq/vh7zHOR8byeqwoMX2JiCjj8k6jKGKsSJg/Yc+xbq\nTNps2T9lfe5pze80494suF4QZ3Sl6OhX8K4a/T1ke2wAEPM/m7PCMoe5Hik2\nqQGPzVBJXlJrmv+3Ydt+3xvG4U/8f1+VsOhefzt7Ej5T77BhvuFxeDWOIZLB\nJMsJG6GxYUKgLVd/nkog/0lbvNSHM6S3+HcHYhZovTkRUvONugxtIPhElZfZ\nQTRlSmkQGjLtHe194G35Ye73h9J01jcJPbHBx46Y76Q7mjy27oAzLz1AioSC\nNWVCFXoKqpecuKTEDzsGKX1IFsQa4zhPsezC5XPOhZPRKKozRJEbDj30PwLF\nar5OmDnp4nrauk4sW1dJIiis1mMbQjTDWXt3CklkoSFGTeTfSFfkA8vWa5H/\n7zvvoVre4+JQAal07yfd3L6JxNJqgEcJm2YCTYhNy6T1I2qKwAnuneV1xXcD\nqZ0RLenjjPnRRX+qrxc8MqFRJL07713wRCorCD9DDPekwuxB0diX8y2w9UCZ\nVP0g8Vwx9enrnrCLtXdwrNh1R/M62zSlXSovkqJ/FKscdQoJ0WtBl4U8sNPW\nqmPQ\r\n=k73V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGsvUU0fPtmpvH+x53bwytJKUDzCEJ+ZJfjTxm4hGapCAiBvFjJxB5AfBMhBQ8eIOHUPPJAH/NmCQvtjIMDU3vqgGQ=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.0_1602855756292_0.6062412037300859"},"_hasShrinkwrap":false},"0.6.1":{"version":"0.6.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.1","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"gitHead":"eb9740172664924207d8d95dbff52ede3f288327","_id":"react-graph-state@0.6.1","_nodeVersion":"14.9.0","_npmVersion":"lerna/3.22.1/node@v14.9.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-MRgdAtHGjP0Q4eaoQPf1oBIoo32NYnyXOnLBIiGmi+fsCHOV+UpNCsaojvKrPgdYV71fFyQJdWkg0ksmxMpt2Q==","shasum":"6d4027bb085d085427167ab852a24ff57ba270ae","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.1.tgz","fileCount":84,"unpackedSize":429034,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfi7sMCRA9TVsSAnZWagAAvAYP/Rw/mGEoU14EFgq8szKf\n2cN252ju+sJ2v7mTSM/QlGxlDvPvcXiCa2N72TgU7yZdgDperYlrnlxv0AZO\nko67u81a/fmLKuDFP+E2x+vRXwmGaW4HCzcAJ27d9+es5EjJAk7GJqfz6XY7\ntn8ZbjGu61A01b7VP0P7JXxKEsx68GLS3O99UpqlkGbV9+ZSkxY3m6RAp1f9\nCea2NMZr7h/Q8aDriFJ2Os4np03paY8UecJOSMSJwR5lAfCLM/GTvBxgT2cQ\n5EQ6R4tTYh86pUOvrMSYudbUwG8woaLdL2XhmvsiIW3xcBMpYn8JR56MHqhT\nlQvLcQ+DiP0ONmilJ6xNlNGenoKhKcz4A8zHhMwYP/lqufZedpFdVeN3AtEY\nHlMVYlpmr1hglDqH6Np6w7A1SFUC8MngQhLdhOQ8zThC9Qnp6aGLM+AVx+s/\nQ6eOvhNF9H3Uae+GkmpXE8dmMyHK0PLt3rq2QxrOyJ8mN3j//O4fW3/X0KmV\n0rVOr3bJ7Eh8E5/5knF6El6A0HlAgAJsmQpa1SIO2hoz6CceNJB5aQqo0oTQ\n6n455UHJ84wHrn2gQv6VBn5jVhpnCqfXUeONpot/1Pjs+JWmc1BkljRnPdtx\nstK1XldAFBhP9wFYpKgcj2voSJV9XnDU/wErNiJeH/Onxkwmum+2IOTW1POL\n8aR5\r\n=yBWa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC4XYMBjJYfU+h2KMnIxcQiHKmF1sQuDwHFEh9r8xPUQAIgG9Any/9xoMotKgw2OiYMS1R8ezOD5yL6fdHaxjo0K4g="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.1_1602992907206_0.4949308357713067"},"_hasShrinkwrap":false},"0.6.2":{"version":"0.6.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.52","eslint":"^7.11.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.2","pridepack":"^0.1.4","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.1.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"gitHead":"b0f57819df144f195c40ef01c3025e5f549241dd","_id":"react-graph-state@0.6.2","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-ZZzN+ZL7wqEAiDWq3yfRGvol02Y7wEgVU/b5gy0MuuVdwtSjwBChZXw438jsvI7+VILs4WaVy3CKJ50SDLlKEw==","shasum":"f855e05d9d14e12ac8b92ddb57ad01c176cbe647","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.2.tgz","fileCount":84,"unpackedSize":429297,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfkr4GCRA9TVsSAnZWagAAzQoP/iqp4BMA95CiQcwzuMfQ\nTJFRk9+cEnRXWNr+6IzYndN92kSSg3svmOIpvAABBqkmqfIomrTNxfHn/ng0\nGpjN+L+71DCssRBI7msiDsCK9JWceriElFClIlS+yEi4wNWh1z5CE8/VqnW4\n5PEoqppeLOerRcXfAxYbRfY8qwqUh/HWlc7NACaOhJbLdBmGU5lXPrqNCmsx\n0Z43TmO2z2rPi5mJB45bjd43JhXWSTVmvDRoryMnAjcmFgcI+/xygrmCF5/7\nxLcEi9w12n2T8JUm8SZcgWyAiVnCKCdeqENkUEz9JqwW5a2GuWF+gwm7nptx\nhLfaJURrrbB+BOw2ZruUR88cDABb/m09q8Gtnq90NpxPmQVgxp51Al21uM2m\ncPut/5FnuZjqJ5uGJuW/znyQ7LaVBjm82FuqG8+mB1696Hl6PkKbEZFKkBk+\noen05AkGP3Cf0S/EN80fLJcra6/e2TCpJjZ81CcMnjE8yYod6xDmssn0Olw+\n+VXU6q/5xEDjacoKe4HgoGNJHxXoEXG7P0HmZb8slDz3ugzgOP6Wko8CdtSf\n2ifCbw4Sq93XfldJm8OF88jIl1yLupv0bhkvfH0VXg3ZFMNy2JTKEy0OpRfi\nC0I7aryvtP0iNPObGl28Pi00PTrH6xJR2FQ+xs91dGvjbeguCMMcJ2LU5Fa2\nEHJZ\r\n=nSzB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDkAZWysVEiB30fhoHY5ufIroYA6gdQGMuwSHJRsP0SbAIhAOtH14ZVpxXVBk1svQy+6WbtHW0oaYQvjiefL3ar0hyk"}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.2_1603452421604_0.8201814496788453"},"_hasShrinkwrap":false},"0.6.3":{"version":"0.6.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"gitHead":"373efbb96fe6852fbc064d83a943eb21696bb775","_id":"react-graph-state@0.6.3","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-Df7F6wsVQnFcEFwwTo56ao2smcQ6x3d88fOta7qT80Pgqz4VcJp3NA5JDb/57cda8Q/T9Rz6jZrhfdQX5oantA==","shasum":"f77b734e30322594941e6f4b2498f83621a52cdd","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.3.tgz","fileCount":84,"unpackedSize":428984,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJflB4QCRA9TVsSAnZWagAA7mcP/2C64b1xP9G6YVpuE5n4\ncUbPOOSlJwaA1P8zryGFpgNbETiLdL6Bug5sYVwA5M5efmJHygwnrxJGI8Nl\n1qYQjkOwNZi4NRWk2ljnXWnAV5GRBTM3tRrT+fGpxFcS9KInlIZU5sJ5FgHO\nhbRQS9uUX3bwQ9AM8g5PR2BOrnSbCoh/cebE3Vr5o7UuoznDNqFrfJpwN0pQ\n7odyYj7awbCbnGiT8ARBA/t9jS6ILw2BYlZyo3Pq/LE/vOqx2KVB7PwJXAl3\n0c3sIeKGH6i9oXHIVcyIg0puxOaIYL9Wqh6TqiX6qd5eyuNP+2o3Uxx7b6++\nhCw6ZDK5eOZlaCxXqr2lDQXge/iSPGaxwSd8T4xQsxdYshGn4cULVveTjKkU\nbgjWgTKodoDTTFgdTOQLL9JNKScdrjKRchDxGMOsbTGrERoC6463r9cgeXu+\nD6flygNexnSHn6H4x+XXmwVa08TQTl2v0QqVlj/ySC0jjL+pG4Z+jZboMrHP\nOepGg6/MWlbO2+LXIuht4OdzCsTwkwYB/kXAFV/8ZRrW8BchAmTjEHswhxBI\nF3widqTHpRtBlGPMMpE62qY8Ko4uAFz7PEQoz6NhagORTP6PS+CpVvDf6Qq9\nIyC65UI/cWaAueyYH1fqFPQhLSXqH5XSe6kz4JCJWSDenpcLrLp8eTk4OoRs\nN5PP\r\n=jdRd\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF1x7rz/zu3rwQhh+LRGKO6+JlxYPFx2dbU9MvGoesSAAiAOYV5zh3qrAbvs9v+8c6QcdI2UyOMC/IlPBeQbKSyKFw=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.3_1603542544089_0.21107454268949444"},"_hasShrinkwrap":false},"0.6.4":{"version":"0.6.4","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.1.0"},"gitHead":"b2fbe95de43cc13a49ed7391003ce9edce513957","_id":"react-graph-state@0.6.4","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-F50HlxQZIj1frg63dI9Y7VstdJhyXkm+tFPHQV8XhJ84mpe0VP6GGPkOiUtTY6Pg4o9rVGpip9H/s8L/AgNFYg==","shasum":"ec4875067ae764fff88f14148e6ba3da064f1237","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.4.tgz","fileCount":84,"unpackedSize":431114,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJflo7dCRA9TVsSAnZWagAAGDQQAJAl/ZnJf8MiJ95BMNN6\nFi35cP5Q2iVrAt6pdEtKTz+5sEU+bKuxkQYwWoW9mdEolsYgFpJobYli+1j1\nolKmXP2f/MClHmdKXewMsYNHKxhKo17oQwG4JYNfkqhsTxiwymO/HjYRb1O3\ner7yj9ho2YahUt3dE0Y+R7+HrqMEByssgQj2tj1MG7g92t0scviAJCrtgX0W\n0A8134AkeOAKDXzzqSWBGYuo2MkerkBAYQ0d2lvFOLZIP0nLmTjFAQk0wR+q\nq8EoVP7GZN8oWXUX8OEKpiGDvOpNC8mjKxSJDuCMq5OxZmWwx9xpfsS/DduN\nnBzd/uVpGCbK2eO/wZCzT1HHtMX2rg0QuFBSM1CECj7lCTjKcwYQ7h6ZRIEX\nN1lsa5NxQVswRq37XeKKd4XHxLu1wvFqEF74JospoNsfmKcDPoBB7RapCHKe\naKBaKl8854g01lBYaGlwYjJUcFo5bkhbcD+yPDX86H0qkoRg92ZId0ZwXjiu\n8uw2vjCpk+tvsCqF6iTGUeerezgNr3GqImb0UyQztt6bmaL3KhZ9FbU3WKJb\nLkLinLy3Pyd6kASFIwU8LpgT9vadw8E6c5IiKSRPtDHTPbsJ0E1hAsfwHEc+\nRQ6BT/WYqDCKIiW5m6OPcwkNYQ/Jnj8BLPFWcxTrg+qB870XlsL5bYoDYqQ2\nUA43\r\n=2UL4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICX+2LToDEInRT0XNeNCRE29VzXCcOgQqQFCHgMs9ySyAiARgC6BrrPYu4QnRCND/yX9Thug8dcr2P8DQmSvyWz4Gw=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.4_1603702493147_0.3138725622429759"},"_hasShrinkwrap":false},"0.6.5":{"version":"0.6.5","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.1"},"gitHead":"d9a64105326f01ef13c6c7899c8af711576e5786","_id":"react-graph-state@0.6.5","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-HF3npyh5NTOQrM1QFESV5PXy/xoYC14pax7v1pVjgqXBdQwD0zLAJCEQcSBoBxHLYTDE51KBxG6dGOcY0rj+HQ==","shasum":"0623e07c878594673fbac06234fde80b8c604a8b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.5.tgz","fileCount":85,"unpackedSize":431386,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJflsqdCRA9TVsSAnZWagAAqPEP/2QL8vdzepiddhG76RI7\nEqYgGntDZ+iO17panEsIDCNy4AX5hGOrO6yrKloCXzf6FhkU1oGFmVLJXIc6\nl8kFvw8bAOgoRNvLn3dPzdyuNVf2KnRfS09RydE8QA3mlOqjTmCu7VtWNd1Y\ndpm/Wxa0yuwaWSFqWXoUTSHcIiuCyNlublCMOOkoQqRoNO1OKdp6r39w0Lg4\nwb0dVPGgfU/U9J3ESXdsTJI5O7zDW90QKjKzhkZT6o6E29PdGrGC3WibKwtU\nZ1+YgWCjlvgSB80JNaR0PRFThHEQHsTx0IRqhvL57Oi2Nl3TBFTGIZ5wwBqA\nT97hs6ROLz8q9gymfM9trAeB/oDAlwohw4MKB0kWiqovKuVqmdfKBC2eNZid\nRBzLk6KJ756tPNBaOzM3RKyATXNIVPD71RIYBsL/HGQOLGS3semYjJkY3Drq\nfuRtelC+jJKE997ELlTY25T2ia/zvnyYCppabfWLIwey/l0xW+5F4lFeeMTr\n6EkEjOVet19O/Kvjpja05xWll41I+KTClaPqD16GHsoE+Za+qT4HjwWaAAX/\nhpFcwBdXGcYNhEOSl3RKT/2fGRgq9oXLeBfhok9sD5EbJzQ481ZucM9eF7ZK\nX/CpGxGpWc/xn4lpOiy9OijSm0De7DxCTQt3nyzAV6WocNRyCQI5Lv0jLuj2\nDGLm\r\n=wnCa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCPSnAjFDShl3g722r2/Y/2pWE4g9Q2i7kD/jcaM5uE+QIhAOt4ZT1X16nS2C5daVQ+qLacLRl9P1QlatB78EMjgbTF"}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.5_1603717789166_0.8757318692789844"},"_hasShrinkwrap":false},"0.6.6":{"version":"0.6.6","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.2"},"gitHead":"0106160a466b4fa6c90564cfb1248d90f30dc33b","_id":"react-graph-state@0.6.6","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-FKIpD+vJNEDFPWpHQTd/cGQfuUEVrjhaie/56m1p1wwKu9ArYig/oEq7wiXwuAh/eNdDm4b1jU9YQ/Scj0XEIQ==","shasum":"be64ff36ff1971d04c5a73cf422b2c0d34bd2d66","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.6.tgz","fileCount":85,"unpackedSize":431386,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfls/JCRA9TVsSAnZWagAAnAoQAIRzphdx6z1/zCbHQ2qs\noQlTlPAgRffDSi1xlJoYZf1nN0HVJZM4igJjjQBOJsZfp2E2Otd0ar1ZP1Rt\nr1Df0L3C9VMGh9Bo2rJ/UFjgnt9npaY971tS0hirwAa4f7vX4GPsK78RWqW8\nALHdRmgtvSkXy6z8GnntJVBA1GUwvoPaIPoJZWNduzxi4q79eVi04uSt/MWh\n0FwcjymUJ/w6UYeIloJd3uTTMUzMyl7tkR1xuXjE+XQ4LkjyGuR0XSrmc5Ti\nCWbFdFEDHxxs8froHUM3N/8rJ/n3BcrNlm08EKpQEWbdZF9wIQhmWIU0hzsM\nzspHPLH3OwcDZpAqmHYezjVRHa5W8Vp012/ZdJIk/kqEU781Lyl58+TTXrYP\nzBWq11YsyRpT6ffy0oVrjIW96YmHRfRNjxik8sAmVoGlBb6eV3Cg1Zh6mjdG\n3f/akXFLjbJxrqS48X8Oi0UI0tiKoFUARcWLobpDyJBjLCqRyzOPC2zN07YW\n3WelPL/CkayDqF6aCzzQU3cDmlqjpRkEp5JZ5AlE2TS7osdw6iSA57jX+5th\nm4YdAiQrIlBXT4D+G+zGOhaSLJ0pVHXzOS22vcdgQZ49G+zljFmv0BPQ73n3\ntFR+LaDEOsPDi/lhwrcS1lquQUhK9mgUPR7WuPv385BJhFYryM6hkYf8bJkS\n/jk/\r\n=uXUI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFbaaAItwTL44GW7zJc45MTaYL6bA/7YWuZ+YWa2Uas2AiEAoK2n3GA25KQIz/UeVThc+NiSBbFnCJbFDRediVcTGyc="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.6_1603719112924_0.6187085357406352"},"_hasShrinkwrap":false},"0.6.7":{"version":"0.6.7","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.4"},"gitHead":"51a882ec43cc135f9b97763def5fed3707ce146a","_id":"react-graph-state@0.6.7","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-Y0d1j5B/yCZtSMwF8lp+f9X+4DbvmpP2SXGkJNU+xyWgTy9uFS9UNCW5rFC03iHK/CWOp0KjDEvV/bpSep+sXg==","shasum":"2e36df2ddb4cf709b17a3b14252173c5fb01aeb3","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.7.tgz","fileCount":85,"unpackedSize":431293,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfltpyCRA9TVsSAnZWagAASNEP/iunnDkgfomvq6/rQZAd\n/C9Fk0UVuzW4ZE0J6KokN/dzS1AnJE9IFAiXIXK+GqB1ZIlavJFX8WwA3i7S\noiTk22peTPdalFX1aZQUrk7WbF8+HXaf3r63etJa7pQgiWF+p8Uo85MaSL/I\nlMCcwBzxL/wl19X/KyqlVTu3sgw1/PudkFOH6vErkYRh+9RtxIRr8YM50BzC\ncHKwhNYoELqUkJrgneIAl+RuAIXpeWq/JGJ/VwtwuAFBmKoeIfghu1ZcMLPG\n/mCoJpYM7m+8Sc57K95wwGEm5MnltzCh5XUpl0c+4hIJXFs55h8UgIkZ4pKe\nMUKsYfzj7vlVU+XwEr3kNz5pFfugKJXGPOY+l2QiXzqlKXY7ffhbbOExPxxM\nB9FTi5XChO0WWez8RRhAUJxot67cLoQu/fNd6KJhtLeX3yqkhNF9OcJ1OQK7\n9ERm1w3pOKXL+9Vcp4w2deuC8ACqqBzwXGVtNsoQ+PRecKwheVaiHiw3iOpI\n0mQ8z64JpMxcXhKIMiKcCbvPHXAc689ZwEhLNXSG/NmNzIAFheL6K53NZB38\nBZ4lqeLnmQRTV2Hf/kv3z/erPTlP7qxXTfuaIeutyM0cTc3vt+LIogfICNnr\nxyTsXEOG0SDGL5XCkJhA0boX2UR8xvdabRftaxfpsTiafRsLbMCNcFf+4IXo\n4gaW\r\n=bDKC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC/c6z6zw/jvcxiScZ4IRU/a2D2/KYgWMKTAj+GvoBP3AIhAJePMn43FqWUa1Ey+yjMM3z0J/A4OKb4hiuy3C7M40ol"}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.7_1603721842496_0.1702040205963682"},"_hasShrinkwrap":false},"0.6.8":{"version":"0.6.8","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.5"},"gitHead":"b14794fe4639124ff6a10bf8767b0f76836f3bad","_id":"react-graph-state@0.6.8","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-HxluMPLYpsGhjSblfoGw8qHbUZ+nGEyhci/YWjWqfTFtbA5qIvr5SGqXx3p18JL3dllVr4ZX/gWLczEbLtBgwQ==","shasum":"92c36119bd5af0b8bb7a12074e0823a427050462","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.8.tgz","fileCount":85,"unpackedSize":431293,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfluRXCRA9TVsSAnZWagAAPeQP/iJvMkJGaItz10AyN9KG\nBoAtsS0GRg0fSCGvt3TeZzbOi7kRwa3GKm7w8cJuGFGh17zWWBhPewxR3Sqg\nls51hIFy/kjsZvHu235pigAMr7x9UpDYrC+gkWbd0/RHtEYURJeyh3xcst0P\n5s5MJl76BwxyUE1Fvjof91Ryqna23MspvNS+SMBz0PWx8KYw7QxE4UWeeL6+\nFQqgC6vsPwgLEykoE+zP++BeCuHN3I7mVcTnrbUIk2JPmpdmujOzzxk6prQ7\nSkxQUkygzei9ljLJi2njI48xVGIglHgcC6ojIN3B5UOVMywi9VethjmoPvpI\ngaLx9s9PdLov7EyAbXloPCW0FUg7/ez4vhDAjrdHq8vQNAPNfvvpeD4VjDkv\n6osnfnbkOCcBd0mRaaq0T9adDLaqGYKBfxMNG57FCQSiSYt0zvPe6nxM6DSa\nEY//N596/j7CVVTn8D0oQB+XZATTIEoj8+dm9zDTtC5A8jysmNZm6h8BqjNt\nDXIcNr8UXARelvttFGemCy8Dnb7F86MwCtEnyMLe/KuGpDN3EE0sDyp0ZNfa\n/fbZSvheydfqBaw03uxCBThc28usDo8d20C9y7Kr3iu4Whs5GhcZ8lcKmno/\n48rt/oGAO2jgF/xEO04wL+huJSYXiYvXIbPF2LjW2lwAddNuAIxSu7B37Fzz\nmc76\r\n=j3DK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAHgMzND8wDJz16vbMD10daV5fja1UxSIGIVFqyfONe9AiAM+8uJB/QkGPtZBLFFx4vATRw4qnMeax2AogOG6n7rDQ=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.8_1603724374630_0.31959167976359204"},"_hasShrinkwrap":false},"0.6.9":{"version":"0.6.9","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.3","pridepack":"^0.2.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"507bd0645f994a091a62e0d46837d66ab50a7ee9","_id":"react-graph-state@0.6.9","_nodeVersion":"15.0.0","_npmVersion":"lerna/3.22.1/node@v15.0.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-sYfDwYiccUOYEsMdRiyLFOMV2HzYTuflLqGgN1Vb4/ZVXaqsDSloLk2d1zJXSFvc5YDEj0OLEoXDo/a/QmV5Yw==","shasum":"407d93a4bf24b5a99257cd142ab820e40a2edebc","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.9.tgz","fileCount":85,"unpackedSize":431293,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJflu+UCRA9TVsSAnZWagAAz/MP/jyywGwS8icCVw2g1hRc\nxGsERbZrBXRCU1egEOu5VQGcI0cWBhRSE4eRCTqKHxQyu/pPjvhq0G7sFxaE\nJw54zrN72ref8DbO1WfCbqhYpiJgx8MBOVvcdFFlGq7DxJ6Gxy6GEXGwNGyz\nb/aFXeaNh56/aBS9A0Iw2O6k+FNSwVtkE4sztiWkC5bGVP8yoqqjMk+qyixC\nx7hMrUKAQAlu0PneLHvw1pQ/4aFB95SdaORHFYiuplCclH3EPksBH5i40JJV\nS4dBmvgxxavvwOTkR/vo5+1ZRkVRKsWQnFvzWrSEL/ca9LbZtZhL0eNuIC5+\nXknfeZ2PbPfdrMU/ELrmeiCIHuRqQW4nEmKQ0I2OvUEWaKgh/gCN9SwBfkQ4\nDd55eN3QdkTvGoWT3PYgWHTEpjfwAkh0tq+XuqLw/Iqk1tqF961cau5JucI5\ncvfFKRYkHV44Djdxf8OF6QhIfYSAaTVRbrnhFPjyt9I6K+4li0iDB/7p7Cq4\nJUrSGeqq2bto2GxtT3FfBxUZD+0bEl3xohi7spx8qgMGqrc2Z/vVUiLnf9/1\nR8Ve6BJ1tPtkCojflchFw9dkq0HQAUB2XIPNZlV0eCiZ8HUmuVLTVXZgssHl\nd+RanjZzn2tc4v/8DrL0lve2qbZqhZFk/dke9jme+PPoGqOLO/EQsizLRmcl\nFM2H\r\n=9ZSz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD2UptdzzvvSX3g2lMEOyi9TsSAhdKTxrhQBBKGgv1tggIgIp+dRLWpZW7E9RONJUT8O0dACcxYsu6eqild07h4ZGk="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.9_1603727252209_0.5597419143249547"},"_hasShrinkwrap":false},"0.6.10":{"version":"0.6.10","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.4","@testing-library/react":"^11.0.4","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.14","@types/node":"^14.11.8","@types/react":"^16.9.53","eslint":"^7.12.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.4.4","pridepack":"^0.3.3","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.3"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"8b107316d9fc3587b815161f1ec6e412f8ec780f","_id":"react-graph-state@0.6.10","_nodeVersion":"14.4.0","_npmVersion":"lerna/3.22.1/node@v14.4.0+x64 (darwin)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-kZ6CSKnmIFSTgzgGkeymsrYBQ4JtHJofHNR1ekRkOB/gYa64LnTuYRrDVtfqP3QTPYdQrFq0JxcMB6tFXEsgOg==","shasum":"73a9365572d493691435ae3d5d75b2444dc21af3","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.6.10.tgz","fileCount":67,"unpackedSize":402148,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfoDUdCRA9TVsSAnZWagAAGjcP/0neakOQ4l+7iwPrv0AL\nb+sAZxW1MWMbTPITXJVDRFOny48leSWF9qd9mN2ZXYj6JOpir6zqUZIBPn2n\n/qP5nvxXCtV2YL7qfHJORUcA2gES5QGJbipCYiTl8CAMF0SJb8vBqodQK8CA\nqNSxfzqRTTiT0NZJOIaJkmvkwQ+xs9hrJL9sHBGkyHOmoKCzH7nIPXqrmRKy\nLiIeWlmMzun9mGSX/VpCOtxmdEwIZA3/vHdV50tPvl+xSZMarJcw7UPjGLh9\nySSk5YeGLwlLe90nWvIvVPwuWvrCH1mDm2E5AEVMAvp/5urY/m6w3/pnMAau\naXraR3Xcwkx5j2LM5cgcvCst2hsrekmP1hc2ETg45hKkndLi8tEejxSg1otA\nXTUBCx5xMJbQG9ZwA/P+2fK15e+AQOIOe/8yv6ku9f0tCLISZ1iKUys3bKff\nmr0EvsXJtsQAzgFnpjtfdyRAWGzeRcLYzkv004aOmtxJbjfisNuo8M2aiaM9\nP9PDgWUasyMYI+IwmJvP6PuBVxOKxThQfcwcJa5Rt4ZfagAlGTsnSKbjM3OQ\nYtd4PF5y5WDBEbQTLdtNkVRwNzI09z2xFsRMStb3rPYenyw8czYUiAupDlOS\nVyWnsqVxdTIXecQskzmLhA8iUmJSFKFpRDkNsOlxLnawgEDXHb0jlv9hpdld\nGdoj\r\n=TD5t\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHFHZAK6wLnPAu4Bj2div0i4cjc91woplVSEfFul4jyVAiATTAgZrcHccvgqSMY6Wvbb0REB1pTfcXr1AcerdAKClA=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.6.10_1604334877364_0.07669853299193763"},"_hasShrinkwrap":false},"0.7.0":{"version":"0.7.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.0","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.6","@types/react":"^16.9.55","eslint":"^7.12.1","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.5.0","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"8325bdeb70c133345269f6081f6254620153473b","_id":"react-graph-state@0.7.0","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-H/VlBxVeeSgfwovMsP9sr/oLFjL49qSiKLAjus2OzFFrGy6x2UUao/BhDs6HrHlkMCvZHAlUcWLSHPWuEuWFdg==","shasum":"ed774278779e0d1726a467698de97e88d7742e97","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.7.0.tgz","fileCount":85,"unpackedSize":431327,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfoTY8CRA9TVsSAnZWagAATVwP/AvgOV22ydhJB1LXPb6l\n9835AEL1d9DS9gxxequm65teukn0hqPs5/N4B6H8b7sZcYsVK8TGyDyp850M\ngjSydQFAlf77q80GJPJRgssnj2AVq5AVCAqP9qYfyf/EDSQjYX4Phl+XMqmb\nqWwGf+8/qc8wOLpgTTvZbRoBgvAasHhesKYFES64sUHunI9gQg6z38k2oOfa\nwEKzyGO+khrwERNuf/ovPFp8Kfcpx/znkTTxAV4sNpaRkOFs7MXN40jC0jv8\n05EVZMNCLlJLqYWcCdSgSVJkbq9KBHZVNRA7hYwJx4GgJS0k322pMxGpbDbp\nymz3qPFl5I3fZujIUr+StvVTnt9P3ipRm86ixukj3TEdOvFnYSmx+YPuohdw\nwJSuGVrtLLNQU1k1YUyiABvOuij9AjtIxzAO5eY1+u03AMVWYr2jya5DQFi/\nfoKlkb9Hs86lXUOTDt2kVa/fFVgCOo3Znh7eVqxt6koHW0sqvfaXgBBQkl9Z\n1tCxftkQFxTbU0U8eMkn/q0ahoPLJ7HTSRO74Kx6vxBapnLfkP1NOOPk1ygY\neNT6qa7VdjxWuGxytO3TuPbOzcI0VdlNc4qNfVNU+UXVz3IlXjrSbB99kGR/\nGiQ1ANL3OxK8OO0Di72uC2Y6mt79xIG8Pg/5y8eE6rvOKs+Y4p0CXEWIsWck\nWMLc\r\n=hc8l\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHkaI7BfOHFp+Sw2qlcZW3HRaFTQZNh/u0M4ti+exyIIAiBiEWDFeI4kD8v6fC1owIAdy06fV0FZWz8ZahG9kzvwAw=="}]},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.7.0_1604400700155_0.2709826387571179"},"_hasShrinkwrap":false},"0.8.0":{"version":"0.8.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.0","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.6","@types/react":"^16.9.55","eslint":"^7.12.1","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.5.0","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"8c8696ef7eb09c302eb3286ac951c748b4930cbc","_id":"react-graph-state@0.8.0","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-r25hwtkV0rMJ6BIALRCbQQdGN92p//peOPLX9mNtqa98Vq5dmtRMnThhK3Fgk0rv+YAur9+zfv25f5CW/+JOVw==","shasum":"434b23d8372c85f2d808fe436180a700a69d41a8","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.8.0.tgz","fileCount":92,"unpackedSize":518711,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfqCIzCRA9TVsSAnZWagAAjrkQAKNPV2UySV8woHK0vgKH\noUULtpZ2Ck6jjA055svS/T1z5SH6/vHHnxVXt0ujj28CGJCXGog4JRP3GYVP\nPEfnb9jV0rLjMZXj9+wNFL0yZc33if2tk3Gxjrm/WPxu7AvrgHvhOCgdjZSf\nS7sd3U+FySgzU/Y3j4P3Yj9Qn/SFZ3whgEOzXaHch8nxVv5jSnu1PdmqJMJ2\nE0BuYsitWWfmVNFuNKJr9SjHP47xFCzYSAAllPDi155SfG1aud2Zg0yrtwu6\nzFlCx8jnZ5HWPo4hXtlAqmIKR/DGy0ItnfJRre/CMePl2mfYGGRSLQ7YXpoI\nMPANlpIrMxfpcaeMgWckw3Kvm5i4jBqLpr+ghzUZRoIDb50CK+A7lMt+3oFI\nmGuIl9gYKaKE3KPlNcTjVdaWiULQFN3yOV8ENl7XxvjcAS8sl1FIapuGnSOQ\nLef59QSnxnfRO+5hyvIYdCHN39x8CYJPcKM/Sh0uDzv8iRnID0nVcuBFSVDC\nnkBMSGHmJHgEqFZPabd5YwTmS/li+/iTFm/feN4o1BddEPH9r1mzSq9DJ3U5\nuYyEbbDxhjhA88b4XydjhV65MftErZL6svsPKUbIAX6HVrH9u3IKDdXKpuim\nEEZKAn/viCSAXF4wCCTdGzgJcItxRCRiPKg8a0DuDs9M0bTqOIAK/cdjrAJR\nIcRi\r\n=ecBZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCdkWVqaxZUznebKMjMqV9JjpJbp0pHYO3ck4BqEu95dAIgIYimOKKOYRh5ZzBiUZiI7BILggLZ6C3/MJ11NRWm9Ak="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.8.0_1604854323366_0.6506653040676753"},"_hasShrinkwrap":false},"0.8.1":{"version":"0.8.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.0","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.6","@types/react":"^16.9.55","eslint":"^7.12.1","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.6.0","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"21ea7a93019562e3d07d1678932ba8ee92133d82","_id":"react-graph-state@0.8.1","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-Q//3US6WImBTnHqd2Xv5cjVo6Jscje6jWsGH7PmcjTyYUD1ENtbAG9wvESIuzzXO7LZK7ry5lbx6v9154g6+DA==","shasum":"f21c53b0d4231bd342ea501c257bbf8fd367f571","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.8.1.tgz","fileCount":92,"unpackedSize":518711,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfrPKHCRA9TVsSAnZWagAAIYgP/36roWBw2QsReNP3QqMm\nbXFaAeSaxwnbiLlqzJQNWSgLOmJzhDtHKeEkXyqvUBOnuVwfNMPIp2sz6ZcF\n49Xy+PSjPNNfATssUzoKAyaYdwMB+6N0pj5cBXoN1PgPL/2K1eakaW5gUoUr\nZ0tDGRDDucfXRzLEHkSnT+lOb1zPL0hUEA2os36HxZPre5XudUD6s2ps+KyZ\nVCc+s6AfJSJeHvA3ZJgbKKLWxuRUka6a16345aBEV8ujT5NN9IffPPTylxl6\ns8je/qORy4V3QWAKIkrKZL1yzmFNzc0AQ3mUlFB3qgc9YXX76mLetvEwSpjC\nB2Zev22zVj4CkkhWaKzRxv/SpapikbtavLTZajByVit4RWWYFiSqCWK70ylO\n7kTCSgBW7RV5/wzRxLpMeWbkSXg8CqMyqMNN+eDJSNycJWuntJ+dATmxqe+0\nppx+Q2BgsErookrjGAexaiQTZbfjzWmS5fNT1POBpa9TaJafAK28+9zX8Fis\nVLqyLIYxtpN9WlykQvlhGLm393ovwrvD9YTCq0bydalqvkXMqBSX9vu00zF0\ng/usOYMN4SJziT+e9OOPy/avWTnJn24nEFx5McPcuIjkguLQnh5kcT3Bzh4s\nXB3gvRlMUtwyE7tvDFDON1OVPviL38YPLn+cPn8Daa+azKa4y9++oeNVjj+T\nGI2v\r\n=uTzB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF/384ms04YHUewzCw67Mwls4nWyyfSbcycdGsqFOP4HAiEAnJp65eOSnKhiNdikM4mwLyGyWbfWwLQZc5ILsMRkB+k="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.8.1_1605169799506_0.06324063815008474"},"_hasShrinkwrap":false},"0.8.2":{"version":"0.8.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.0","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.6","@types/react":"^16.9.55","eslint":"^7.12.1","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.6.1","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"6fafe28402a3ccb38bd842d20fe81f36e55e53b6","_id":"react-graph-state@0.8.2","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-nbh4QKh84HjU2ufCzWV7DJGmgNxqOHEy0SEMEvL0VQmOVIvjc4qacOKmk7/ayW/3LstGYuYlRdTqjoCiZE7REg==","shasum":"181b983890c210a6ed6b96747c1bd84238d00c19","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.8.2.tgz","fileCount":92,"unpackedSize":518711,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfrPgmCRA9TVsSAnZWagAAOPwP/1S6F3f2lEkUdIAsXeW/\nNpJJl5UuzEsL1HBnQ5pRBjq2/I0zXIXFtyBc7/vf4mgSJdx0Ixd2rSvGv2DD\nwmnYy7JMBEAcyovxAxl4dZUyxqZzQyZEe5JHxmVJdad0CgWLa7qySzcCmCJ+\nvQDg+DY41pzX1dSLJYd9o/f6cUlUQcVt5vRE6ErArYtcdPu95vf6LaJPPx7+\nsW9aWKImjx4TAxgQsP1Xof08Kvveb2ZSIXlpnNwAO8ar76w/VBgIcsQ/GSOD\nH3b5QjzTAFujBOMj1+5Cf7VxodO/qefV3x+NBnBqVIIOQoBcrDrWIAhnD6xC\nR6B914jdzo4l9ziFEeJCPhfyHgbmkhKRXoFnp1G/uSqO1K2zcW9DeQcAMLpr\nPrCDQ06geXnbDnl78LB7zgezRq7Sg/7PbVfUEfqjo6SVCWFqHw6BKQyCNwzW\nyApF7Ck7c2BdtvdPy1qRxWtfahFiwK3X8QGYjDI273HGbn5eXxL7AcIneSTu\nk9WyuEv8q+XIAiI2UGtTc+h69EFqZhAGlyG8jA23BMmeKdfkCSNvrEHAKf3/\nDX+v3XULvgsaxA7x9njwv+wSlYzf8svDLltHp1WTGGrlKaqCPJSDxbXv9bMQ\nqYPZ/CIBNQu9lyq0kg+ZK2GJ0Cgx8mK3PaubQGTqIC2PRMwQ5X0Ssmcr2VEg\n/iWb\r\n=UJxS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCLAgJvPpiyMOur17oPHDMupPanUMu0pFji29vl35xB0AIgBtijdmOA16q2475lY59Y2N4OiLwstQOzppnGNyXufOQ="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.8.2_1605171237619_0.39255422051254496"},"_hasShrinkwrap":false},"0.8.3":{"version":"0.8.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.0","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.6","@types/react":"^16.9.55","eslint":"^7.12.1","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"0.6.1","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^0.4.2","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.2.7"},"gitHead":"d6ca41bcfa1d0c0470603d570e2523664a99e4eb","_id":"react-graph-state@0.8.3","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-SbZqMpwl8Q7LSSB0UQbGN8py7aI73C1/J1r8YxLwZSUU/EM4IKPKv1++vRek65tWtAOj6lRYJb2X2prVhtRKKw==","shasum":"8aa2d72532c2009251cd4568ee227073a13a927a","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-0.8.3.tgz","fileCount":92,"unpackedSize":521904,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfrSY5CRA9TVsSAnZWagAA558P/jWVrojrnsOJBDeUwTik\ngRc+zDAEHoWsilKULcPYToWY43KRkhICM7GUBfJ+lHD/nT1BHqFSX01Q7gla\nqWLbpFmo3VQV+ikngFHDMWXLUqFLwbfV/g0LWQWWV9tVsfSgCzw8YPlB916x\n+icPD3HtJysnItcsLTIw2rpreCYEtuAFERhhmbG3vBF5Od0BZWjJ0VY5yEHD\n8Zaiee68BKiXCNkMrzY9Imh4L18EGoQzUckuhOD9xD8j8UZHSQXytnzXXbgX\npuHKbvZ8Om9I4QmwdvnAE+kbUCs3cB3fS2HJlJ/+DFxbLoWPGXV1SCXQ4yP8\nOLxjR0Bg7c4EJHxYEEmmModg7K4a9Syjxb2jq8yQwI+I0zbawfIvLCsNm4v7\nvRIFxjxDeJC4H1u9FzgNpY8psrBONl5mBzs/8HZqhOuBVchGbH5GLHs9jeRK\n27er5aP1FvHrKPiyhocKly64tQNjiU/bdWD3GcW2jy6kD/Pyg/BQ+5GXSsQD\nIDPleWaQ6n7ScriAxBATzyu6BtlVDFRRXxCVv6XVyGDhEUBB+98EwqywLvnt\nIpxFUq+D/h3wlU/suHjeeZXny81yc8pa+93JPgHOBWv/VK38Hqc9p6etZ52b\nJqgYgPKmJtK/AvEj9jFdmPdpAKMmC0Yl+D48/c1gFRQjQ++ii4/zQ1oOpLGh\nzoT5\r\n=44zp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDwwQ0N9RbWzFVnNExzhO3/u/7Oz8Fby43QFlR8z87dNwIgAq7HHalpqKlhr6BjZ8XVl4JO8LgJkU3AQoGmXTJ3aZg="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_0.8.3_1605183032547_0.3107377730238756"},"_hasShrinkwrap":false},"1.0.0":{"version":"1.0.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.13.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"1.0.0","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.3.1"},"gitHead":"641eefcb20a6566f286af44274b804d833c516be","_id":"react-graph-state@1.0.0","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-aMDDLJsaaIk0AhajJhTEMH/Sn/65nOlg9wbRoD+wlCTnHsPnNkOiAX5biuChdnoV3vCpgaVSbjf/U+18CrG+tA==","shasum":"4723cd33bd0e6e90e827ca6f09b47731865190c6","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.0.0.tgz","fileCount":92,"unpackedSize":521925,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfrodVCRA9TVsSAnZWagAAqRkP/jD2YynqqZvBPqh4EtMm\nEnqGHl7TAXmcMWWiRHBXuk2PZ4Uimk1W0zW2gNv5pkd8MVhG7YSb7eG1YBeE\nwCxQQl/L5T27+SC1MtO+TeZFErKmDCUGjW+N3aBTw7wUAdy5WJOFsPE7ZIbO\n7IyKKnjXw7Ahj/nEzy+vvtwTewm/7t4288+cle0I/dVXxZ6Wpm6ru4yYz7KZ\ngg1RRnYjD8nzaVUKoYQzUL8HHOoI21MwjXEew0v2h5uvDg9qGjCgxho5yAHY\nQdIGFKgSlCsLo29JdNOreLHNuU+Q1X3q95N49u0GL4ooWiDJ3D0Vg4NmkVAu\nRWJmhiLNITmE3QW9WoerCgjoKwtIk64Bo17Gl9sWfqm6nOUXhEiuNkSSgiWe\nCHZfcn/XMdE60jE3NWpeB7djtJT9fkAe8qpcCLgGRpWFCDcJMi90FLnJbSxh\n+INWEhRupV7paOLRTsnNhQ/pvtvUK5+/tMtHx3NvKs7q+WEe+smpS4RT6QN5\n2i4QX4PU/oOWimwxTxWVkIDXs1dArCUXW2jv2Ie7o+ZKiOZcTBarplTOHHm4\nd6NBbrTZVxI9rgbeWyJwjFldK8KNRNWpWyfF4YVP7ZbifgfrhLku3T9T2Um3\n7D35eNu5n4AZ/OEDTHJoXQDNAqKNmEH3aSY7LXgpu8m1FDCM11PJcHYLhLmz\nIGd1\r\n=GMmK\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA72M2jjXuZK2n2l1OZ7qiODsN6a8PmpeksoHHKpDQKPAiEA2H2XMewWYtt5+1Dl92jiUdw8NY7uFSyufw+qa/Ib8Vo="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.0.0_1605273428766_0.2749540909200934"},"_hasShrinkwrap":false},"1.1.0":{"version":"1.1.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.13.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"1.1.0","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/scoped-model.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/scoped-model","bugs":{"url":"https://github.com/lxsmnsyc/scoped-model/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.3.1"},"gitHead":"1c08f2cc0a4796e60f94432db2075f201253e8ff","_id":"react-graph-state@1.1.0","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-6F8JOop7B2CCnIm6mwx1s19nh3m8Cmn5uc9AkzF9AY0ZOIEXUdEQXLrWrlTZLoG5HWfcgE/CmisLdvn6ToUqiQ==","shasum":"66eaf4bb12d401e5582a707c48420fb376600011","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.1.0.tgz","fileCount":94,"unpackedSize":535534,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfsAsCCRA9TVsSAnZWagAA+AwP/2F6ulxFe0bMzsagr1qG\nLYGt2TKTqxPXAWCJwezru7pbxuPaUlkf2HEQ8Rbw8UXbayL3xkn/aOswn9oA\n+V+S/IcT6mWmt75nTJVYqLbcccRrlxojPZy/i6B61TUiq7duYFWv+3W/RiCt\n6eEGCpM9SMN3Z9VOjGAn6ACk+woGPVAvXedyi0sSQoLz2R98iXnH02IZz9n6\nxN+kpjaU+5qUP8HqEa4gyq20ubMzPjLnMGhZdc3z8bz6DQmIFwMUL4LoAD7T\nNoTA56S2wLBOdvmHCa+XsuywJItS+djm+LDxAK8Dfchz96ABImEzcZhkh6nf\njq72oOfZiYSaCgDIECn+CBqQOg1wPG7CJZLRrZH63h6CBsChLkDRdbjUMqMZ\nujCZ8rGXZZ5Q3eGJcDWkTM7DDUvs/TY2G4gSGoldREdoQdhj47zIRNOxQPhk\nQm93MaU9hdO1wucoKlBuScfHZvDdzm5Mn7qJNBVG3mlsj0YfuDcJXw3XH5k+\n61IWZ3FtL3X1JA1gY0RRjKjebjdfE6HEzlTHwrOTGhqOFsCuWRK2Q+UxpgXw\nVanPx3qwkdds1KTZfWZ9QjmsPD/Lfo2c1E0UlZazrGI8VsZcGtaur3Vpo8Ge\n/78iFQvAqEj7EXQsYztdNDLVnWVXIdfxJqlJxjYjhfY38W8QBPuR4Wrn/puQ\npQFy\r\n=Sbj7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCRdnXkd0NmzFW5eFj71Dza7AAOjhfk19ywGflTCh1N/AIhAIdPwhD/GfqYp9mAj0AyNpIkgoP7gI5DN2krGpcMyDIE"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.1.0_1605372673702_0.11590159300551917"},"_hasShrinkwrap":false},"1.1.1":{"version":"1.1.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.13.0","eslint-config-lxsmnsyc":"^0.1.19","graph-state":"1.1.1","pridepack":"^0.3.6","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.0.5"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.3.1"},"gitHead":"065028826a4b1f55a5ba25cd3fb1153becae2b3c","_id":"react-graph-state@1.1.1","_nodeVersion":"15.0.1","_npmVersion":"lerna/3.22.1/node@v15.0.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-/3cIHGytZWVFjF/iFm+/uBOPTnR7GZgHbQoFMCql9MsGZe7uQe+QSnkvlr104/bTlLc1jAsxvIMgurXcqpiKHg==","shasum":"8937da602bd3eb3b33f97aed58e9a419852396ae","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.1.1.tgz","fileCount":94,"unpackedSize":535531,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfsJ4BCRA9TVsSAnZWagAAJRQQAJX5+gL6MGF5i6YFLbhI\nXVSMk+ea3g09LlHkAAgR1HFGGI15wGi2n5F/QVqPlQ2joauV9WuqW5CT5Uza\nbpdl5aXUqu+VohQLbcvbxdWMltwtsNrdXC41ad1CiKZrFxL8QLRGvjpkjl28\nFYjP8D6df49lcN/+bAGnzjy6mbNv6SZqnbw0nhFEgk5G/vgAblPHYRntgxPo\nzTP+aXEKK81q/W5wjtP2OkmwXhXY4klfriL0D121WXMufldnhFIZW35bP/Db\nCxv1RGsDktUish9oLVJFw+ApuNZxYCPUdd3wOtwZC/n/TFd4Y+4TSwsETiVK\nweSvSFPWULx1AxpzZfLyZbOAUU+liGWOn6Ym3QYsIjTxrE6Tcymrp/63pcRm\nE3/keSCo5f3783RUthx1YycxV5WbnXNmAgE+G0wSiOwuwuFwpxEFoTFXgox1\n29HrPFEpLQYTbEdaPMD/57SvY4g0Z9JkwXg9IFua7WDU08TCaHKrsZiRVNoz\nqOJmdoqdIyuLppW/jjW3lNsQvsjsQ/OlHTX958QJyCK/zJP+PEGTqqqGccAx\nsnDlUN+XaJ5+4HF6cQ5Dn3EVSSPruB/m5c3KZI8kXiDmBuU9EEWbWtRAHWim\nY8aF40Qc5euamPCt7317n3LXrnAPighcBDM7X+VqQRzUGyqxmuSkknEiXy/C\ni0Ly\r\n=Lyjr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICwV3eTqHtkHKDiA/AhIgVPo4KM3tj2O9sK7HSHXMOCnAiBJkKoigfNkCAiIgLxCSZtZpZ6sem6qsvzPK1puFV50Tw=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.1.1_1605410304898_0.7681379629627105"},"_hasShrinkwrap":false},"1.2.0":{"version":"1.2.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.2.0","pridepack":"^0.3.7","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.3.1"},"gitHead":"becc0e779e7cc3d4fa9f4f8225d95508ce31566e","_id":"react-graph-state@1.2.0","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-bkWSbrWkmfB0tMUnVL3YaApVXofVjD2AoyrXbZv5jn7b3hp91rGuUjtb0GOoS/JKqchXiOEKtsG86FKLNIXh3A==","shasum":"bb4a7f1cc9a40ed32326559977cd1d38f3e8f85b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.2.0.tgz","fileCount":94,"unpackedSize":536737,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfwSdvCRA9TVsSAnZWagAAZAMP/jIu9NCviLNLwZ6Qilh4\nbtvrNpQ6fGjlb98AqULd15GychbLNI8w5C8UKLE4YwZL3f5AZzcmWdm2SUBh\ntMZrlruVpJatRC/qgodVchgMgbBGbeACB0Na4SvaNxrbIuN/bRuBxfsrM2/m\nAVBTkat8SM6lor1QC/hstT4NVkUk+L2h7JNsJQv2JBFhPqTAXlw9zW3vsMQD\n5mRwo188XulqCddV30sJqzdDkkqQSqpqq4vJEkxYJYOQlOCeWHw502zRjO45\nhFc/9NE5xbc+tKUwWIL805dj4zvjr5nyrOn1maOVy7dO/07hkZn9CeX8GYfO\nnQzdqJGIusmR1UlQF/A/no4+HNrRlYSEjruL5CoxoVD+jzfyENrPebyreRCw\nBOYV6qou75Wk6dPiTmAgd6FsSzhkcEalsvJdApvg9jKNHWyJGfHir6eHubW/\nxMGA+zskPZWfs0rk853f6CS2EhqQQsHKVyzaQKe/UE8cXHj4uvwO6mXy76WT\niNDZ55+pp4GOaLZvczCn/kAtbm5pO7/uicKgjB7zal5Oi3fyhr2Hd60jGHlz\ny4TUVb4eXAlCY8MZ4jEfM6ohyv3MnX0G4rUD9eB9NUsdSdA8lw6UtyOnhasW\npFpdYNeKDU5skBsxniFOb2JTFq8md49lMh+dKsJhuFtkV57iPXAb9ix9tzj2\na25J\r\n=pFvE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFbHxmrPf4gDYAzy0v3ZV5oc/+noGEVFXwGWhUXZzw4fAiEA8tWTtokihJcUQ4b50LZVwzQM4lj2XjP/gMsmEYxmlyA="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.2.0_1606494062488_0.828778065020531"},"_hasShrinkwrap":false},"1.3.0":{"version":"1.3.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"react-external-subject":"^0.1.6","use-dispose":"^0.3.1"},"gitHead":"54988921e85d02c54ae71bddd7ddca744622774e","_id":"react-graph-state@1.3.0","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-MDad+phxJhnHaLFUhZy81DT1sU0IraxXJMjLLIZQQJkT8q1nKQBaDhsX9BBJZBQeYaC32E7LRhkktq98Rlx8Cw==","shasum":"12a0c9d749753c219e6a2307720b1e31da8c2acf","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.0.tgz","fileCount":93,"unpackedSize":468016,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0GOgCRA9TVsSAnZWagAAea4P/RwOg/HMbzMYS+kzM+53\n3gFGJTH58RuFzqMQhgqbCjybJuKgqq76271nb5gxFL0AhRPLmw8B9xTiiS+W\nXS0PBY495PLyZ+d7LJtIT62jrjaPiWi9/vxs+na7fS/OM90k6cT7pbZ1SSpH\nyDi9EGUjUC9qID8Z8W/x9i4P8fA93wv2U/yoN5TyUcmBeC3dYf6hFpyCJiXj\nadNqkuLhr0P4ci46eL62oLynadwnnz5oHyZGRnhs0gayRA329hFl8voNyEX/\nOZOg5oBSdwvXOcJWUR+D+gr8/E4Upm6VTxAt24oGyr1b0QUWuVOfXNEJokN9\nkMBaDHbU/4Jr9KsFzbiFrktfCVkuQYqFnzjRoQqxLIaXo4swwNFjxISSz/J5\npfnhiqIK0Bx5PPZrkWLqeN4pBXOwvxKZ/w/iqJY81Cp6khhfow4PNqcItijn\nTfMXoEn7CF3N6uKdbx9ITvW1ndjnKhFqICyrmXACwG6HcoKU/VvwUVm4D6c/\nHqv9nJrO7LnBcz3UWT5igV1IVhi5OdBZTc0nXi1RFIiO/A9yrVUTmyPRYv4z\nUZ0cMiH0lyf9OEQDGYhAW7YsWBbHI5HaK1jPBQuEfRlYec5Nh7Jr2zYgW8xO\nVLYGuBT1khdhi1rnHmkswcb491GjCcuUizrtZPHjCJU/zFO2ekNEnSt5Lzx6\nrAud\r\n=7hmt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCMGK3MYW0/ijU9Q2sU81mu6McPguus5l7ktzqO+1SUZwIgKLaXsc2fQ6wt81YpDkdPwH1HHhJrTs3ceWlCctl3ZSQ="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.0_1607492511819_0.05591962189521116"},"_hasShrinkwrap":false},"1.3.1":{"version":"1.3.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"react-external-subject":"^0.2.0","use-dispose":"^0.4.0"},"gitHead":"b5fa5c97dcb2147a193805d7eb6bf066f45379ef","_id":"react-graph-state@1.3.1","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-l4CGBJgNBFcjcPR8FA/HbDPFAUf2MJ9GO1LD0OlQrU4nk4nXOEGCGqxc1YUINHdMfZmRFo2FdI1ictHK+73qVQ==","shasum":"eda08b52e7b8e7ad274f13f3d0b8e6d91c083fc0","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.1.tgz","fileCount":92,"unpackedSize":450602,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0G3nCRA9TVsSAnZWagAAW3cP/08BMoNZwJytBFsMaZYc\naT191orR/VdF3G8GuuKbiUdZW1QRMknwu7/a96nC5PP5yCFp+mxs8JRTT+OV\nnFqpKN927Mrcskrz+S/L3rGEM7WZLI1MEWtiDFlFSbMpAKbfHu+HaHfVuTJy\n9xMEIQA+I2P+Cs8tzppAiHWsuzZB4gpEEaTabcYIcZAGsB0iUrPuzPrL2Vu6\n+k3UFi+zASks86horMtPyUM/3JBIyPlYTCgLZCYq8qeY5sUGZZOQdaDIxU1w\nAs7LphD6TnHaSWMtB42EJtJzZU2tw4+h0vcuIwOs910Ei8zaxFr1DLXImR2z\nTmHwP2aeQL9w2iRy/Fyppq61MAoRsDJlyY+zqj6AYOu/b1xKCyXJ57YhgSxf\nEQnah+ZgBh6HhidTVbpv2wOOo28K6rRqEKkGmAw4i2JBHGLAwRv0ysBN2Kur\nEYy2TLctCDP5sdOc9U2Z0AWG5XqrAEMD1pjuevpfBx3vuu7HEckyDqxAj390\nYrRVpTqKb7y5MhroZAFhFw4C6WEm4pFiAkyU8Lh+W1Jz4jatsHSl3hfH7buN\nMJd5VXkE82PqeOVdy48P10i6pR2pzvb7fIO7y52pVUQ3UjlbAdzs7d6oOPs1\nnMZw+et2lQMpI5LnzQRMDfplre1bUKeLRQk2uslrIWxPnFr178XqqJN/VqpS\ng7DH\r\n=0Nvf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDDWRcLMWe6zqmXR2YlC7UFZw5bazs0sU6MiX5T249mMQIhANZRQSH+wbj4brDVWFaQldFJBgoQddq58o4A+4YQKEgr"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.1_1607495142792_0.012770489195924606"},"_hasShrinkwrap":false},"1.3.2":{"version":"1.3.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"react-external-subject":"^0.2.0","use-dispose":"^0.4.0"},"gitHead":"39fc6bba65fd32ff2ba49df97190e30c03eba6f4","_id":"react-graph-state@1.3.2","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-7ng7GgeY2R6rnPp43iRZuvJ5AEC1DjDRQKSbsPLFaIkhz8ejl0/wYzgKVOHGyh+9ea/hiEFZXcxha3vIc8d7/A==","shasum":"ebaaa9c5525f9ea9e558b9ebfaa566a5a8b2c50c","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.2.tgz","fileCount":94,"unpackedSize":457657,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0I1iCRA9TVsSAnZWagAAwL4P/RPyfE17fuMV4sihi0SI\nKhZGPoY7uwZqoUDFWMMDfrkULS0cagBPBiVu+V8eUp4C0mwdoLlj28i2DY0s\nUMQkglKsMWNvcRiiSTv47tl9VLhMOvRnEHrVcd717NhCmK8RZ/iWx6iN4JIl\nxOwWOyTTB8TpFQJygi+jJehBnlsI4cZT+FNJgO47RWqbfhdllKMw8wMuAApt\n6+rfD2BzEd47X5VTJpLgvXI+LMLNLrE9G27JmmN0T5eGZC6LO60tg4SJbwAG\nKkiDOzROj+xS8rzS1m5Zeut73RucrmtvY4rtoC08ACL9J1qLA4JylNWcVh9c\nrZY2lc8scJoFIe6vKCqZHydZST7U4DaSBhIoglaqlrfOlRlKSZCSPk/A6Zsu\noYTTsGSEKa+MMcMZ7CMBjUTgg287w5J3XhY0uvC1dWfN8ZH7DNDqOuUrSL+Q\nVzACNfq6ay16mA8y+QxvH2gSay4vAunRqPyalbhxsLiopxZXwwPMb6EN26gf\nSmkWvzA0qM5oLVXgzZHjqEqJ3BbiVGG3+zVDkvOh/LCaIkAz5RBd5MWbcpbb\nGOPXOD4O3gqWePVvoCITejZC2MW2LVNJrQVZHsAS+NNo9aWSyu84cmlkp3iI\nMVm0SS0V4LQRFo765qZaNsFLzGaBkkw3Tg+Kgc1tCzDuxtF5tVPUMN6jWsnQ\nVxWZ\r\n=84OH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICtMdq4Kpfv8kW31OOdQqkDUDLuFakZjgUwAefmkbYIVAiBKc83QM6PBgjvdHG/DBzkW+GlXpVfsXPHMSuiJTiDwbA=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.2_1607503201834_0.4773214264007082"},"_hasShrinkwrap":false},"1.3.3":{"version":"1.3.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"react-external-subject":"^0.2.0","use-dispose":"^0.4.0"},"gitHead":"22640b004dc001bdf97977da0b2876da15c58361","_id":"react-graph-state@1.3.3","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-SlYxRHMlAsiUorNtGki1y2dcpouLLo5wTI3F3xNMgDRNDs+ow0b6I2qcMKqeQKRxKRaQXWBApbnwCC8QLd6Dfw==","shasum":"18d69718e03dd02cbf48b5367ece5f01821d93c5","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.3.tgz","fileCount":95,"unpackedSize":528828,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0bxUCRA9TVsSAnZWagAA4U0P/0JU60VYLlKhfzSov1Cu\n4awvmZMDAWO33UxFkfhy7KdjIbTU7D3eRGK7mgiXx5JxWWrxMgMEVtdC12P7\nKX/GLsy+FFiP0zWhdM2ripQ5U2xXfOO0Qizxe1BaPEmHtdzedziiG5ucjgd0\nSsf07zaY22n/TpImWeftPBx62pDo35J9xYB1vu8Xc1jGXjHq2syA6I3k88V3\nyZdWyJ9g+eQqYg+FrWmTDrVOqZIM6xroRiAf7vohIp/wgHdEZlcj/Tv03gdg\nvNtY7JDGheknGbSWRnGMswqEwtMptvRm61m1wER4649MHZ5RmznFFjPLJvEa\nZ+xyYUpCS6v8q5tRQgTRCVn/l5npaDn7m3pSLba8scvUBNXNFfx3hw79/+2r\nvrymj8RnN0ybEc+5n0w2wIHudOPrbR7efQ6WrEcSzZATXw6xxrgvz3vb94I8\nD1ZxBgKct/6+bEQwO8skQATOqTkM2JWi1jhB3CJqMwB3qblawsofbf8cbSmY\ndKAKDAQSqshb7Rv42FKE+XaxTXnO7BvIxRt45LQrXCkstbX4vLhsb4EJbGhv\nOpH4BnjdumhfkvGJvGPrkK0dr6MSeJMcaRK6JJSnI2LKohoIKaTodAUHWzpJ\ns//FDYY4rwoFZ1cb45QegQMyZ+nu9CTVmGG8FiYkUay1NtlR4xmDqZl1rkEj\nOsXK\r\n=weF9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC4rg8y7223urZQj2C/zjGYfyJqIydDdK7/uHN4oHNf8gIgG4hIY1PUpBChCcuNht0fNA7wzauT/3E/y1/UF+d0xHE="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.3_1607580756011_0.26480030505210794"},"_hasShrinkwrap":false},"1.3.4":{"version":"1.3.4","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"b457cf032923bead88a3015265ffc18e7c146dbc","_id":"react-graph-state@1.3.4","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-B2vRE5Nt70ZZ2bAlMBO6ZXLFh93IGaRm4YZqQwqoAMeIo4q8n6uV6MG5iyzzXsUnUE6qcNVVb5cW7nOLONv6+w==","shasum":"2f6b3f9d39dc2734d21c516f67080a331ffbf6a8","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.4.tgz","fileCount":95,"unpackedSize":528788,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0b/XCRA9TVsSAnZWagAAZKYP/3NVbfUOWvTF0TN6rDWW\ns6KfxL0pqm4or2IN3wX+UM02TXvUtjTBQ8Nn4uH1a77BQIUol7F8+wBzEG/O\nL6GoNLkf/hJNdKJdqWSchRVAHorqPCFmZaMGPMeRsUAGSTFqKzWKjaZU0m8V\nKFFNj6kf+zWIDHEjMilNNhJ3afGSqqzrYqD5gnyEYyt2Vh0RYpmP2bp7dvTY\nvGRSpHF0QJslXiDDSFsv7uoKj1Gy+kFJAe7oLi3xlb+gfQz/PUirhEab9eol\ndpgbIYQDBTzitfroIKiZ+ETzyuYTTq80mZSJWbqC5JuvBW6FDxtgrllTJT8X\n/cPWJZ0hs8Yhvp6dzZratxw/zdkYM9ouO91k3tpcBEFLjfwiGNTiv+o4zjwL\npm6VP/CLrG9bKdDc4f93wIYw9IbWij0w/dq389zLcJuv1Hdp5ajB7moKU6UZ\nm2IGoetrc1LqfW6u0oUAsWXnhTPoNlLjLYeCiGMTNOPidgaMOXDWUaMiXdnv\nXx8ZTS5bg7NvDxkSC+cyWXHcQ09oyibVDH16REDpm3yDjBRa1VHdxNuVMFUD\ndviCEJPXINFPqMnotiRUqWSADwofUEdH5M8ovFNhiAOpC1e6wSLcT5wNs1vj\nIzjZ9zEpLWvgPYx/QZiH3J3sWGwoEbgpT0ilzJbDkRsZ+MWj9FgaPN++wJOQ\ne8sC\r\n=/15o\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAu7YOzNiyk+tvfYAoT4MfrKOIX82NANfqSm+KNED4pPAiAI1VyXbBNH2eqfKb+FkrdYfYlhrGgsBIG3hMr+W1b75A=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.4_1607581654603_0.1666528400714804"},"_hasShrinkwrap":false},"1.3.5-alpha.0":{"version":"1.3.5-alpha.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.0+b4db839","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"b4db839906dd83d153d8257f5a15670c7db82a27","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.0","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-TKtxH8lG/6cJ7WWZ39CARoMvO6NWUrrEcbNoPp54iJ3R2a++HNlfao+wgvqJcVvQ3to+Arql3d+laTVGX3H6lQ==","shasum":"333311e112bd1d6cb6d8266990f9096fc9529bbe","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.0.tgz","fileCount":97,"unpackedSize":497203,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0kRACRA9TVsSAnZWagAAQVYP/18Vpdcn0AqZBehAXgpI\nP2S78L+vXsUuEdxBu4/T8dZxYvQ/6j6HADYBbvz1I+zfuCEAWPpGRFx7FOMz\nEETydvOJqf8jnW/85XM9UPZYj+kIO4qHYGq9b5dIyXPjlY2uOvjmExQyYw4A\n+Ye2q9gI+foYpRfXJ+lIJ7bRVw3EwCdpstbz9KTdQdLp7LC4TFk+ozpXPvDV\n2T6+8MXh/Oijk1tyF912k167/7/zfW7uP03Z5JEouVMqIO1x63AiOLl7wfor\nXlRHqb6Q7PNbW9a1X+Xnr7c7S8kQNSav5a9CNZQ7Bil+vmAiE8SFG7yrEUZL\nez6spY35X/KfYBQ9IzfcvtlLlDsPXf6J95Bi0F/pUHY6pmojyCuqOxLPxgsS\nxRmNkdmXjaDkn0fYh6daluPZy4BXVFfxKLzcVzG7DUcH7yBvs0J0mx+Vr6vC\nknxTd5e+k1i6YvWOYsvhmGe/c1pU4ulo4KkWzc4vQD6v9bwsZvSeL15wiZx2\n0l3yEa8L6ywmjU9GU2g+o9RLLcleNanWMnhjeM611Aysf/YlvcUn1bmxENmy\n2TW+K3EsL4knz0d9B8MM6uRreKXY/AlFxDBNljKs+a08lG+q+Ypu5ln+btg8\nYWSzkt/oHlxygrV1GiYo53hCD9zGnWs2/OykMuRyI9z7oIMFsGzJ8327k7oj\nH+Hj\r\n=1Zvs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICTLnTqxh4q1DECddLKlCeX1QbkU6Jt8DOrSZDmd2SRVAiEAs9xMGwKWJb5i9RP2G9AFdQIj9Qo1RsVHcZmPj2XC1zA="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.0_1607615551647_0.43239651941892676"},"_hasShrinkwrap":false},"1.3.5-alpha.1":{"version":"1.3.5-alpha.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.1+592fdb5","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"592fdb5933a33e49d0edc7d87de215e937611f53","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.1","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-vzlZpc2bl9g+XZCAyz8LP5X75gafAscWmM1LEb+jHGWhH++2sJgphcbffStZmSi9Z7IvPr1L2JcU1pHoZvLqew==","shasum":"c803e567ee04ae027d0859166c846a8082b2e554","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.1.tgz","fileCount":97,"unpackedSize":497203,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0wiNCRA9TVsSAnZWagAAGDkP+QFrZ7tm0A6vWSzpo6ND\nA3wco8CwELP/O6wFhm0wEH09EyYfDyA3gMbdk4ck8/ryPS2qGaTed4ShYsM3\n5Jtj/MoVA6bL3j2XSrExMEIq1LTGPIQVH+vpJGaOGY4lYIsoGhnAlinmbrcR\n9T0z8DSjX6UOk7uHmD2zFSDItQGMRtI6g8cUcv9D/H32e4IOIpvbBguK9cNc\nqRqgT0LIy4M5SsrlG5IGulrDH4EkJwKYYf68NkjhuDzDYbZxU7F/khIrY+1b\n83MxNf/5a4WH2I2Dao872YoKH/mklwGG/m2FmY86Y1kvHdQUJHngg4EyGTux\ny96v6/sab8naXuzeBAuCMqNmVDkDuzJVWgzeTD9u3Zn9RYR5s89BqgQ3DYC9\nl2fOe1YeVbS0TzXIw3nvMqUedXoO/D2SHPBAJgpx7gJWW7w3c3dZdZUxEODr\nF6JgIEDGZV/PcNA7YpQFRZAIk04WR0aP4vLUSFrf9S0QH0b9xWnpprJ0Z7ir\nQHTDLoA2zpZ/KN17OoLGsjf6qKSOJbfHRLYO6lCG36vuh6QChTE9bmCq7X3Q\nsISgoFA4hfdvSwfqy0Rt8N3plqVRWZXfpK/x3z6t+ErExE0akHsNex/VeW2s\nHU98h/IJytihDYUQRQJi6hNrFNJ7cWNvbMYbtKtt1JUti/lPdFsR8HMA6RHb\nBOmG\r\n=K0j3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFXOKua60aqzU+bH2KEfTUMpTrrVB1YYQmg+hu8+EutzAiEA3m6yQE6wjVNEg+O8OOcs9b9kIdXP3f6WUUehYaexZQk="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.1_1607665804742_0.27589479647639226"},"_hasShrinkwrap":false},"1.3.5-alpha.2":{"version":"1.3.5-alpha.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"ff181440b6e90dc49737d9bddea533c9f555b577","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.2","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-5f3mtwrplbmV04nkNKma8UL96tEKrUudkNW3XxvmozzdRfealhxdzx6NWBtJGmVVc8vVvBpjvarM7/DCS2bNGg==","shasum":"a50f9a3db971797d9be292b36a1b51a9a9ed7df8","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.2.tgz","fileCount":97,"unpackedSize":497103,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0wjRCRA9TVsSAnZWagAAdhwP/AtBRTbTQ+7JaQY/1k4Q\nZ6XQc3Wul+wIZbFa8y9C7z1SquLq3Pp/mWHaXkwM/aKPfa/a56jiVdge/3KA\n/eJV6ysuACm/OcxFr1/YXZXfNvMx4z7u/5KyJo5fcGXCmLYpZzNSkkBWB4ZB\nyJRtOrvv/lxmKbDTIDWiAWCAqnjFFrBYwijuLW+POA544H5VNmuD9ll7u28s\nLyznwDaqrL1xxaQxA8gy2RpSfXAKPtmlSXBeV6iqHmDsiJJBD155JYZoN9TG\n27tX6lgxdEA910q1+mhg2GB73avQ3gmtca5FMtTXphkN4BADvpbPBJnlNxg8\nirGFeIUCgBfQ+GuhsSvHOR1Vn2/KdtCeQtrgjWIxvsEHsy0lwmWoxY/7tGwQ\nUGAhSBF3jPxg0g8/cePMopjnw9bcNMK3eYAUokw8KVnuhp70/X26x5Jw00N4\nOPoNzCM8cptz5Sg7AlnpAdHSWcvUHewr0x3PQCTI74KLUlrbGmxCgRAclDfG\nYwmlt/MMa5dWuqWqIP8uWX3ahVWL6Mj8MSCYRnWJrHneEYGqrUakQu8bjvFZ\ny4DrfrA47L1FnYbU03jU4/XMxpbkTO8uWuaixJrxbeKGFk11C2vKRCoNKC+S\nQ3P8QLG+ayTA1sp2fVvrhCQlwZv+1KpLa3rvizABEYpxOR3lyVHfT8gNjHFA\nPQvp\r\n=F34H\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCdjh8TwkrDbPktgapv0CWcRpnuRknwpZ5EFsKciqy3xgIgQckAomDmC9/joGgau4P5h1HVeN6t1/fS0WYJ4sAfTwY="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.2_1607665873330_0.4057454887405165"},"_hasShrinkwrap":false},"1.3.5-alpha.3":{"version":"1.3.5-alpha.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.3+9dea32d","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"9dea32d3e93d42511daa8ff9e8cb27dc8d8c28c3","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.3","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-112wNzZXeUQ5XeWEGeipVWL0gTD5W14sVMkRhP5ZRhoB3lnzoE4lnOJpXgmdh1r8x0DGMIePQPsJiG0tR9y3wg==","shasum":"f3cc1ade2bdf0a74ad1601a7f3d46054f5f8628b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.3.tgz","fileCount":97,"unpackedSize":497119,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0wvzCRA9TVsSAnZWagAA+sAP/jFaqVlp/e6CC+wLsoTr\ne4YXbaiPEEJ38vxRHrMIkHu4fd/yZFbgRskO7j1t+iZDOKuzzg+Ju1TIUceE\nMXGKkl4S1p4WNiPuAatQ46OG5+ZmdFgZJIeJTojKfSo+LrWqtpFCQvIP1XOa\nLf7l7OmxKzLQUd5eOq8rauqigdzgxRfeA0/0yz4qFRytnWvfJvJ82XYTfpNi\ntXXPJiPTPc5x28GUHRRSMEFljTFfQDzP3tXDGcKDWXEP+rAoiFDCl8mp9Wg2\nOscawtv5DEOe6hQim8KqCb1VvBHNYtDhIC9xD8xFBQY5B08eKrymyZcp1rdX\ntSls8pejK83hQ/NsF4+BBA2mmGfP0ABj9wIZT1l1ix6ZQd4ZM/+mNKqDQwsL\nnBJ/P5G4auYPUtGkGLstuOQHJE6eMqOGx4erUVCVBQ95LoQnDbJVTvF5UFHM\ngZWTBdk1JhNAdaUyxTsW3iaVgzh4rvJwCWl4pg5ESRs7IvZOq57Y9AgeFGe0\nKddfv0QMMxjwb9aFeyiVwPLgpBkkLj7ZYxx/JGOZnXg4nUsYekbeiJFHae11\nSziiu2nazKuUlMqEDPxKx5/1h08EBj+sAqZEfCo/MWaHJXt2Y/YIqRnZZPIk\njeHKZ2j9E7pGr8bgQLfTlivaxjpB8OGtFsnXcKPWNLh7ujG2KvKGwWF80ZuB\nDw/v\r\n=+d3d\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD0Q/OITf0zebntYSYleqQR4eEvoaBArzHl01so2PqPxAIhAOSHaEbMIPj1M54WBuJV1qWi4QX3FKI+tRpalHaXK7f7"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.3_1607666675349_0.6266095246780292"},"_hasShrinkwrap":false},"1.3.5-alpha.5":{"version":"1.3.5-alpha.5","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.4.1","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"86cf715a938b0d60804a65b846f8438ee95403e9","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.5","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-mvjAIXdt3u54QeDuh872wi3cQ3KqSUdCyTSZE6ujDTIOSNkNcnLt1z+gTYsdsCGyzi8lIwBEdgV5EVt2MvHt0Q==","shasum":"dde7159cbbd187af393b01902686d5c5146ba26f","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.5.tgz","fileCount":97,"unpackedSize":445023,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf0zYVCRA9TVsSAnZWagAAIDIP/jKCJdXTQFIu+NEAbPRg\naowGCPyQS5St+Va40kHllNQYn/eyAosnjz1HDgXqIK150WIHycdBs1UqX49Q\nez8kdtiDSNa8RnL81x5yBKVahDvQqLxThBf2GNlVgIwUq528StpGD7+C1Rbr\ncE1W2kYLg+aXZHQpG+GEO54dhKUNAEHGGIn5fcLN6bDVqNG7ePgr3Gj7xt1r\nparlotujgCj+uh97HH3q2CtwcKopBTeMGCo4Cl6QExsYE85qRc3qItLlVqOz\neO5FGvt+oKKG4J8NqHJMOcLa8ihXhrMz3tlu5mkTbmgoevEOUHMi9Upk+3Kn\nSBEt9HyClbqjqGuXIhxy1JM+sUPEqzsMl6VJt5v4pJg7dE6b/vCd8CSr3oPU\nD0iTC0QzdrlKCPuu2YawWIMdsnE6YHLn/KywVw4aEOM3hisPHZniMcBCbehd\nhMS6crdQRDjLrr/4Gqwlx0TFR+48OKJkNC4JHJ60OQUUKvczTA79lU0bgrjd\nkLlmrMaBpISaqmr/lE/e4UBaZWYMPBV4knFNpgEc/jkozsXW01hc91Y4i8xU\nZVkp79B447PbiMrVdo5Csrhuo7Hrjr0KZcAjcaJJuC0WzAnRV5fcrnoWs2Nt\nSE69LcxMGgLaJAyuQuL7i+TkDETMr1AvmDMsQjbdF1E2bD3AWa0mPqQJwccw\nYQPN\r\n=aEW9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE1byl+7B5lArQ6ZD1Rlj2OkodSG9xqSITQTt8imB271AiEAhQH1kZKxhMx3NwDdm+hIOjBfRZSJFjN0DKEb5fumAnc="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.5_1607677461320_0.5958351663793431"},"_hasShrinkwrap":false},"1.3.5-alpha.8":{"version":"1.3.5-alpha.8","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"7a5eef7c79d6578dcc7eccd2c0a082759b38bad4","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.8","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-hNLxjVlYaYQ7T4iT7mWN7S/KRJ4e7kOKPZChOy8PjokPsDTHwgBb/0xs1brGhgz/dWBTiwA/W2HwiL68VDkOhA==","shasum":"267624a78457b2b2c24cca25aff9fcd1cd730303","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.8.tgz","fileCount":97,"unpackedSize":468590,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1EK0CRA9TVsSAnZWagAAWJ4P/0IiXseYAc0QUOBFH4T+\nQu+ocbyalENjxwUnfbpuxGQqvXL/erYu7KxtC0+OGknmKq6qXxNifv71g6U4\nMEiC8UQIiZP4NqjSl347XrGbg929QgcXsCz5QfotKXZLF+bRRwCTifIWM4Le\nFV1F4AYa2WoLB5Ba2miXFwCP0t9QYDH7OP6BNTijVwHembwskjaGKzHZ2VGK\neCLrfsRg43kwMCMkPutn4qmNt7ya8YaybldM6kI7RAvoZFqbEGJAg05krVrX\nQUWoEEmgL1ORdJASNxjlupvjR3WsYgymf9LhPO3BD41qbL/wA3ZTQRFPwBxr\nkRGuWc3GWUDOQFVTsst06uTn6QhO22WLkLzQzN6nRna5RmTiOrsmvlG6S0td\nY47O36d1HSSjd5Al+c8zXXgvZ5J+SAA8fPLvnIJaZuJ5KpgDaANiS0yaG850\nK1afGtj9ddtxUZ58IkwQ+QbcybGYyst/TRC30NuInF9AtAAw7ASNwzo/Wb6m\nn4KDqiVfvs12LpqcQSq6IFX4P9aI3PXWAPgkAa/zgQlsakN83PcIlP8V7tVS\ndnUDVfuEzpEKb0HSY7z+HcGwLxMLRxtrFDD49VhbNgUVQYIyVrVzndu/h6xP\n3cRB7ec3UJJrsDLtpQQCLrNi6ZZ8hhBnt+F0DOczltZVSa893x3/5p41sbRw\nooaz\r\n=xOz4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCx2A1lZao6l3vUU9NB7RNv2Uw1qqRnGsOE9bMly493EAIgI4ZkrFmMNVq1+udJjzc05BBXNbhNmmaS/oUkeJOU8AU="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.8_1607746228334_0.9507077873541043"},"_hasShrinkwrap":false},"1.3.5-alpha.10":{"version":"1.3.5-alpha.10","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.10+2fedbcf","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"2fedbcf880e4fcbbee50774ca0727fd1dcc91aea","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.10","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-8e2WbQtQsSCdPGasnZqVGofT1pCZa9FFEKOEBaXSnT4iEnSe7OIZEL6a6tlZ0BYEo3xU5y88vGtIGLVIvUxtVQ==","shasum":"be438dc78e2398c87310084ef34c23983e1da71d","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.10.tgz","fileCount":98,"unpackedSize":445443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1EpnCRA9TVsSAnZWagAAe9QP/2uxf9/FjmY1SuCuK91f\n/DRWKQeYgSKoiM0Wj3yN4RPYbc0wuk7+bSZCBzKvvcXKlZv0iF7ZzaOjFB1v\ngtqsltdWi9fXbCEZekpxQiafFCwcpq0JzVfJOmPjW3LAIm/DbudUwRsCREgw\nXuKYo0F8BnBMoAATdKKJjTrXfrcfa4DenQHU8YAxD0IV/yndLtbK9NLIoLPs\n9ClfOfCo1IdSl+E9TeyrMt/f92oWPA2REasXSQa9DIM6Q68WW8dgocrw79AA\n47jzLXWx4f4VMCytf+/FUbdHBVjiuE8uUToRWZ9vUqChy3Lj1E1vLkSIwMM9\nsA+m2fQVnRQA6sWlb/8Cgpui0m9bZOOnom5Yx8J8ABJyaPpD21jLXNNowMlf\nIakiPWoWki5PDB2HWD1JRrIkq4abDEYxs9t9FZXtnvDIKcHKGRGrTKT1N50/\nJ/bmfilINoAyz03Ya5ePbANS6+0+BYjNL71Bld5PdiuASfgtjSaFgXePBZaN\nkVOBuxd7IYGag/c/biJd8AkcdIhIEPCpH9+raG9USTsYvFGw+uZ8b9vEVJWK\n+5+7ptBIjaFTuo6cZT3kDzwuHdIzQT7nu0FtftmMl5pZWRJ/S+hexzOKHc4V\nW7IACkiru6HCfzIFzRWZXlG3++Wu3u8tPhZeOJCy2zwg00FJQz+BAcmojltR\njJr/\r\n=N24W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH5Hagvd6pGBsBKaCU5R+EQFx6NeNUbzL5GY2WVm7BZbAiEAmvdCAU588dAIv3yGUWrYuZKCHEY/tRTVTTWSqHnFR28="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.10_1607748198836_0.6098399179794907"},"_hasShrinkwrap":false},"1.3.5-alpha.11":{"version":"1.3.5-alpha.11","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.11+ae579d2","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"ae579d2087b53337b0f900f508784c15ab7c09ef","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.11","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-N5Nr7aD2VEEqqCKuhuSAJM41nKSU6sO9Be1QFJG+pcMcsAi9J+0F0K43+ySyVBUFrSwnRV2sKEW2p7+Scf4pfA==","shasum":"04a46e4fd69a238488a23f448c8f2c7394dd4205","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.11.tgz","fileCount":98,"unpackedSize":445443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1LttCRA9TVsSAnZWagAAyTYP/RbOaKPlDgyDFi3FrzTe\nt1uFimto1uqn0zJqLRMi36m74blhjJ8jNOuk0WI1ScMs4OqA+5ZeTcRX/hhY\njFhO4fPs+lEfN3XcSB1qZWB2lLmUkuu1Y43icvYkqXAM6NsLj0HD0bkj1O7w\nVgQFXG4s8FJ4fJcpzOMqq/qUcStsCfW2025nWr0Y6Nl891dB9PdumVO6I+YI\nw64nRHf0Y9VV4hHzShOUBZH73uH+PF+JvGt6i+3qLfKG4M5FcJwRC1xZRbZ8\nE1gdJRKpSMiltnsk4tSd9eaB2++qbD1iLnwmmzAOGsKMbI8hwyu+ZJK7MQtv\nNQj7+mpueG4PR0gBFJbyX66FJoe9gMkx9nJMdrOdvjTwkGHR9wNdJmifUGaB\nO3xtJiFQO5UF2CMOgL8+lM89ekuZp5+nSCJBlxU7/qkBXjvEgdIz3Zg3DPJa\nyG1NGzbjSjpohrXvq1XQtOosppoEERVNbATi9T2eVKeLTz8/eMN5544ur5WM\nJBqPhI/2T8r0BZVOfzuEXFIWsY5DEPGVoJKgUEr3KBdg+7F5YzwgVcWUenqW\n+4O1Nysc8Yis5qCy029MD4258lV5gjXQL5BzToZJvkCnvUEdKTj6pWKJMFDK\nkzwU4tECSxHihS84Gtnllbm8fYKhMrxYuNG7e4NQaji1nHKm+fvSwTNGT6Vc\nFJyo\r\n=OIhr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCS/gDaR70MzAjAbaCPCgj+wz20M0WPD/XnA9wGOqLExAIhALHOQqI5YIK+fJyeY+puauBhcTzsLBvTIN8xwjNEqS8R"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.11_1607777132388_0.23336540044283605"},"_hasShrinkwrap":false},"1.3.5-alpha.12":{"version":"1.3.5-alpha.12","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.12+d3655c2","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"d3655c2c61823a379e29ab2204b010c329f04cc9","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.12","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-b/0M9/iyWUz+or0naCfhwIuijUu5vpEsh60kVhSbT2+agqUABBPv76jNSEXTTCxL7FLY2Z03XtwUKo6atIff+Q==","shasum":"672bd12bdb2e8f8654a4e01fc6c003f49e2de457","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.12.tgz","fileCount":98,"unpackedSize":445443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1MPmCRA9TVsSAnZWagAAxpUQAKPRyeRXzlDuxqXCrd+G\n0HkIU1bj0wDa0os01+z+FSqu0aQlWW0IOEy/Sw4HqdGP7CFsCY69z8yejkZQ\nwmNG34rGLidFuCfbVYRSSWQCtjvHR4GCHNPPsu9UjgofxYMEW/uqc3GezjG4\nWUlzEt8xjtm/hD2rfVr70rJSM1o4/g9Q19x/C1dwxH1Gzq6ZoBvKg534tVsu\nGn98ol+ZyKRdxUFLnEWEPl7gGzJT7N0VDkHdWSH1scu19a+e7c8qRxUDAiAE\nraIJFqtUYxDEUHhPrSJoLG0gnTmcF15QrDCPzw98g5D/7LlDBFd0S3xNjbu8\nvkA//EyGFu2scFm9LhvpSxyEUFOpKEAnNSOnapvRJrydDL08SWIGxCBTOHC1\nTLvIVFZJLYjg7gn6vpHBOXmMset97lOpAQMjip+I11FCpg+N2JOYPZMJmt9S\nNbQCT64MUm7Nxzwa0ND1mEEFQHXllBC0Dn93UePspmp7zhoJzF6mia3Qx/m0\nZIcntIeTVNrE4Aumtur+IqAqPKrovzizNtHYNT/P+g+aRPXspAqPjt1JhRTf\nkIh9gU8sc8jtaZ72+3VqG0jlwvhzjje2XKYM0gmIlR0rB9exfFLx5AaSVpQR\nnbl4nFvW8he0NfPTxVmPvBGB9LyNhfHf1yz8gxyCUR9cMiPKSVgGpqqASWx1\nWaVG\r\n=Wmef\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDBTRaOgfxXuyAGPlpE7om06uI3nLSJPc5y+YHpAFXtUAiAKt4GIPdLDoG6cVpiWO21aA/Ibu1a9L58ubME1zP9ddA=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.12_1607779302401_0.9319144726585633"},"_hasShrinkwrap":false},"1.3.5-alpha.13":{"version":"1.3.5-alpha.13","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.13+20c9bbe","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"20c9bbe341d83ff0c1abfef19d0a1f0a040d22b2","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.13","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-/+Dx6xqJLT24KOUvHKbQ4w08lfU4+xNhUL08jDabxSrB2HHvJsk166DWgpRscVXRdJEMl/dy1gQ1vi2QqzBUHg==","shasum":"9e3eefe78bb36ef3df2cd9dcd133496b1c313bb4","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.13.tgz","fileCount":98,"unpackedSize":445443,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1PIxCRA9TVsSAnZWagAAshUP/3BPxx9qDw9wKbrwx6Gg\ndUsDsP11ZezsSIBveHJHZujauqvkNUeTNFRe0Hvc0xWYRqCQ2mKt/jDf0EPi\nJzkwPGdjz6fZhr2ve5JvbGimewrK/kJ059FuXISQspffXI/9mYPTH4OkwqDh\nr/CTfHzLmQxQfJIVv6WzBBbog8pPg31MzCR5qoqgTT9cztB10m7bIFEb4lrD\nRBqUJOfYo/R850pvAP82lkqpAfsvMsbKjo2bJyXZkstjyUM4efNFjCP08/K1\nKXbSpKnqa5F4UTqpNDkSepEC1VnYfofTO/mGo1CCuj/U5rvK4fw1eJzo5gy8\nEn1cQGPdHNIcjyxWts/chIzQyKas+7ogjSsBz6/1jwRpGbFteHsWDdJ+hAYJ\nwwWUa0nQj9nVtW/8Lkxog+scWoufhCxIvvL1KxAYSu+YcJe6IkBa7qOa++Ot\n0uP3XQCR32v3QB9w9R3IGLLTQ88ETTbAV/lNCNDdqQDt/wjo4kq9TG3QUQF3\nCaT7UBfqB18KPA2jX09i+J80TSIPU8wQTiT8TBnR0+6qWnEzIw2sR1ysIbJW\nsc2ulUMDhMn+coVu/CeFAJFcTvlid6d40a0CF0X15unyeAFp5qa+j1ouGziU\nQ/G9MqUrtJ2SSsChw737B2cNDtYcGWxXeVP4DxTpqLqAu4kb6sgfJl8zDRhG\nVOiG\r\n=xWQp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC/KvZsERSrhXv/NLB39J0Ycghj9HnqrdF3RKvPGRqetAIgchXdD5MshUYGM4wiK9TjwzrkO0cfu2vLAlhf+g7m5eE="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.13_1607791152790_0.34559110574733287"},"_hasShrinkwrap":false},"1.3.5-alpha.14":{"version":"1.3.5-alpha.14","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"b8587fe7cf35a1c5743cdf3799c8d54672abe3e1","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.14","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-S96cilj/hyhKoq8MiIImiULKg/JIgEcxsnXEs6h+j3k7+lR2xPimgkP4mUuncSzM9uNHHVKcbSiPzZyB6GFVLg==","shasum":"3d644e49aabd99c8f9e3729d2d656e4bb25e559e","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.14.tgz","fileCount":98,"unpackedSize":445319,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1PVdCRA9TVsSAnZWagAAh3sP/j9QiV8ez2IMvgFIBHle\nWeAiu3oz4pk7sNXeh7zfPljFg/OrYYfvh669rSfgd9pgXuj7JggetOP4lHCG\njYtIYuAAHnHXA0Qc2AWsuVIoEg4g4paWE3PKXnPlBUGA48CwV3n+W9gOOJGQ\n6ouOIcUPJmDqZ6ZEUwD+F1ts4bozg6+cCOvZpOpHMlU9djdtSJaObUNqR/ZJ\nXvZ+sXGyjZSnN4sncnOo6/f8uPKo+mILpp+HoT4J5AqdTJV2oBnOcNFtL+Jj\njHy29kUzQfMO9mJ0N9hYsVRFlz6dR+T4BCjfb+HJc4gAt/z6/dA2XCX6Xt49\n9BEZnLUcRzuJjXteJ/Zx+OsIRaWAM5/F/SMt9LF6kevIaZpfnQ5KHkq8p6yU\n4NaTfQSGEQgbu6qirMEsq/nD8gWiiMTlOO61vViXveSJf7BO8YBMwrytuUcZ\n+GdPslvuZqllxVnb8EBE3kbPZKxeLD7FA85EqgVHbOQgDFh3qafIRqa53S+4\nx0CrGD9nrfFXEMns/KhIVLI1Mv44VsKzEGb9xYTPriO2nONco6ILmDVaVRXz\nUq+kzKEUWLfYBDu2g78qgI7hXP8tpB1FfvcVjR+QGmJ4y8/7hdpI2owkMqvG\nGTiq3pzCOWAdy9PIjB8hPQqJJi+fFN1LO5yyiuFgdBtHV0tuEKN/2sDh+vLA\nWa9q\r\n=gQ5w\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCM55cQXXWIQkrsNdwnkvFR5oYVB7vxd0vVfUHig6SUpAIgHHQc3sg7tGhHRR6YdaBCscwtWo9MCAxzNpP8KF7a228="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.14_1607791964561_0.7647861735373183"},"_hasShrinkwrap":false},"1.3.5-alpha.15":{"version":"1.3.5-alpha.15","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"de3cc51b641a0f23a07016952aa2197a36b210a1","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.15","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-PhWPAYUKX+D2KFaKrtIY2Iv/TInYCn7+Q25MpLYyNBX8frc3mnlldjEQN3qxwfzabLwQp7GruUI+3VODL6GYZQ==","shasum":"c6fdcc5d6e200ea155fc8fa832be62801c06eaab","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.15.tgz","fileCount":98,"unpackedSize":434390,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1PZLCRA9TVsSAnZWagAAtWsP/iEx6HHLnPGzp2cfxYx7\n5ovcUu4CMb2GGenPOQOOFbfy9DvuuyXA1pN8ILfYnm8eNgRmx9Zc1ByyXm2W\nkG7Sr3v+SM/+BTmwJVlB7aXypyPdSutg7NwiECYZIjhk+mg1SY6HKUH0yfI8\nKS14z6V8POTnH1hE0cht2s0h824fiUXKKKUIapndnKJq/Ou9+dFPa14keGAN\nGAT9ZXbW2ZF1uAhL72EFf5kv9FOX/JRw/2KAElqZQea70fbe/s8Ec3ZtBZ6P\nkwzoreu4Jh852xZLhjtXrBhpHuiJ/+1UzqPsyXvSo7JQhQJg9gow5FLyJ+Xb\nogOWvx5G0iCH7a9twxne7ifNnWTnSBN5a+BIMsUtnLKmr6nDl6QBClR7Xd2z\nTvxpM/QJtYgsVg/YVT9WRSUdihU2C5ZYakDqnKuesI/3Oh5e3bQWhGzWfrxm\nKAoiQ0Pd4DJ/84emFikvjrayBQ6I9gimZ5vH0DfJB8f28KUPh8liWexZQndu\nadGS9+RAt+yV0BjUarodGyEQdFm2FCpAQEfbDO8agBbk5OVcvTbMgCV/PUd5\n9lCc0Xte1wS+ezwSwgwa9J3Ojxc076u8aHwTS0AVkw8MKvy2Xt/7MWE22i9s\nOO1mDpYwK4z+Bc9sc1PoCaGkO5PFobt5SqW09TVUJoFJV9xdzws0FG+u6PtJ\n3ARH\r\n=3+8b\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCHD2OIZHC/ADpQnzxXUCMK5vI2pM2afVEFxLk2Io4WMwIhAM7IR66kgCa46/Zz+0HSxW3TdrpAPnFjQMoa4oP0/Ptz"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.15_1607792202696_0.7615477171246086"},"_hasShrinkwrap":false},"1.3.5-alpha.18":{"version":"1.3.5-alpha.18","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.18+8fae340","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"8fae3401226ec1af30ea31e1d268bdcda7565af9","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.18","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-KzQEPbk1RYc2ChYpTcObPL1vgtxNo0WK1OA7CHPl0wEXvcNTt6o+7C6ZlafhX6znyayKgtzeftUzIQKsXqImUg==","shasum":"93042e286da77e9ce0dbf71e91023e8cadf05488","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.18.tgz","fileCount":96,"unpackedSize":427480,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1Po4CRA9TVsSAnZWagAArAIP/RWNuLtbgnywNI4sCRF4\nzjFZ0WHihq9LZntXSGNsw7pJRmvAIi77b8QA/9zrCwadd3CMZWcyrjx/3fx9\nA/LnVYz+jswiHTuypNBriEkZZdpZ03VGpu4wDMC6piumK+Nwo+7n+FwG+Rhg\nikZ/zqfeikY4RGd3n44WlamQhQOhVtVQcfVnT6DFjnc8C46miwGWO46N4HUO\najW1pJDsHNgMxYFEEWyVikfzBI0Y6Pe1eReYATu+v594/xjhfjmKIbR23YDS\nmaHBeremc0U0xlnUHx0WYBNouLE9lUGR02EZgYunRYxC9nHTfu9XmmZZ2giO\nKLWg7aXogIjatsG1d1d5QCBjUstp2BuPGatG9j7fupWrgKNi/QMsdiyAI03S\n4LolUfaAxD39gIkoqsnU4r3b0oT2q4yS2xs9R4SLCpSowOGHmFlRMN9CBzw8\nTjIdL3Y6sWDHVvjuLx9pLdq3lxi+0ucvcroFCA1j5dpOTU5yxYNm7Qm+54aa\nFqQPnE4oplHl9lxG4+AIa5xtJNWxHrladxI+r5MIS3gw/zIFoxA4K0iqKujx\nX1kXQZy56TivSr76cr346bbqKvqUAzWC44uLvlhbwyYhVTWCcTLLzmKAn44I\n5cjcKZjnahBsjSxoITXBlj5unlNdVPIdGzz1s3879ISIAKEoFOFYfvNjmEVq\nyofB\r\n=8hry\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHUj6zbinl/y9auCJlLOhyPkqFwkiz5B8a5/D30rl2pWAiEAiPqNvf15tKQUK5cElBAHG0ZwDF3/wRkPghfui/qVG1s="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.18_1607793208402_0.04697642358799481"},"_hasShrinkwrap":false},"1.3.5-alpha.20":{"version":"1.3.5-alpha.20","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"32beb774fc4b533d84694749dcc773cce356fc55","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.20","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-rSoiQLvXl5gJIJd+pjX5mqE4zwrdaF9iE8JTYj4ns6IcYYp1PbmRUxxTxcryIwS8WkL6o4pjD/4yT/aJ2cNrQg==","shasum":"98bd740ea25b8ea7a91227358b512c646f7c4074","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.20.tgz","fileCount":96,"unpackedSize":453313,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1hloCRA9TVsSAnZWagAAxhoP/AiH8W7V7GXNAZoEDgr+\nZfuuTTVRWCU9rS1hn437b4e+DH2my2U23gQNdSpTZVzZQXlIH044X2Sv2hm5\nqvOyqEMsPhswDLtL6T79j+62/mWmWyX/QkCyP9i6Yz/bE830gf+aiOCRbl9e\nMVHF2wsc8k+Shni3E0BxHcKFdvtf/nnEw1tLJxb/JpQG+/xUKKQkvxjC46/6\nGh09IGcuam3lSrOVwkYBMbsfsiI0G70TI6SEWUTvMTtkL85RQULzTmBCgcX/\n8BLxj5veuRb5o8eNk8+IcDTzeBdTwJtlkh6YeTITUfoz7dQFfYXooIBuE6tq\njGxFy88iXnD3PLnvuRPqlUJWyuEvLmCTZ4rp9cMsRgm8Myu/3f4Y3el0IYty\ngTW1zQDz3T7+rrvR7bu/bO0i/nukpDHGslSeYBNaa4b+Kx3412KsadQXYGjq\nSJc3duk3lK7ZOoJ6hXMteGFu3tB4G9TnIvfCg5oln/YigRJmHcB+5Mq9MInb\n6VBi2/R7gA2gschZmhnTjxdTgK+VLkmHqRjI+4N6bnItmNm/ebyuVBt5lusc\n3jfBTOM8Vvk6AHxxUQZJP4jQp6baorm44VjyL2Qprh4q4RPyHCNFO6HHQsOv\nqJXCMrjGehLR+yHhJEpWiL+7orJThmTQRzA2N+5CnORNnYHx3y77DeU4h49w\nBw18\r\n=OlqR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD6dJjUed/MiHP1Z48WfkvbcUX4Ddt2ZoJsmtpqXc8N3AIgIkY7ZHzLaDxJYtOl3+RpQdtD0wuvz6MOx3wgCdQnUTM="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.20_1607866727881_0.9719484466588018"},"_hasShrinkwrap":false},"1.3.5-alpha.21":{"version":"1.3.5-alpha.21","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"0868a4d8b0dfb09b097b7f1c17aa366d91320727","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.21","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-1rzLUy8m3SaVvHN+aPR4ym9ZROpG4X/aUa07b4TzCqTgjegdTZ6jgeEGitvs1ngsMFFb6WXrg/B2SJQNgJ+iCA==","shasum":"3b8f1b7342cde36b9d0b6106d9160afc2d333d20","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.21.tgz","fileCount":96,"unpackedSize":453682,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1hmUCRA9TVsSAnZWagAAzYMQAJHomnChHsrVZJMWI5WB\nB8Cs9tfBBBqlnauLrkdcv+N+CWwgeoFW+vIPdWpQiLUz7MXD/8M6OpvJOEnl\niQaFDSh4z4ml6g15tfXWBY8uebnuLEgiUw/NkxBCkl+jhlmprGkqhNwBYxAy\np4IhEVxgXYhh69bYOHa6z/IWhHdg0omCyOqaJiDSfweQ/sqmmTmcVEbOyw5O\n6AyyynG1axze9lo7xbqS+lifTElgSQnQdxky3vG049leqLJrITaVoFTyNR4A\nIYJuWGol1HdwclzoA3a7U0eb/ZMSgft6ggSKiYClxpNSnEYA06GoYAPJOIad\nXkKlHlh+8W6Z1TRwQorIbgLn0mRPEIZwL9BhjnLwlDqzVkqFItBewDSEN6pI\nEKFz9NpGKcotJPaevv+fA/Oy03qtfxCs5k8k+CnT4vrixwflNw6ju/HzcPw+\nozYelyjm/1wcXNqkStAOvVDmnI/fIfufLCPhA+f0hhQIoWFCraJ4VU41PY1k\n9ay4q90HxhPZL1hkC/vCcZHR7GjV5lZmNT9FDTDaGQV5oaVkYCskm2DA/ykk\nkYJRRvqNuA98nRyU22Op9+LDBMirEPXJi0IJu3mN6hOS1wHkXjdPh7IPYD3k\nuHdYe+t2iGnsP1nSLnOLrckQbzocrT9PaWstZjb8uZ2al7VUYU4Vvh4zgttF\nxbiU\r\n=I+1Z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCQ+B5UR0bA6/eO52U+cxmEXV1DMYeM0WkV6iTSTJAjBwIgOnDGnRpxidJjtuSHWhUP2Fsoyt9Wzg5FE1Ze3kFKdjk="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.21_1607866771759_0.06422566555339726"},"_hasShrinkwrap":false},"1.3.5-alpha.22":{"version":"1.3.5-alpha.22","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"b16a9a75152dccbb68dbda02cefacb01e2c0e4b6","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.22","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-VsLP+6nb0cfcn1vzdtpk2v/YA9gfGTvWwUBrNIG0i2DS6hTtPSyUTdBFztrVjCRnbi7qiPoilCFUaQiNV8Om8w==","shasum":"700b223a23bb8258ce96c335e5438623416a1b2c","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.22.tgz","fileCount":96,"unpackedSize":433528,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1hqMCRA9TVsSAnZWagAAn2oP/RXu/afMVIqBhrTt8bsa\n1taPLGpkNO2wL2r6CcKJ0BA1hQTTr/vD2SoVTSQYXHHkXwD/+DudVyc5N/Kh\ntMSFzFU1kepcCVBWzeGngesbLJ8pejf3cqkCRUdopbi+zI6os8OaJ0NMkgQ8\nEGolcdrU0yRQ+sYa7YEQrhd2vrE1UlyvWxr/2jwhSRTzL8QbYvrYgf7QHrdt\nMISocBn8TzOqVk8SlKVYsWV0AHmpSeqTH7vTQhgwtNIVnO4uUV2yuytErIsx\nhzh87fak5qgxO81CdXRkzrFJzutnUGe6V+qFB4s1DuKP6KhSGR3BEZk+EV0Z\nmufv1/LoTakU8RTAHTt0SvEoy6tbgb3EKCiq7H3KZbyKzjv+M6/2AZFROJ8N\nRti3iZ2WTHZOyOZbF58bF/ey3lSuyEqbUQc9Jufl5q9HH+ZKewjAlWLhkgOP\neR577GabNISopq04l3hVyg3oUvjz1PjFsjcdJc7u/X9IT7Kk7t9VXTj5yen/\nL0fK8s0vxoTwoTTG/H67S3jUGJ5hO7xZFVpv9AFVE2oROw2h0DwoTYNn3sO0\nLSkil9ljdRlbxhKC5dMK6lNxLH7DXOou+M6AJZz07+gR+BqNng3IMAQ8mqsp\nRESFMYHiK6D0rLdW+jvpD3ZJkZ4q6nMcYv2Ut6myJo4yNI+viIBGpS/nPzcB\n+aIF\r\n=ZgGa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFJIvItT7eUyJhepa09HLKknK51EfaGdHZN3k8THhktdAiEA6MXxVeii81J27A9PaO6NsVick+jpCSIM0BVcnirDA7s="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.22_1607867020425_0.07046644516302614"},"_hasShrinkwrap":false},"1.3.5-alpha.23":{"version":"1.3.5-alpha.23","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"12403042b94ca99ef27347050dbf526716da846e","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.23","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-8H2anNwuk0he9f1Hbn3Gv9cl9ea/ThNEVjUr/bRB+EbzEftvk9yc0APoh6eHqeHHjZ6nhbvHUvnveKDGa5UQNg==","shasum":"5cdf4f4d76366efa300bd386396ea84f651dfe16","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.23.tgz","fileCount":96,"unpackedSize":442311,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1h6gCRA9TVsSAnZWagAAy4YQAIoxcRVwtFE0YXalxqnU\nOFYHCus2vpZMZNq3u/+iQlhTqUDaKkVeztkRHQH6RtojwgQClL5RcMg2Ozij\nudV8hXi7PnWpMPnUPmZ4FYwC8xKLXXKDduXpB2v2You9yZBsgMXoobWdE1Wb\nTEoCgL78WWJm7CMEgObrtuto7N9wsCpbDnj6TPvR+TQUGjfc7bH+S+Hxoj8l\nim1BRMU0cq+TerwZBNg8ZwnniO+ScWS5WfITlO87dCr5Rkat2RPtalFSh+MB\n8GJe1DgeUynpAWGjMSOZbODMlfGABqfWqwedEj1PUzZMG41IwOHMjQTOVuoT\n/TFqzApRNWng+0AmJwCW7H70GhERSBodMxeDYN6whqak61tSv3SETObjMAsS\nJVlgV5NF2eLhub9br/vST+CrxOLb9gTf9FT+75EYnLLLlHJUfdRSVLgFuA9M\nyWD21/9BMKxPaK00PlqeeGNommEk+CwDeCzMGvhcU0TfSudetMxmpfMZ4Kvd\nnwF3Msqhx+dlmqZyQRjuOJIqwix9rr8k9XbAPo6VyDMgQ6ByubMp6nMhO0HC\nBxJ9uVmeEDRKg+rMM/WHvI4/KFZnPC5c4UOfbJJD2P+TesQPqeKg/Y00Cesg\nRAHarKazuAB9rKFMdovItoOHN8gcyAXZgiEkm2ChxV8dbqGYVtn4kXcRCnA7\nWZ2q\r\n=73Rn\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGyt0PtkIlJAkX3u7+fCVd4MW0xBDPhNi4HQG5jAmz+YAiEAtvePENQcvhnV8mAqZv7KjO8Cic4w+6OXnpzDRy6CN1c="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.23_1607868063625_0.3888487153003428"},"_hasShrinkwrap":false},"1.3.5-alpha.26":{"version":"1.3.5-alpha.26","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"32be39f310f512f8ca7cac9db5bbacba86b8a1d8","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.26","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-5RTmCkg40rbBEjxG4E+KFHBm2IUJ4CbOLQdJyoEBbwHI9F6jkGDciLLv/MSzOYZ03Tm6KhIHeBQT2h83dLRXOg==","shasum":"954a059ad514544f1affad85ab18092689e4a802","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.26.tgz","fileCount":96,"unpackedSize":440431,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1iFPCRA9TVsSAnZWagAAEJEP/0wa6jFIJXWITpEAvaFP\nGeLRSsaRqAWxXKyUkgs5dOU6u8xW2e5aJh73WkpliGqo+4ipQkZFw7Y7w/Z8\nqjN3WplcbVt4sFt+X/BChaSOBXw2PnSZfBs5S7tzaSU1f7lpzbNnpCrMFUFc\nJ/G+QDZnDf9UUE6r6+BQmGG3PymCs0Cpg6CqEFpA2QqYsMoW+m+0GS3fkruv\nzywIkqsxLHRuLNANGN5FX3/rS2xiUkVn9gE0E7hbHZVffdvOZUB5624rppR1\nuLZU6s/RYr8ONcLwPwP9/7yIjHXy73Uvp0pXfoe/de4qenMDIM48K214PGZG\n4SEHxxw2dPSfmp4bYV4IUESp/N5GYIBFJy7QFEWt30xztj4rLgZmrc0mDJhi\n7Us31Yn73CZGR5iWvpO3rGk/YX0UJ+K6cL8/CV1mqgn4rValitU7GH1twkQk\nUKxhb2tsd3pa+cOVhJsZHWBa3bYM5IMRpg2uFOPygMq1XxVhseE3z9u4jdEC\nH6uIZ9Xt3nXtoH0U8Jx8Hn33OQ+PbqlId0JLUDMoWHUQ++2BuhrjRBeBcYUW\n3sj3NB2kn9t+FwhooAg893xfepN2z8zisMHIrAFpYa9W6cN3KEUfmDKlmLCJ\nTLSqtO2bycI+wiTDM1z6bBPSe0z3QtXsVacAh2eS8R2hVEjO32iRIYwKGFKz\nek+e\r\n=dFTj\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA/1De3Tzs9yX+94gm8TcbIHCBB/bWh/ehW+wYY2Us2uAiBkbsWp2rlI8QKGSuHohx2JCHkpBZzCYIw2AcCj4TyWlA=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.26_1607868750996_0.47974627892200106"},"_hasShrinkwrap":false},"1.3.5-alpha.27":{"version":"1.3.5-alpha.27","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.27+b5b305f","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"b5b305f1f5d3c6973a2f2ac711361c61d44d5aa6","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.27","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-zQ30+WzGb5ah8IDzSGozGHSBI9sWNO6rBf3FKTO0HMJP0MJeoY2wNVUWLzR10whXAd5w6MSNE5Vqvym9nTydRQ==","shasum":"a919dcf8c3f35ff66287f916cc851c569b3bf53f","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.27.tgz","fileCount":96,"unpackedSize":440448,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1iM4CRA9TVsSAnZWagAAKLQP/icj4OzFdOHS9F+X89V9\nkivUCfIAd5FBC8ii3OyJAQoi5q5vq38I0ooGNQlNtONqfT8htnBQ6wBPZOas\ngpr0zRZHp2NN0b/Ygdrpdkl95FYSJejHgEvtyvFN2uAThmuhiQ6x34RWN892\nRzAGz3dSKUKrYwiXrg4FqiICqdy+u5qcwyivRDay8lebIW9tvPkObpmEsyBI\nTJjTBo9uLH3MOk7jDkJVydDj7X6zAvvzKKRwj3BpL9jVfvM7dNppLj/PiLN4\nRGKQejKCvZ2zQap0QMR5c0AA2MWsSsjZQPYMcfrbGLXnsk/t5XYtbJPAPa6G\nwcxdlrXg+CrLlxw6rttTQfHQYlysjraLURoalYeQI2FNvMqBxIuywDb6VPpO\n2vy+SYDviw9WGMMjmA+Jy7Usm+JWg9S0Wkj4hRKt+Xj2RHpESvAbOldfMT6m\nM3OeIDVpNnrqxDZWWxRXnlxWgZzjEOp8gqsdnqigbcmRxya/HU9hiXjJZl9R\nMO2O/cO0QI245c/ALzD0hE8fxQYKqlM+/uNlXVeqe5LA9IAT/LdJcYMQ0tL8\nfCnGn8AJtp+SmkWEUCXmMuvYs5h6B0RakoQd5C7m1VivyWRRF3P7zyXOgn/Q\nSWztwXc2PHwJkEDmVTUgNEC9bknY8Bf/k12EqQXyxGTRjmTmEwFH6kL/kt5h\nIUJV\r\n=ONwx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDlkNUZNDMqmGPWPTzq4VlvNF29PfAv7mxhtw9L5YPN5QIgajMT1e0oFMm2hzUTv+YIRaCSAgEKaOshGk1NLZmD5jc="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.27_1607869239647_0.5417237636972998"},"_hasShrinkwrap":false},"1.3.5-alpha.35":{"version":"1.3.5-alpha.35","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.35+6613c08","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"6613c08dd23e8b2a3af5efd7b02a1c18408e4c88","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.35","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-swmvDRgOMHWx4LSvedxfqBkhvUVVYaqoNTIMMfbP5SvmMN0r35RNgQtqwrJK0Y3RaiGCKokArxFWmvoQ1Nk7GQ==","shasum":"f355146c83a2d8b4bee7b00bca8eab718e8096e3","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.35.tgz","fileCount":96,"unpackedSize":440448,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1kUuCRA9TVsSAnZWagAA7RwQAJk2L9nxkd655jDmZ6TA\nOmBqgsrg31FRTpCXpiwnRHt5Bx2g7cynRVIEQquIoTHK22d6TkjoqFWEO1LW\ndCdvA8/KfwVNCkzvPQBQNy92jBsPhrAcX+FOIfygp9kVEgpbMjdjcS5TC+ct\nJBAZ7RnGX/bXG7AlRCDKYrsm1PZk+81/oaO0GGyTOid59UT82RwAhL3+l/WF\npPnG7/E3gdq4RQ0sKYr7q/leWSfo/CEXgdK1FSI3dJeMcBFXdbMa30ZgnT8t\niKMXXaFardcA8o7frIBOjCPAZuOaqfKoDVEO2gLxf5tN2N8x1t1GU5QKNpeV\n0kNVWv2Yig9OMB24AGT8zSj4vv+8udekgnGxqOhbQhzwztrQu+3Saldk2KW2\n8aMjBuReYdyfOPbBtKaxUIU64Dcz+MTEcEIwjLI8tqP9/g2EloQY373QWefo\nJjnhfi7jOOlUILBkkB8Jma7zuU1sZnOzgoQjWw/XCqQjutUuaRTwyNkay97i\nwRHVvl6y/YkNsfn6I+Si4dBrnn4HXP8T3BAe8HdT/MPj79o5FYs8Nl5TDJhj\njpSQ+pfimFs2Tp9S3oQ4nBYYb9OhduI1aZOV2pn3Klz7At2ADpy4IHwXvwQD\nkqr0vJzGCpEo/RPr22UTMxfwSWfGhp05Jg4uu1F+eebqYUHAc5mjzVtf4O1R\nrVzR\r\n=JAtb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFxDGktFtnk2bfhQVXfMH6CKsl9SHy5I2rIU8YbvyTmZAiByabiQpB9AvetAb93mFA0WHO23r5Cg7PkO3CHFewN3eQ=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.35_1607877933999_0.05392389237620887"},"_hasShrinkwrap":false},"1.3.5-alpha.36":{"version":"1.3.5-alpha.36","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"e88a9b685f8f6764207033fb45a54d373be32a0a","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.36","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-SrC772Rz25N9dd0PVR0ECj4nRK+4O/FIWzsTdNZeBdJzywQKVUJVaGk2PsSb2zYSYQgtAryeEeyrqHg54fwA4g==","shasum":"ae888d9727a7d308b170823b9ae179d67f12ab8b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.36.tgz","fileCount":96,"unpackedSize":440445,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1keTCRA9TVsSAnZWagAAcrsP/R3x5VHBphB1BDmsPmRC\nzASLJZPmPzm58bCOCtFK6NA9hNsuTXMnpG4HchZeTQngemLHP4o9fF1dGFsJ\nRPFW3FzxhMh2/IsqDMNutBjIY/1mw0sZf8DWqPvbqpF6t2mkk56nFprwqFHc\nLEipE0bjaB56dC8Y2M8CAYfTL4CsOjUULHLJkzZYuHMXjZXc/s+5Qs6piZd1\nMhGuo9ijbklyXFIgfsN2FgbLYenrjHuhN7sVJbuMpDVIy3/IyCQK5vgO4m2n\nste9Y/RPucAQVsqxAIVwG2TBWEQul1m0uPZAwuvbNJAzoeUB4TknWbeuZHCE\n6Vm2V+/gviGsGYpXWoOm40X8TyeZeAgAWud5OOBeQEoGVL1g5MU4g9IjDViJ\nojSwFHO/dFiu/mkEhIRbuwa+8O+kcyuQrQWL4/vMUmI+4mJScR6yed0cKY8V\nA8GC519IVfh+fAeBijfnhS3lzgUo7Ket1j3Fli6ZRL8CuiaOeyaGBF71VDQx\nidjaciI1+h60PIRiSWK6nUYi/q7ZI1J58RHg60M7jnSK0QjKO+slSGAtOVtC\nHvgejUV6vSq2ILqk5sQ0A0myEKmUifs9jcj76raVz+vu068R2fV9WJJkQPZg\n4CTS1K+wB6lfeBAEuFt2P0wEL5EahVTuxUXqr7twwG7NBwbkXEcH13Xsjmci\n2HrJ\r\n=A5HL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICYgEc6lMSVYMqzxFivYwER2mbItflrQNP40M2Hi33q6AiAMemzFulI4k9/XJ0gjqCpA0BMULuQc0ujta5xIraPeuw=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.36_1607878546753_0.1287644852903873"},"_hasShrinkwrap":false},"1.3.5-alpha.37":{"version":"1.3.5-alpha.37","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.37+e482a1b","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"e482a1b64c12d2bf7fe9299c89a92034ce5c4f5d","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.37","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-YH3X+uxG2flZQ6GzLdDvAc6Eiigzmfn7N5yZtsKxQU6t/Qb9CTSajq9uBQQPfHHd+RNK/ADYykkkgsEYhURMJw==","shasum":"082331667d3f135887e4447b2c2cbf1bcf6cd3ed","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.37.tgz","fileCount":96,"unpackedSize":440462,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1ksCCRA9TVsSAnZWagAAdGUP/2tScIPAUmPyiidbHy8X\nLF7rk7RjZpvacEpJQIS7LQcGIQGHE6oRm+gaGniwuWSLCBnvIo0XT7ttuBXi\nacBC8mef3Yu9K+d3jUQ/p117K+UGrVbZiNVoovZhL/C15rssWN4rTY3Ao4/7\n+TkiZ8keFglDg0CVqd1M746qexKyFtKYWK13pksaH8Aebqu+oNlLVnhE1iYx\nEpczaAk731iGHupHNH16UVebQGeX4Xtrq58BsfwfEXls1xPMSfCG/40BMxtY\nlgdSQ1eQhOz/0RpE2eAPjphexHVuh6jDjUpZ17EDVgpVWcF3d4ya6dVHFEdF\nrGeQQ7RnXJgQztXMNiE3UURVMLa1803Tfgw+GuwaU329zPCnWq2+fkmT+njk\nCkdp8e/yRdS+GmQaMABgd10dIWanLix7KuV8D8uM8SjSrSwl9hML+HDq7WUU\ndsBELIQ6ke9zMPDx4mzzqLtS16KQUUJcpGNe/jIVc17hnRXkDUR72/qrRmVu\nARyt72vJh2P62PNwgRXkZ9/vFN0eHQV2YEY+O6EWu7C0mbKky5oh1Y4zkXgm\n7r/Zd+Z7jQYFmf+ID06h3rGd78M3NlF8Vrv93FfXhilx1D38a8TxRwQ6LwxH\n+NJuX08tWiJKFey2Lnf8FPCxgLjfc1KOjkEwCKiydNp4Zb1k5qFUE+0/VErT\ncy76\r\n=Gohv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDLQQV6XYXUOKSc941iPFMPms/T5ez+TTeQqOl+x7eRoQIhAPbG7eQYqquWEjO189atDRwrpIR7dOfkpgD4LdtZQvyy"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.37_1607879426344_0.5202374088089872"},"_hasShrinkwrap":false},"1.3.5-alpha.41":{"version":"1.3.5-alpha.41","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.41+7d72043","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"7d72043ca211166eaed16c5f6b7d37b00486aadf","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.41","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-mT4mE+4bdQS1BYaSZ9Ax0EyuV/egz+zlxsg98xdN1/3BquNhlGB8YBxnaQnh4H8LBPL383iWJQcBoGiXfeztcA==","shasum":"2fb8c8c85dda250d65d7b5ce79e286f9c3986ea5","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.41.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1lWcCRA9TVsSAnZWagAA6ZYP/RVbqMaTQ2tWz+DhAXYA\nMidgC86A5xOgMHOAf0Rl5rEawSHAcKYoL2ubD9DS9vHkrqIHPGXh4wrXcHyq\n7nKp8ppzYTBTqyOIqPdowOQmOMknIBk8r1IPCk+pW185rscwZF8s3sYrkD4o\ng2D2EOQzkJChajNY6alW/ysaCfHhU7pWF0xrqhZKnNSraZxdCJfrUKjvAnr4\nvaJnVttoF+KBWzObIB0K6CWBMxT7xFlarh9QjjzrrY/DhOxGCyaKsouNd/5B\nqL3p//TS7fKclDo7A0IxBJmGWxJ4Ur7LLfgR6IC0xjCyaux5iHc04lbnKOIB\nP+zNCwWaeW79ptK5diVreSX6ON9Is5NZ5CQ23a9s1GIv3IfvUI4w3RbUSIT9\nQEPBdUctq6/W7s6fo6taL1ISlZR3vKYrL/4fzlCi//nVN5hj/0p8FYBeALHF\nkq3ImIgBM9zLNkX0SoJurTgLdcZXz2Ls2GgzoV3VqKEL939un786tykZ4lWk\nezYweg9XnvtMMFKUUVZdmcLs1d2sfT3mpOiFWe1Cam+pQvxdZMUuhpfCBPMF\ntJTs9l5EjgsAtKQ5Z3HLpdlQlAhnLor08fQqKDrHosRJJHoL9HBbkZynTGAn\nj5TgC+rl8m0kdDZtkdTuFaiY8S1Au2HZpQbQeS7Bmt9k6NMiyL/X4KANm3rv\noBvE\r\n=bD/k\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCAsqwNXzqOKebLfTZYasbuEN7yjosfCfv9XPzeTdCVFAIhANLGk/mBhfKN7LSut3L71b5fhgHNtqnT/DpjxoJPjmGq"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.41_1607882140115_0.5055479532156291"},"_hasShrinkwrap":false},"1.3.5-alpha.42":{"version":"1.3.5-alpha.42","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.42+601e30b","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"601e30b6692e172e57c8c58f32d7dfbe6792f93b","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.42","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-kWnHtG6TASzOrE05Z49g5RaUdoMdLFm+IzUypGOjQotYovJE35Lgt34lae0bbjasOnKKV8icekRjgyOccXNnLg==","shasum":"b4cfce03cfc8257e4be9497b0a9adfed47649710","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.42.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1ljQCRA9TVsSAnZWagAAgLUP/AtmmO7XDZ0DgDWtwOTS\n017wi54NkAqKbgjgbyaEIWo8YFYxxuanyWIF7OgTGPudWNp/+oG9tkxUaEmo\ndyaena43GbA7pVOy8RmAUwuNFOd1mI6fmROedG77rpG359SvH8utYxhCyaNN\nqmo/QPuclI+FcAVTosM0sbii+2DwkMOlrAp5YzMd1oyYmxN/EiUIT2E6H4gQ\nx4hiReFDCmoGsXm3mLWCS4CuRYF2JL7s4PJcl5BIOR6yHdaUaYHt2eDPW/xX\ni1kwK+2WcvR1jlsrOVXhjiB3wp3rMes3Do/oW1xreASqwZbsq9a6KYXKHG+y\no71XWkDsyDjJYAJjawlXk+SRpmqQvsmwoBw0HmyTbt/bsyMdQGcnywv6LT32\n0nbCW2OdptWgUPDoUJzMrEVQaf7bFDreKxRI50cHGIiyOPw78hijh+4Xq1+V\nq3n50jLetDWsYsEtWoemorEK7xbwmoIDJmK9B6+x4tpL9HeKUG6J3DjPV+2J\nyr4OPZmGX/SnLnqxM/DYF0h67Kzu1oFC3FbmmrQsQAjlh1Uc9PeCQDu5sP6e\nKBzCmrzh5JsSUQXk5YkFjXOCKVkxP/jAuqYOjSwAjp+yiGvLPSoPmwd8KBYw\nytAN9DGM80O/0xKrlxL5t/IzOA1qoPaQauki7e6UgIUNDBBSpL7jALVNKtXC\no3lF\r\n=PhKp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQChiQy0XtBAmnyAEpmv3tuD6c4nf2q/s6gr8y3iBnHU1QIgOw+6rxTij59I+k42Z8owZmm4hEU37rQnJU78nSAciIs="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.42_1607882960458_0.13836301234274595"},"_hasShrinkwrap":false},"1.3.5-alpha.43":{"version":"1.3.5-alpha.43","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.43+c8089a4","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"c8089a4bb44c4398fbe86d2cdf7871ca1d67983f","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.43","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-jYCedXK3+r1viWiXzNCbSvOUTS4h+q0JmoQ6NgqOF6NUsMFtKZRZkXbI81FIvwh8leU1Wtwuymk5PztYA2ul+Q==","shasum":"829a5e68f1259ac005ff70bab1ec33b4a603c523","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.43.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10J0CRA9TVsSAnZWagAA5TgQAJ41jNILJpIECknWwAL1\nXZUCTBh7lKapeW/an9nfuG2HagWNl7J/HLOxy/ZRZR4RMOaTjNop+Tsf3hIv\n8U8+8YtNuvDeRUgn4pNCrp+UzFMS359iSgB/rlG8XXfiQ77szVxpNafEIOnr\norpZzhKZar31yBCDA3keS+OMDEkDZLwhSbeznEwBivgVQt/abNYpdhruud0+\nYNZdYDVLEbj/0UCub0sSkEOOATysJAMO++HVdPZKHn/Ro5yAnCuWyXM4rTVG\nEcVs0HThcUdveM1G6HNnCcYqkTqPKJCk1Hof0h1T4ZEkJMebRJ3cPHSZUD0G\nZvUAiURb4Qpo/gFm6R0R9vJ2T0yErI9Xeu+svBqdOBRttBO08wx4ZQoUhsPv\n6PMNcQw+wEbp4yyNdG6CKhWfus5dMui12IpUqFmXHLXP16lKO3gEjX+dkuAN\nfc9freYyGL+P++qU3NhaEQwBEz9UL/c9JgSZqdh4fH2REQHVSSvgXZ3RQPDs\n+hD16ugLjM4nauEUTFtaORC2sEKEhgQmEOCRRwUtDD0fR+jJPpA4jYSXNKOW\nzVgpoo8Qu90RPuAM6B9FHHCjEe08uOn6IoDnzhC1MUVJoIbTC385RNhJJUv6\nrIzN35CyyP11/uU4SReMKkIVSbZWBJ2ubY2kErS+CFnTcB6CoM1jS4cjkrmy\nt3rP\r\n=v59a\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF9Ka+lW3ixJ3Ce+4JQ13Is5BeWAtGi+8kKLLGkjZ3UEAiEAgPf9bVbficmp+yn0wUSON5ieTHo3PWgg8vH20vs+z74="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.43_1607942772274_0.022591029933729523"},"_hasShrinkwrap":false},"1.3.5-alpha.44":{"version":"1.3.5-alpha.44","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.44+31a156c","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"31a156c67e1a4681ecc1df7f945237c1026ff0ce","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.44","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-fBadZREDdxThK8IGT70rLtWnieBbqLgUvma4P9JpZxIV4N6NbFRyr2feN7pyyuYYHirFkYKP959TRQUuRvCMUw==","shasum":"70cf43b16304fafff83c9804a7571d1e06a3a304","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.44.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10TJCRA9TVsSAnZWagAAZlAP/j7i1KrAmdHMbXn4iDkI\nMYVkyNB/iA4amIFfB0HlHtUOptIQXcPpPSXS88kZ1sGO66fS9FIskHXBG+sN\n8rOPuoiwRrMN8FYXDUWg4lllqkEcVNsfKmJlhpfnUol7WYHAE+MLm59mH0ou\n5+BiPoZRVj85kzcI6b6HNc0buH02Fb0FdsXhP+koAvgW5OXtctr8LzUuM8NH\nS5yffa4G+GDDM5eURofxsmSZGJBriHQH9T7WQh6dA4XWNG7n++75z4H8As1o\nZwdhqlkoxkuJD5XT8bLcvOT28zJwKGWEzTdkNpCC39N5YeE9sTk299Iq4y/7\n9D3layP4qHofLwxxym3DjYJlKeguMaJjd8CG+syvuTKef3z3cKBjAhiAEqYK\nopTJvOwhyEFSxOSxjuWjQGwYYAKmj7qTsy7dpRXnHYh+nGOv2X9mabboirnW\naCNQtqNujDP+3TPjw2mbjaztLv8kaN2KFP7nyFSp3Bzv2uFdOgBlrpmsV+MZ\nTM3zzTrniml+wVZ817cByGOD4pGUGTraRrMxhgt98ctBfL8QW06labmJkmAU\nO0Dd+++rRkhD+HBjTSCoETIrsst9DI+E2HQAIVJE8pfdplmoru1O5pCtDTt0\nnIh5OBk9hH4RYjRJNFr8zUQE0aDQrYcec1YHjdo+kaByAZv19Q8rz0gTIkWE\n3hvg\r\n=pMCZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFaS6KAeIBaJHD8nILeqvhAf29YMJCw8jPZXGyDoI4/wAiEAjuW8lhD58XJegnthwrQy90ow7PDNn+YMg6IXN9mM/CU="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.44_1607943368895_0.135960843705623"},"_hasShrinkwrap":false},"1.3.5-alpha.45":{"version":"1.3.5-alpha.45","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"6d06ab7a127cd99e99a33fe412d2decf41bc3f12","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.45","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-QyHzPWu+aeYMJ2vY+0CpDis690JY/YfhDs44fiEz78H4SRnbdiDMUkLjhEz5UfSo5BbjNsFYVk6orXIhQHxYYg==","shasum":"6d16aabe9d7e2d78e9908ba56e1356e693accca8","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.45.tgz","fileCount":63,"unpackedSize":418866,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10UfCRA9TVsSAnZWagAA7WUP/2FGtNbXPkS76TcsSaR3\nSqj7CpwezpLjCzmSZvzE7m+ISt0AztK5d6+g1SbW+U4hEpZNneBkv5Rc72zH\n9f4Phh6XbGVR/+4/T6GgpqDRULEBEpD0NHKCmRO1wXsODHMpiPNWwKtEFYz4\nC4PI8RUcQGLpdhVaQdmzmQtv2RU12waQOo8qxuDx81Gnst2ccKKtzvRpvU0q\nQ7A8TovroOujkSbayXW7EkENhhtWYWb62aPtwQJHVNEMFoZuHaKEJ5F9stpD\nCJ0HnRoNlpodWho8a4I4d1LyTOm0bN1HSfSy1QUQVGWyzUa3KmBp2RQPlbsq\nqIRm6pnsXz3RQodgt/OraS9MWM7VVdsv58WjoFp97v2DKUrS+CA9A7PFk+9M\nqwAEMVq38I9kX/P0WB1YjvE+k1bgv2j/P+jc6kCC8hZBwZ9NPAUgywmndxD4\nYCA0YZaKdKTewWgm27pLVFGL1Ml3U7EoEh0zMi4NIY/vXwgj6xGiAtoFfTp5\naN4nh4YkNgnxDXz18PyStJLLjQ06osBo4Bbu6ldfc5Jn1P/OFkP/rn1EtCn4\nddKbRJMRAr5nVEhWnQeQ3WjgpBZHtvNroAkAPjwC2WjOjil0EaOxrHreCUsD\nq3lCXVJJaGYIClcUm1v2vLstCiEmSK7ZFwEIwFnvqd9BMm/IuqGitO2Ilrvy\nj2El\r\n=SJWw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBUNXngcGLpNZqrA2EoTZN938gHRwym8u2mjPLSH2aGGAiByPWIfniRr7RcBYYa4/FJvFkDSuV5+9+xTE1c+Yo92XQ=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.45_1607943454513_0.23525906908757555"},"_hasShrinkwrap":false},"1.3.5-alpha.46":{"version":"1.3.5-alpha.46","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.46+610aa0b","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"610aa0bcd732d5f2ceea32a25d2fc3b916d3acf1","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.46","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-F/EHF1goIGl7IdUXyS1A2Y+hA6DxxbOVe0wcyWZs/46C7JOFMo/wlEz6jOulMUSVY+lG9LWkok37fZ3H0fAL8g==","shasum":"2af905e659a536c1f2bec9cf2329db4735c27999","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.46.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10ZoCRA9TVsSAnZWagAALEwP/37A1/PTf/Wpj3T7ON94\nsFAbMLtaZ1yEXPcS/yUbTjRcopTeT74VpWiqKOc9LyCVAK1VqoQUoZ+xctIQ\nMM5zj2HIXuVBZheqLPqrO0JgvNHFb09UsJI46WSjrZhRfZAHnWp/T+hcrQcK\nXdnQ4crCljf/yJ1RaxPgwAT3W0ZXAo1tSCCkR+/ZRvKCtOW1YK+HJho1TcRU\nPVGNkGfKcN6mzk05MkxkkrVLkby/8gPvOJa6P96z4RAhDtvsOs/XFQIL1jdJ\nUiFVYc2XeCfL691cLjf6WcIoYsce/gXzRSA9Qu8N3k3gL8FnN8DFTwHR89ru\nF4voJjm+1MBfLWlFjFKHNU171m8RzdAtj+71tYIK5svAdOyxPfrtuCJ+YEae\nBbartE4dYhL/A9sVxjvSutNDC+nPX9t/bFgNN4zaj7JdHDgtrb/sNgCw21TP\nLT2Xj5G7NKZQpr+6DiwnivPs9ofM3gGbte9HBMpsnKClttRWgrOESIJSKzAV\nABsy24yAXjv4pYZow3QguYP5C+ZG79QpO92JPobSbrSD78YOKwY5NFJ6spG4\nJNysg5vD7MFWCtcH9AXwPIMcdm/zQUwlKcjpGIl9aYwXZQojAB7aXlNZyNVR\nKskuIPyps3fieGU0T9mI36bBjMCaD2Q1mcfbOQ7lB7beaYZ9jdIvH1A5+j6b\no1zm\r\n=7rSs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCyCIIzcYodFf84/LafXFu/5YP48mubW9Yo7Hob7RU3jwIhANCWrjVK+UDfumrtPTCUvIpNcCIaprio8AnqwCQkw0g7"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.46_1607943783732_0.39346646175046396"},"_hasShrinkwrap":false},"1.3.5-alpha.47":{"version":"1.3.5-alpha.47","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.47+258ca18","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"258ca1869cae94c794c293bc9258ea74a6af6440","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.47","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-XqN8kjopd3PEtm5qNYtvXeOZtrBFYvJBm7n4vC1l1IrrHx2MX7CFrFdnfHltEFdNZeVg4ZkuThRr1CGM+aVY0Q==","shasum":"665d49d42dcf4b3da8bfbb016ff94169158bb7c7","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.47.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10cWCRA9TVsSAnZWagAAWpQP/2C+gqe70qmE9WselkJn\ngJSy9N2pzDP0qGtusZVDitaaI54DAJKs8mZN/FBhPDoZtL/NdljDcMGR9MkZ\n54rPQ7Khmm8VqC0fs+P6hqfIvCwEeL4t+XdC0QbRXFHRMkSpb6TokVh9Zjx1\nWZBJq8U3Gvl7FUAIBu11fKRQHOOlrG3j/8FLguZNdh6SohqohblYYDNNlowj\nQaKOhl/zxe2kh233x4jiQykw1OGepexzl8HwTb6rlwzrtMXRRSq7YNUXkSox\ncqSqS1B0Ky4yOo7cDdwk4hYfOVRuah/ylyhT18UlRmE6r7zIs3f1cXptiFpr\noBuBVHQNIsOhx7aT16HjI1v0hptx/orJJP7Qw2w/ANYkzsMaLREHOnbSH4IP\nSQbEfJQx2qhuUMsF9+pqWsxtGU82LL4oYimF26Ob9kPZvShcZAzfuYEF2yRe\nGXRRi+7QTz7jIZvMGTogGCFdrVoJ8jO3S3sEDStuJc7YXsEz1B4gTYvxVKKG\nBFkHVuzcy3unoK2LL52z/QrK70dRHsW9g+M43QmrXEf1ssy1CfD+r+5lX7OS\nPf6JkdpY/pKyjSOJDGxg+Hzq8qfssHA0EcfpFleGKqLHw/qIAzSATx+zqshA\n2Ai5CmoDhglfw6lJs7PUg16BOqTowCgIc5/4NRoUoRymdAgVNqpRQRJ60GFs\nN37s\r\n=TKL2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDLu4LPoml2XoajFunVjyzLslr11+RtsryZJXOubcCZEAIhAIdKDJ8kfzANrElweouHacQWgSxbUOB6YVd4ttqDQ849"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.47_1607943958356_0.9514305491865418"},"_hasShrinkwrap":false},"1.3.5-alpha.48":{"version":"1.3.5-alpha.48","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.48+844bb07","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"844bb075cef3e7a3183ed5ba9caf247adcb79b40","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.48","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-2eS1QgQdEZol/xVfFAZx6LnYSBzI0AFByqLat3Zjcu8z7Uf4Le8jfuOKEKu4ce6CfzL31PJIB63XuXj/DCZaow==","shasum":"5faac2331108e0a6035a89be07eb35fa3e616465","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.48.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10jvCRA9TVsSAnZWagAA02kP+wba02JpfdKlMVxuw2Rv\nm8bViJ+bns1C99pQJmu3VXXVJM5Yc5paT2zfhC3JpfBd12bIxX9blBI2MROe\nTtYM34L47SwaX8wp2LhzyaIoUiAH5VsS/FLlgEhpWleoFLKt6KMOln/LTrzC\nC8u5fBmGFhg0PeF+hK5xY1N1sGEDEBHg7nzWxyjsdEy3WJl88DfxTPzT2Bbs\nx0BsByW+73JpSuP2adEkBkWrOuRFUiZBPTR1v+Z8LWtTI26szMhzLjebmnEN\ndaPZFQnn+PA75zDDJuQhn+0Zv0HGqNx9ieRj+MjytrPkyZWQEUwzL78OfOJu\nMyijN2cQrcx7KlCZBWAOClsyVgnyPixitbGP7ssSmj+QeyU+ioQsbEd57EVM\nZfG/zZwHARWcDC63GdMzL/CPEeICbMkOGA+j/fQSpkc0CHUjPHC2nDoHgqFz\njDktePx35jAmKbxdEQ+fJ4PjkcajoKCt84olC3wckC4fjMkXGoMYmJ558yVo\nYAIFJXkxlrZeODfNI4nGe1rajKJRlOue+RbPXahdEaJ7wIuqA8Kd4rgUf2T1\nfI0LRqE//smlKUsT/11S9cbNCvCUDvQd7ldnsjCqKUH6LDeCI/LptcTNmePl\ni+2493r+QC+dzBHrAcmC8g1drsgJe3nqx/UVOAC8rv0xIWXukxQRk9x5F3Rx\nq0Pq\r\n=BFW6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBCtrEsNlhHqM299cjVrO8wYuQluDhdstbDEmERgoiopAiAah11pCM42hUZJrBAYgfQHZWlwxZ5r8a1tMKLic4Vb8Q=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.48_1607944430987_0.19649306870213334"},"_hasShrinkwrap":false},"1.3.5-alpha.49":{"version":"1.3.5-alpha.49","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.49+3562ba7","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"3562ba7e5318ffacf6d7c8057e787a10dd71b42f","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.49","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-yH5MtOAcObSytr3a2pGLIzSlnsIMIFN+PemD4mocM3l4bNPGQE4Hsdy3i0vPtYG0neMg2nJljAn1UqMg8emarQ==","shasum":"c64c380873e9b2a09d5247334a1e3a80f9295139","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.49.tgz","fileCount":63,"unpackedSize":418883,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10rYCRA9TVsSAnZWagAAcKgP/if1HtRtcalcWPWwfsaG\n4VoQaW+VmgF+1JDw1M2gETbx9pn4Elj6ROMbLw2FziN/hCWeVxdXLFIe6Mdq\n5keXAJMjjMLJtKp/AYNxapop5L2JCfddQzgJD6jJEB5vldgJO7pkFkLLKeZv\nplYfgEeHmn9ZdItplTb/z3fivZ1a/uuCAIc3hJebnIChV6GGzuEm3guCrI99\noHJMYqov8I9NAZSOAxHrl0Eb5zNiOVQtBY4Ez0vx8m0gw3DH89h+KwG4pLrf\ncFlJJ231VfCc6Y8oozPIw8/daBlGH08nAGUAYIy1KOCBxzwGIH2G1QTHtHcE\nDR+pybSADXCrduxeh6T9jB8DyMQE9NBcNaAHpx5TJZSPq33Ch0dSojFbERxO\n7SeC53YXacUaigI0Wah0Y8pm9QcXIzG1ffKLrBEMVjHNO3NdZh2IZJVJy6tT\n64uD+t2gMdFbbdgXnd1a6jrL9Uw9zhAXziEyFK3fKtgkxH78Skv2S7qHSYii\nsltftejJzOdYpyPMf21NshnQBVXvQW+uoSUVB/fuZj7boHPA5EN3pVtGx3WV\n6F4f5EN64Phg0hdNFP3hYUoNbfTJS9hsMJsHjCEdDd5FlS4Rp92ovdD2yzpZ\njRhfP3sq1JytLetZvmKHv3NUqzDgHxzmt1j8yTkoKZmtT0pOZPbajZJzHV6b\ngv0s\r\n=fua9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDF+/DKYax68TylTfO20/HO10HM247LjJy4BxyYaD4SDQIgTP0Uxnds6hF/S6P3G/fLX+eHYX5ntphRAKHI3RVJiHg="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.49_1607944920413_0.9728574568422148"},"_hasShrinkwrap":false},"1.3.5-alpha.50":{"version":"1.3.5-alpha.50","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"88944358479c8a55a509abd290388dabad24d948","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.50","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-6Z2LRd0aiR/ws9pR2jGCjQeNgv/fVPXavvCp1F+gYw5YhKdW1S5wg+KGnJy4RhWaeNkVdOJT3RomFSF6w/XbFw==","shasum":"639410e921b4defa2857e71917c649b9b1f7a640","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.50.tgz","fileCount":64,"unpackedSize":418694,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10tdCRA9TVsSAnZWagAAcz8P/2Uv7wGPdHhX7pU5yWZw\nmpjb1V3ezsp0Xww6lhfdK2fgGFJTXiIyj6tIt+3VwTn2OOFWCQrJ5jtC+eUP\nOslGitdVR47M5yj/ShxHI4DL90POUX7NkgwlkjpffIknlZ4cmlxWY0hbjDO1\n5gWtNk4KjzPw94LWz7crh+LCzTgRK/SVnf4Y9I+SBudpka9AueXanbDJpkri\nNgyPjlGDlHxB+sUScr6XG0IXUWUE1GGlSvQzwsqub/2V+dCTST39JSsn4DI2\nppbA6+dtohEN3izlVG8ILuX9yMGwEapumwdxTw7Of2QzdNRVYX784D3iE/I8\nHXVGOATYgchPJm54vF8t0JPEP0v2QwpKm+Gd4t4O3HN1mABVLUmvbrMZ3TWT\nQjRSDAX7OG1bryOQGzDCD65UdExxGKmj451dNukMAs0UAEtOzgVQmHu8QuQ2\nqreZwlTMnHyR5JTUq9kkuWxNZUVP3ejm7VtHyEajuQBsCya2RAaOte17i3ve\niSJgvjSlZ303vDOY64w2SUyRCNeU8uu+nDlZLx+gbcGppOvXabhtHEnT0kwC\nvWYaZSqvkcUGTOZB4wyR06SC05caigG7tNvU/dOLJ/iMTePzT4QyMYHDW636\nRDimgJw4MMrHDF8ldsJeI+BqsGXxJqQQLY+JsfFH2EJzcOYFtV5rxPOJeR2c\nqq/M\r\n=6F/K\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDcuZZh3Rlq6My3aHxD94pBXovsH+f6Dr1IBO/g6OMzfgIgCD3BDhlG7Jlhed06wAfSjDHHy6cjl/1TOljqoAEJcTU="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.50_1607945053551_0.46680187738366485"},"_hasShrinkwrap":false},"1.3.5-alpha.51":{"version":"1.3.5-alpha.51","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"8357a2d645981fe0c9ebe6fb19c4ca738206366a","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.51","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-6+aYnXlwTmOwdGPghJojnPzmiNNvQItFwuSpwgQFtc5QM2ZB4knq+VLINjMbvTZ+4JTzjnR8jE9HDLc2ys9yRA==","shasum":"9f2dc9c0c10ecf5e3ad1281fad219c5969e00194","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.51.tgz","fileCount":64,"unpackedSize":380219,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf100jCRA9TVsSAnZWagAAj0QP/2Lu5KilUqPDq3yFIGOv\nbTQXaNP+/0PLG+0p69+sxN/tVcTZJIB1jQnXy2ZBLhSJyxOGs+YwfHmVciiY\nvptfLZujjWrbuSluQn6RdQCUw82ttxfp1AUX8IZ8isDg1zxnCGz64HFBcCER\nKNCF1OyQaqXHlo62Y9gFIIp4pwUkTBrtvbd5lFGOfuMobSC29bBNmkgEHYjD\ntY928Dc+KyxoqKewdY20pOm+SS0OPjXR7Ve+YdrBhfqoCKVZ0YL48mCkieII\nTCRrabKD6qgbpSISsDBqbUzBOZmr0cpnQFeN8oXbzEm/opa+aL1k2mv3x+9d\nWQ1NVSGrH3vYE0NOUjIfK2PP4E2sFCJBqVMSBmspFezzbGFT2Dv6or8bXNFv\nh4bgPfGZG0usElDtSz1CYyCDwEnJIhIlNjlwDShd2s9sl/DSGbacLT7avMXb\nLJNslJQ7iIEZ1L3OlAyEIfoBJcgrXhUsSQrMy6lKhXAOPZDV7+WxYlr0ku/0\nI8Q+bXooUdsUQQuYV1c3p9FoHNhSv/V8vJ9A4m3Vh0qy2B+aQbOfG5ysqRQZ\nsJScUCFPoqCmn3DZ5J1HqeCJ9Ce7OWk2Pb5fYUqSBwhxQPjstTj1CJbh5/et\nQQ738Y3FSHIeAGK68xL/VSBr+jHwq1SujLJszwDC3UIneKtE3X2leNvgaUYT\nWYMm\r\n=TBMy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFkZkfs08jdR6wOzac3/ZWVobseY6YWIEVKfUdiq19jRAiEAvJ9+N20Tp4GjdXX5vCnOD/TxlA6f0WXIq/L/8CryApE="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.51_1607945506806_0.14954699731833943"},"_hasShrinkwrap":false},"1.3.5-alpha.52":{"version":"1.3.5-alpha.52","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.52+1b8142c","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"1b8142cca9f3595c48c93df21429a415f10ecac1","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.52","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-rBg2AGPb6bh+dHVavN46IEy0baM6TAFIQPe3nbZynLxr8hVvAoo7Ss/zhOCnq9Gr4/Ujv3AJTcJ2Z+E+f9GXNw==","shasum":"f43ea178125590f03f002a26ab3ac7cca83cf60e","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.52.tgz","fileCount":64,"unpackedSize":380236,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1065CRA9TVsSAnZWagAA4kAP/RScZO9LuIc+zOM/C/lE\nz2V0KYEKaHMunDNqg0b1QKjTKKikMsbN09/4jXfpVKjTkMmXKsyJeZqOx33n\n7+lHRxbztPwodq3flZBykUfq5U45THXXtGgZ8UiOqW3cVhMWiz3DxM0uazpB\naot/Vz7fAgsQ6mKK5V5F+nI0djl0gSKAv3otCWbTPAg6rpCud1E/yp/VJGvi\n96P6dtUr9FhJB3iHWn00qiDqrbNzmvzG4/veTfAEiskwBG6NE578qMuD+C4A\nAMGoPfqKgn9/CVk4N0wds61WHvbvR9VkMdqBrVMbpLV4IryQElKyglRMxI72\nPAQMMXp2Ci1+75iZfTVGjK3yFx0EvbGtyhxZ8y25oEFQhWwV0w+olD1ljohV\nx0uEuMKNIG0jjjCFHX/dahmMAGGmq67+xp6Umf4YNoS4ejNfoPfL2S5SLdYh\n686GGzojFzpqbGlyYEyF+VX0hpW8gYC2nWVwfAjj64yborIt+I5Box1tguei\nOEqLw1E/7mu+vDheTgEr4ph5tSQ641O95aXYqPJ8b9hWTyf4ji/Q5Ia78aQl\nkSUSgWXtpQJdB+ykAPo8iCIDaMiJlidAzPTKWBnA1b2ocyPfwG87u+KwP+cd\nOnohUovAJofaN5OlzcpuuXQZBrn1sxiMQWU2RHhfXdPPG23vbn+Qws87cKiE\nOuiC\r\n=Z9Pa\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIER1gEqQTICHhhJ+j27ynaRLTWtMsEri8Jy3GOmBj6YwAiEAxmhOHOAlARhD4ZW/3h21ViJk0dCpF/rd7Kf1U2RFuo8="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.52_1607945913199_0.5276263077399284"},"_hasShrinkwrap":false},"1.3.5-alpha.54":{"version":"1.3.5-alpha.54","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"ac3e0ced93294cdf62cd1ae6093bb83413ad7bbd","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.54","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-twFA+YMk/g6R2gGgfact48o8nXJzVElcWhobHROscQ0hW/6FXRi4qFO+EfBW02fJxRyOO9xrGg5QC5w/ZG7yBQ==","shasum":"2ccac694516fce97466d972f30b61589cc8127e4","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.54.tgz","fileCount":64,"unpackedSize":417025,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf10/TCRA9TVsSAnZWagAAjl4P/3jxxEb1h8uZHBBgcPMt\nzK0kuroDc70JWqQxs+dUPwR5vAKRklsa25XLrg5G6NWkkzTp9KseYRJ2n/MH\nMXKXAWENjh7zrrcio9cde58NkCTpJ3oDTJ7AJZgeWc/C9Ezuyvc5Jv7hP+54\n3LXenJ1J461PIwr1zuoDzkId6r6X4+K1cuuok1ZIi9I7XDG6OyU75SrQQUGa\nbsQ70Xr5iZzZwWpEPOvwkkGoNe9urF3yRyjqHb59gloM3YWpwAZIsoBMUltR\n3AnpOqxhPUtxrbhK2yMLAzfyb1LkH/BRcwdOUCvIuDX5agPBIwBP2plqDeVJ\np1hhIZ9FZmmkkJQpK+XbQVfHPzRdm3gE3nV/p39XfJQKyWvlqB8dCkfkSySP\nTTd3N2ctoJetH9avfO3ClpVEwAGmTSMTsCC/FvZVwTrIh6tmuy06klxJ25aP\nV9JOypEM5yaImU1O5rgGSql5naCqAUNAkpK9FXyFvm0m8p4y9UWVvgqhSCb2\njZREVbvyRtDBhBToPX64qPs/W7ptXPZB9Dagmu7Vq6KmO7pR7SHac8NYKIOr\ng8I0VCXGaafuHjP+++qB9Tz6Vi9m7iYVW2CZ2jgSEhe4vGYfhaIbiTkxG8S4\n6uo1JmUz6DXJcZh5Ylcr0aL++gOPARxh8sOHJICSJDyfohpXU0nBkSCC+S/Z\noyoA\r\n=bUzB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDv/hvBRZrw4t2AR0i8xv2boxLoLOYnfFASUaZnByGqLwIgXTs8MENDvL7xBY0tUPcbtIqfURFp5zhGcCVeFCmnOhc="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.54_1607946194710_0.12507222404878116"},"_hasShrinkwrap":false},"1.3.5-alpha.55":{"version":"1.3.5-alpha.55","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.55+38fbca9","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"38fbca96a69a8ab153c6cbda853b97c179c8ed33","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.55","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-fYRU+xfb3/cUQEE5KAcZjZ2y5EGQIvNHjCSmOCTg98IbW8V719OJGSH3GKFjCOLXjXyvO8RsKXSem+4/HjwO0g==","shasum":"41c58001fdcb3aa6ac5682f835184c2a588f4cd3","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.55.tgz","fileCount":66,"unpackedSize":435910,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf11MTCRA9TVsSAnZWagAA61IP/jJuKPVacpJOZVGUaC0J\nIblnFJqJ7DawL2oEctgz1IApCdETGlH4v18i5/5SiXjKId++0HBs03wONf91\n077+aMRARUkMG82fQsFfRrJdfgvrMB/o65U11yypEuZMJRRtX2vuQmBv9AXU\nO3dYY4IvJoWfu99Odiceg+igFp0BWKW0iVJ0/TNY65jzoC5TcCQ11eadxsDS\nSkwetGhO0c9c4fJwIVIQ+slp5SfGyaRhkWRe7i1+8rRdqOex23YKbO2mvOao\niTd+IGpMn5K76Lv59ZLiqpCFiDlRUHTW9WVZeUwPW/WUvhx3C1dLlZ8N/WEF\nmf4InTtz0JN8hqutKo+pqHFdI1Qinjp6fDa0H54ouJz6VTu1T3MNmiSEPBbs\nl40rW7Gg8CGLKxTTQRosICvAIrHA/mtrEy33SHZ2dfdOgrfc3zDLwgws8EXK\nhcZiVjNwrJT/qbPlAT2UARBSN/XWBZHjzSMS/1M+DU/JcbJPTARyuvT2QAve\nE3SA43mYDUWnRNIjlferhGaKyCLUF2iLmpEOS54TEsbmly1AuC3fV7wUrUn9\ncw1YgK4uZWwJJ09/4SgS99/LpPT07zVeWEzRYhhOUc+xm+CQJr4kOuXBjp76\nR0hduLgBiS6M2lzbZ1r4Xs0mvRjlr1NM/JWLOXUgB6gQmgdXzvgpetKEHB/T\nwHWU\r\n=IneS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA3PxoGQDpWbvEt75XmIAzfcBWnG5ysF821yPHRWtCHJAiEAruNLtRuW6V3M6Oza0k6oQqgVllldEH9hxdJoj9Bi1Fo="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.55_1607947026949_0.3235336334460297"},"_hasShrinkwrap":false},"1.3.5-alpha.56":{"version":"1.3.5-alpha.56","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.5-alpha.56+d006dda","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"d006ddab67df6bc1bd5971bf7c9bdd2704ccc8fb","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.56","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-PofhoC57WQP1AUJ3sp0Jd3km/5GGTqjTgIodLoueWNgGhh59yWc9tYcfyKbn1BGVmxg1gb2YnNHT6/9OHauUfA==","shasum":"b2eacba3550dcc6613ac4e4ff875e229ca9565a1","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.56.tgz","fileCount":66,"unpackedSize":435910,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf11OCCRA9TVsSAnZWagAA48kP/3jdtBPUlTgPdRy5/4Wc\nd7k8yCU6oiEH/9tFBw+R6Kf8KZHNW3L9fMjPNdH8kwFKeH3SBvMHhL0q3Sxb\nWNq9CP10VY3O/orsGb1nal33F1v9N2+hR0ZxAlqJriKWl+Lal5QFVXEBfZ+k\n+pKBOretzeHIelBpdg75YMT+rCsdVpWlEx8Ua6UT+nio1bjdgtyEa0auj9N5\n9lRfk8xCifFRKzcig05/Jmsn/v1YGsKMyON7eCBL3eC5bdoQVKPS/dd7VTkw\nLq6e3RHRvvTCRdJEOlLl9To0/QWTvMrEbaH46a/tM3n8oM1Jvo8Qu1baoUYC\nwxXej5kBA9fNqtoqPkvKGIHHqwlnMhzkJDRfxYvT2S2kgS79P3saQnmFZCzo\nJ0v8IS9QieTCSAvveimdeZXLzCSbQ+g6O7NMzlHD0b/pso4ttfLTppwFA/kJ\n+bPJEgnGNytHVYrn4nFsGsxm9tJ52JJJN5Kt1guXUljAlkT2/YQXczK6kJrm\nv8T4bLa5RsucvHaLwlqwj2V9LJUqedvFiNxN1SgsMRtvWFIVdrSNcP0qdaMO\n/6DOB0xggfQbk/VZxiY5KBoJyqm2PemWOn8d3P1AZvq6T6w3A5Ge5+skabgr\nzS7rYMRKz1zecjkww4EjzhEQHvEmuz3lJTLWA0oNPtcxmLsM7CE5cfJOfnzu\nP3Lx\r\n=Ijfe\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHcBt+SAQrPjVcbB4ruUF9Tjquk12kbDcTQM5uKP+51PAiBzyVppfjJKdEpxJDuyD4Cjac5fo7kTtJKuM3RE/2Sq9A=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.56_1607947137923_0.45450809891270993"},"_hasShrinkwrap":false},"1.3.5-alpha.60":{"version":"1.3.5-alpha.60","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"50fb7978ada3839a259bd135b1dfedb63743ae54","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.60","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-kEJaHrvaFRzx0L8S9phX8dc6SCASeJXnDtz9Ta8jyoh+fRYYWBR7kjzJQ8Vk2jstEmnZ4HmgWlDyuJcohdf6IA==","shasum":"c4fba982cecdadb59651a0373a594260d7c7aa5b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.60.tgz","fileCount":66,"unpackedSize":438521,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf12l/CRA9TVsSAnZWagAANHcP/iKS34iBs6qpG6Ylzygu\nYBQwqiSpRO/xhQ7xdoBe+KhnRufMay1XiZn7EZ3QHVtEi3V0wS0+vgfa0fMo\ngMj0G7D3XUxYsWlRe8bcnZBDo8vCQ+h+mJHGPeOx9VY2bOF6QXgJ4kJA9enL\nKM/yFKGF0AS3OBv4RfA4GrBmHKcIteiovYMKbYIQW1xZOYglBlhG+xg+Awnu\nc9IR/A8G/s8UCVruGd3FMpL0yaiIgWYqazFatb/gT9r10/u9hfuejOvKvY9R\nxiwwcLC3fi/nvpYwyrJJZGecwhW/ogJI8aQClF6SIKh3oMelaeG1T53MBQO8\n0oFh0WfpMGvP25mKQCDOWjjJvdg/Cc29iCFnfRbQbvLuZo5Y2NhmWbNxqc1D\n7km6BoL9RPXwa9d4o5nvpo0sc1h97vQMVF5kuXaJ6pT9dBubVB8mK0MnQWUT\n7nnXBoRR3/VwIQiabSuI2mCbtz3KE3qLEfF9tR1k6FLP2f3SqHM0q8Tg7ZiE\nwtck3Qk59+h6G3VhWMM1xaaOIwySmGdruLu8ZOpJh/dxrVxcAZyKvU13U90j\nG0zsuTOXkHIxU9+0oeXNhohMhFr2468jI6IpVUO3QHZJCIc0Z64hg2DJwH1E\n1zsc4+Ec+czt+uWXSIex249c39s4UZk2TkcoacTIEn+MBMRZQ2+QE0CROexz\nzCgA\r\n=gpOW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDH/JiHcx2QlgUjpHsLxpaEZvR8UeE1v/A4l0MFF7/KeAiEArRkawDEg2R+cZOTQPjnNS2Ic3lv4eCVRqZpIwSQOxLM="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.60_1607952767139_0.042996948803834645"},"_hasShrinkwrap":false},"1.3.5-alpha.61":{"version":"1.3.5-alpha.61","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"19bdd7c2ceed475d8712da85e7f41631879d2554","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.61","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-TQQw7VX+8i47k+HiPv2pICFWDy3NjbBoSLcrdSHDr+901tWeWwR2yk9+oZb5FBiz7RQHYQV76RX88hSStvx2WA==","shasum":"6681d2576a4123c31e8df920c9ac3bc04bc135b9","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.61.tgz","fileCount":66,"unpackedSize":439018,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf12pCCRA9TVsSAnZWagAAyikP/0sRjJNRb8la0ZfJSSwj\nv44Rylm1WQ2+MACHGCeB6c7U3LYkmW62jQLUOLw/9jfpYBMm+RgS7LQL9QjM\nFYTswgxz5uOriwLdSVgxtJ8l3svgbdhQQbvzh1sIPplOXZWPoBPkCxNp448z\n2b2ikvzDFHEUZ9BnivSwtB+KRd6xHbq6W8l7Svfs1pKWiDqM+xJyV2ofk5Kz\ntQTBiQV2fCRf6iyvQQCx+y0u/sEbLaU2jzVZt4dnSoPaoZbThfshEIzZ9/3g\nZP8M1nCtKFHfhg59lxmtamOj0QrQt0MJunEtsyA5gvK0ya3wY1L7ZSvYI1Yo\nAjW0MQ2ex3waQXtG0vgPniofi33y6MrdLH6NFo/MjrvWw2lMPZfk2RlYHs30\nNzragKyMapeVQmRJROgYU4STvanG3TAtnO+aKHAIU5dk+RXqQEYvYvb193W4\n7JOJuE8cZ4DpI3WWtvkpsG3xEtmVaic1fWSLP4zuczj36/8F9Xg0FvCzIE+5\n3oTW3ob/5Ei6wLYGTUpNPqbCw3l3kPMHLFpssYwY+a+8kn4yL7qLPBA9fE9e\nxRWaKFs0BVzo9dePCY9GcC5KUORG5eApTpHgymCDQC+94c6BtwzL+e24TFF9\nPQBdRT8dr+MtTktzRg/pyTxvy50w7FjyUh6TpzvLKI37SAHh3DSmQfBb5aVi\nu7ve\r\n=HL+r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGJetb1v/pqJnQ1BbmgRH6nG7wSXs088YQhHSOIVlE2iAiAXp7xZ+/57f0I1LabFnv2q/a9xsqCPitJxSHnLbdql4g=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.61_1607952962376_0.5390190498869882"},"_hasShrinkwrap":false},"1.3.5-alpha.62":{"version":"1.3.5-alpha.62","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"7723beb0602015a60905b6e6bc7d209daaaa520d","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.62","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-q3fEzY6PlzBsFEbj/3crkf/nNxfBcxLllgz9I57M3MV/Opq+B7mKFHHMaVxPi+Jva2LJVbMzISS/xU9cWWJtbw==","shasum":"cf2ea7f8feb81121c14465ffbbdd5cf837001b1f","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.62.tgz","fileCount":66,"unpackedSize":437655,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf12s4CRA9TVsSAnZWagAAbHcP/i279ERKFeyHQbAS8aJU\nJW2WArwpvRzox/FDJcw8tKUlgZD3/wQTimYteFb2/Sx1E2MN0194XjSFwbtq\nj0wN7hzuWGVFe22yyJ/paiszfL6fvmtLV1kdW+2QBleRBGrzz72hnagJ49oN\npYfojIjpZFzjs/XgbLSn+7jfT9s/Ubd12TSG/0+fZLsWi/bzSe3BFVBq0Z7q\npoI6sW3Gx+I7Se8ekVHZP7fdOpKOrGfH1COzSZJQUctf6JXG+sZrLCO2j1xi\nOFYzZbKy77QR++87/jWb/w5oT+rHWghLyeLkisTRbYyItnMVHi6rdPanHGjX\n4v/ihnGIEBTbv8PkF05uEP8UtlIRVKu6GqAPC4PucoEPguCtqEQbNaHtVQpP\nalpfoJaKiQYR6oKKpymtnC/D6D2qxq8h7ZL5SORsL9M4VBDySS8FfZkBBbZ+\nGy7QIdjd/j62YiM1ZKSa1X6WvLEMwRHMySiTCrbwUxj1R0S3BBPgFHMP/H1D\nYBPTZNgz+CDgQ4ZwRbskrjAu+pgNIxSQmRVQQJPgm1cpSvO7GclQpwAaWy49\nQZvgfs1eLmtdAG3WA64d6NiWMYE1mwDcJwuHuHJPNIBER/DUXbGA9/8a3Jrd\nmY/yEFZE6opSqjD79TJFcmTZI1Fs67nXeGxFZI4U/8tvvnwaUFxouAOaSBqE\nAisQ\r\n=NUH1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCErmui4DH27TH+OgxIo20gUF2rL1N1QtMiOWEFf7UvTAIgObFYLNv9raMW5/xVwjNn2T7mHVHcJd1lJymOmisGBZo="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.62_1607953208138_0.43893291436016946"},"_hasShrinkwrap":false},"1.3.5-alpha.63":{"version":"1.3.5-alpha.63","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.3.0","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"1c492086a7046c23089c027dd06fd8fd222ac1b5","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.3.5-alpha.63","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-16jE24wHiVvtN+tSnW+oNLFDyVQePahdHueyc2/nLZLrFr3xAIUem9n/PrhCJ2GDsD1ECOFJS13pYv+sl/H6YQ==","shasum":"238abd04937d528f5d85fb771516e5d592caf604","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.3.5-alpha.63.tgz","fileCount":66,"unpackedSize":437128,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf12vCCRA9TVsSAnZWagAAKy0P+wSICSGAnMTJJjCHcO+u\nzXy7yhOhhZm4ToygdohhXwkp8JduRd+lI0Rx2/3cKu+BPHW+H2ghhV+WyGuE\nVGKnDzJQytY54kRGWKDydqyP06wHcuGaJTChBX4YhuHWgAYqABSPYXpU8EmL\naWrKHaSOm0S3inoCr8EIeGufLjsQc7UCZEbtTCwLl9zlIGawyCyeDNeFX+1I\n9gVYqhRTykHsRGyBxUb9J0AR+PFx7DUoUihIgVftxY5v24abRLz2/E3t9GcY\nEWaXjDtCfU7re6t6rJ/bIegWTAiQ+TDHHMFXqAZnJPF3Uzj69FHKeiqS/YkN\nOf/jr/+3e1NWetJosdHGkO/yksBCMJryxL9H2ScoyqGJ4gpgkfpvqg9aawVA\nPmhNMJHSY1ISFml4/5s5VgL6ai8rILeuudaiqn5gU45HgO2gS0I1zfHhX63w\nZsfvtvlOusSILEcYeRLY/dqdOUjddF0NnKTfwOGgweHck5G8vrCA9NaZlFz2\nEYD/EuAXoYGe3i4nF6InSScboMU8YWgS8WWkPff9c/RXsKxoP4ABizGy1haV\nUURt1a9t/E3dhH4LMHIEmRwEtIgaQy4TJsyqaxHNxG/tiouz2vt0N3Y+yL58\nz4Qdaa36SdN5EU6iRneXurTrKQ/zQIJUEhvRp7pEfKiu2J7nEvw7P2GwiYDr\nnyCs\r\n=i+aW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFuj5LX2/WnWuMzZuPJkfk1yhTpL7DNf04DDVSiucgY7AiB+4DWGBzuQjn/7l3m1iT8ctzEhvCYY2XrhZbMRc3JJMA=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.3.5-alpha.63_1607953346344_0.972789885912279"},"_hasShrinkwrap":false},"1.4.1":{"version":"1.4.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.5","@testing-library/react":"^11.1.2","@testing-library/react-hooks":"^3.4.2","@types/jest":"^26.0.15","@types/node":"^14.14.7","@types/react":"^16.9.56","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.4.1","pridepack":"^0.5.0","react":"^16.13.1","react-dom":"^16.13.1","react-test-renderer":"^16.13.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.2"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.13.1"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"use-dispose":"^0.4.0"},"gitHead":"9838768fb6b7b08334145246fca111fee235cf16","_id":"react-graph-state@1.4.1","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-sfT2HcI1a3UBancYCh8QifwUKJNHWDeUP2QbhGa/eETi25vMSEdrah4HmU/NZhFQrv2zNX/adjzV0b/0AZvmJA==","shasum":"5c20db38cf301dbe6a68b29fb65c18b0151ac3fe","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.4.1.tgz","fileCount":66,"unpackedSize":437111,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf15QGCRA9TVsSAnZWagAAlRgP/ixzq623+T5hCDCRmysf\nitur3RuSY9wXz3tPy2vtp7hQRfbJyfu2/CLBmuaR6U6lBdgPk6gNjYH4Mybk\n5MIBOJgoh5Wt7jqHWtD126xpaKKwRnhQyZtiwJnwn4CoiAY993yf/ZJAz7X9\n51/OO5lDMf+DeodClfgEW/zAgd6Awgnt7MlJ7llwtQAmRwYNL76TWJng+7eA\npqPWROMx1RlPgkesxlBgZ0+fzv/iLLY+cvjZJkDuGzm7sgt476zT1pjK4CA0\nq/rXd+OOavuP1qVtSbOUTxh5lTHj86Paj4GqXMoHh+lcn4bosi3dVcrj23dX\nHa5NZVdMEGrxEnvVk58sk41GEyzk9zD/sSwBWPgiOCPlKAOsHTbORFhUNiMv\nOq9HITVRff/APWaFPJwwglcpKVb5dyPO6scYxptGybqGnoX2VLcpo01xXQAw\n12dwduNrrlLpN8ZtVTeDEFyQqLC7C4Bh4W97sMURpygSl/TRAfJdvW/8nMgF\noQpr455FK5AtB3Ds28RpNCxLtUSlzkwamHzj7HoTNLslLdoprRpdBo3t9aiG\nZQlCWQy/EIBS8JpKobExUran+3dkdAlUy9KtVwwSTSryDjizTjv+crK7Ujth\n1+IkHhUdv1AjgaFVXnjMJtkt0cnOLvkSEG3BWHz9gK0Pc3Va+Tb/TnCuvRaT\nF2cA\r\n=cfxs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFc8+dhbnITout1n+kAB/che+81BFryNUdgL0fwvAwLwAiEA5UgFhRb4q9PjY3XBP30vTeKRMHszmc5YgiftuOlRhD8="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.4.1_1607963653854_0.7418294877980656"},"_hasShrinkwrap":false},"1.4.2-alpha.7":{"version":"1.4.2-alpha.7","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/index.js","exports":{"import":"./dist/react-graph-state.esm.js","require":"./dist/index.js"},"types":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","module":"dist/react-graph-state.esm.js","devDependencies":{"@testing-library/jest-dom":"^5.11.6","@testing-library/react":"^11.2.2","@testing-library/react-hooks":"^3.7.0","@types/jest":"^26.0.19","@types/node":"^14.14.14","@types/react":"^17.0.0","eslint":"^7.14.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.4.2-alpha.7+ef40411","pridepack":"^0.5.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.4.4","tslib":"^2.0.3","typescript":"^4.1.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.2.2","use-dispose":"^0.4.0"},"gitHead":"ef404112b718f0354f86adec4c8dde627cab3a18","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.4.2-alpha.7","_nodeVersion":"15.2.1","_npmVersion":"lerna/3.22.1/node@v15.2.1+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-bkGBNgu20ycDp9r/a/YdbAasoAiCJW52nvvhSGOwecWai8XJnlYVON8YqcGHc4EZCwU+4kFU1mlp36ytmf6flQ==","shasum":"9d0afe2b6072546f5c6c1e6248c1767873bd3702","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.4.2-alpha.7.tgz","fileCount":58,"unpackedSize":344730,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf3z1+CRA9TVsSAnZWagAAW34P/02ckh2LdHAoYq7CuqQr\nTYAwth5nQZrqhYs0y0C1X2Pj8GxUXd4jUuHzr8ccNfLLnmqQkmihbtMQ1+F4\nJOJToRDXv0160MkQTo46XUPiHXjp2NTtlA9RtrrbbLGcGepBFCmJwbK4gWwZ\n+cM8F7wV9P2muoygEG48bYJNheFK7dZqw2h0kcQ+qrhtDayw5tRWWs+8NrWD\nvwEpiY+bGQvFMnZkHKqkcoF+YxXXNlmD8Ita5WKWVAX0XmH9ZzoUPTksyVA7\nUMgkT9kSrHMIzpZPzaxVJHdz0NpkAM1y+sVf0eUUNeQmK0HOVkRv10M5+PLV\nI3PMQg+YAE9cDgpVsGE7Wm0Ft0Bn3f4AllHtML/UeYvBriPjef/Suur0W99K\nRYWaFlBh07zhSe3olM7F1CkTPGQS27DQCmDB+Yv6z4imbEO/mtdFAFx0r/Ts\n6b+dKlaYR+aYqAeoCcYtNOlNMupfCAM1FHQWzJTLZ4FK2eyxsSRlL574Uant\n7VXY/QcnUV1w/ze+e41roU/6iixM3Qrb93KpWoJsJdbbH+0+jfbrJWVMfIVW\nOqZtyZQxFs3Ll0TD713jKGzLOVoZxmcQZ6muxi1FHQZEN6uqCCRH4DGhoTe8\no5ySw3/HJ1m8wPTE5s0EgIDyfdSKsl+IAmnDTETVzQ9rp/34sR5btC+C7Nfd\nDXdN\r\n=ZQcq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDuHThnUsJ9YslIK40GoluTPnJ+eYvdKtREArL1dKmIbAIhAOgHaaeeJ28oFGEno3ummxu18Mm9y83tSh0iXYc1wPIE"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.4.2-alpha.7_1608465790204_0.37308257757573426"},"_hasShrinkwrap":false},"1.5.0":{"version":"1.5.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.0","use-dispose":"^0.5.0"},"gitHead":"8cce82394a9383be900f26be519567ed1da5aee4","_id":"react-graph-state@1.5.0","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-NxASuqaeCxSxmqNv5Q82DQohlX3s2E0NCxhMKM9oqFWMM7dZQ7aEyQinL5xHjXGNzVQ3eJZ9604BP0ZrmQkLvg==","shasum":"855730531fb34b725f76afe5556af3c54d1ed638","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.0.tgz","fileCount":50,"unpackedSize":254786,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgVd73CRA9TVsSAnZWagAAINYQAILUpOMuD0k/DKt3Vhuo\nOP9iwAxJ83fCySE7DJYImc96mKmqHMtdR6rgmFY2vkDCu8lDZpyl5azQZyCF\nE8Sp9/uJS492mIhHqlnvgRDOKzpOtU1UndI7KIUNszBHG+lqGoQyykT/QUp4\nVZSEZF3rKlK65gPyZrOpCdbCUy7PU/eoDvBPGOmXHyrycmQuWgWlfAOHILbY\n2Q3b1ijsNYplIi6sB8js95jwzgbCyK4SZGZWSe/ELM5bcrLk85/N+Jws9bfh\nibcs1wU8ZwMwPh+dn1XcDXaV1IH8sAlA3oXni9vtbNieWi6A0DUk+ofYOX24\nY34z/zz0qDpgcJODyq2jk3C7NjJRLokLJRnzvQVe9jOhNg/g4YlmdL8bO/Mj\n4nniREgFuLyj6bw+pVaSJ8mKOtd51ARycREYGQ4ikVLewslRY+jplaEap91U\nawqDqJodL/oHs+7QvsT7m2wFcqMqvLdxjnss+5oRMVPN0+k3JMQ3w/LPfbwb\njAiJHOilfs7Bl0HPmCLkaCOfmWRWDSmk4ZMAnufR4wngvJoyREn57jsxKtJd\nPcyda/KrY/Qjb6DRKd66HvX/mfN0JPI2zEtb0bcq/NrbmFbxg7URPRNM4ePl\nGLBi7sA1Nm6kAjY7grryyyMsp6BupgBsp4+B9A7zvESZxpFzc7kDLi+0WPmP\n/LQE\r\n=Y4No\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD9JE/G7J+nhsueAaGBpldo5TFSKL528tX0TE1cZvYfugIgZfyPYsfbYKtpGpB5C1EAY/GUbDxIGKUQGyxC7JZu0MA="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.0_1616240375368_0.2175493542166469"},"_hasShrinkwrap":false},"1.5.1":{"version":"1.5.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.1","use-dispose":"^0.5.0"},"gitHead":"363b7fbe5aa752e8df313bd1f49b9792c6817613","_id":"react-graph-state@1.5.1","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-dGmHzGbTRhJn39LerNaeNSJaDOswuwU2tNu+bJTAZ4RAilGr564mTVUqFn8whUaSSL6Juu9mjLEP8vToN9nTgw==","shasum":"7463b75b69e49250372d368c32abb045284ce309","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.1.tgz","fileCount":50,"unpackedSize":254786,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWZncCRA9TVsSAnZWagAALbAP/iwtZF9I7XEV1DDUb/mv\nm5E+sf42xKa9KsTyy/HrBAEmpczUjzcbWxWLwcwVFWcqRqgu1vwnz6pt04Nw\n62ePS0ptqXAeMPYn4tSoP4nFjEhdfjyyGUIHyQoa9jH+gtF6PoJeLlDcHU9F\nMwf9LU5C/Vo+to/UoODevuBaU8NpFf+z7+Wp9i3lBrjFDELQu5E5w8srNFbQ\nM7p6cdzlJwK9diefr1rLLuk+wXTxgI2u5R16H3sk3Tal142dk9lAYanKiLA9\nAHiDtPuPPsNpfr1CHZU4eDFjf2WWBErnL978Kw03pzQSMKM6xZcx/4NrrAXk\nV41WkdNUk6RmSXhbBg3/Q5/AgJaXovAbG0OZkYmrgLP1GG7d+DDQu5ZPjZja\n9rlRmUvqcv7c0qfxVmiQjQpv+U2eRS264CJEdT4h2TtKsuqLTqXwx88utHYs\nLetKr3YpHYMqpaGBr/V820W+R4qLiBpI1OG1cDhFJooRvCZBFPzA1a6crrkR\nYFBaGbU4QoQbnHRVsVWZ1sduEvhpCRQZ+f5P2wJb/s1keRPDRjJ2FG+eweQz\n8jggpxNa/cpuhLjM1/4pFz0B7DBlBzJxFI28LLs3oG80kWhUrfhli+dgomNQ\nfouIdeFEuXkoyHZzQmSVx5gamHiU3KO6qLUTkxvzgh84DK3xy1889gXZT0Ng\nTaGk\r\n=FE+5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICydqIK97xPnTNaBhaKiQCMI7KJIbfV0kMsUqQV0VqR9AiEAkLCx+rK3oKl8COFcj04hyTD8kvST97MeFWwEo59ut0c="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.1_1616484827890_0.8449035094407846"},"_hasShrinkwrap":false},"1.5.2":{"version":"1.5.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.1","use-dispose":"^0.5.0"},"gitHead":"35d74bd80ccceb3697fb7694dc83c9cb13e3683d","_id":"react-graph-state@1.5.2","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-wth7fS/MyLWPGuCoViF+dZ2PUdBqPyTijkzPFfx2psG4qBK6IN7L4HBvKaSy4xssvapsCKeCxOcc9xoQI1b43A==","shasum":"8f13cad369ee7833fad10e6cda163ce2bf118e53","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.2.tgz","fileCount":50,"unpackedSize":253851,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWZ/DCRA9TVsSAnZWagAAqBIQAKOrAT/VfJSAps31KyPd\nRokOTs72EPcMQJ3JemTT1ywX1A275Ti3cbfBsD6muDF2VY0TkkDIIAVmyN4z\nB28AtJYuQz0quT4FXJyGoT8O0zSQusD9Da+hqt1YoVg6rhQh/L4BVsG9N3G1\n1VPAfHHE1bYK4fFLIn2TWQDi8ydTk8dqdBpEmR3+OmJ/hHgiawj4Z1yZI0tS\nfrn4om0xpiLpmIYvX6V/IgEDvzBZuo4qWF52xmeSLgKLnUk0fCXRjPCvUtIU\nU6AVUgdaXW5s0h1lMLaosUglCAUFgTThdiHc3p5g5EGIJa+FMYe7P9loPnRQ\n5ukA7buyKNBZQkDFsaohILX8kUZgHbuZ4+E8nPtWKl3Q4KT1dqU+sZqJFSlA\nT3+OQ6g3NUwjYe0uUnLxXlpO0pGkEwgkhb+81VyeoFDNKfypcLTXXtxe0sVM\n0NNlQ9o9+Zua3rxAd5SSiAGhytfCqamS7rgX1fdn1spOd7YTCuROAsLSZqRl\n6rSgwQd7DxIkda6LECDdOB5SwAO66bxR8mjIjEZZb3/lkFeTZF8Y0KC12zDt\nsQ0DuojsfiFpgIA4xX0H16aN0DGoRwxYjuvxk8eckJ5SAW8ada05IJ5FzbRU\njwsbdLGiz9h2FmNGvreVhNwzsxjyonHAn1hLDnZAytwVJ/Y7OPTk0k8Umk/w\nUnpX\r\n=Dusp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQChCw3LZueEry8lrc/jz002djw+5Zq5Fh4cOY8GGiailQIgToVElQ+P4t8WQ3WgrlPzsXGC9L6xH/XbUn4VPmv8cKo="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.2_1616486338470_0.32990400032432077"},"_hasShrinkwrap":false},"1.5.3-alpha.0":{"version":"1.5.3-alpha.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.2"},"gitHead":"acd701092c92456c5aa86fb12148ead90bec06eb","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.5.3-alpha.0","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-00WUQ7SjNg5mx5b+QPR6WetE77RAkyG0NibKw1l9JmDBsApqB9eGlB9YpG1Q8JdQ0H8xTNUQi/u2ePReoYKmkA==","shasum":"2790a30615d6d6ddb5995bc3aafec07f53c6052a","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3-alpha.0.tgz","fileCount":50,"unpackedSize":253467,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWaPBCRA9TVsSAnZWagAAJLMQAJtA1JjAIb8ieEiv8RYw\noPxXN4qWsfMDF/Q1/hYwFUuE42BB4gA71WV9ULYPC/IZD38rszCNEs4HnvRq\nmrjiD/EER43t+FzuVyUtRjU4L5j50JXsQReU2S4Sl/bzpeOVGS3sdG+fWofL\nGVB3sqjPqf4Qx4kHwsejJ3k9dGt7wh2bcq2A/aY9wFWSA/nVYS84SgQ9HYVE\n9zt7z2fPEt0GPuszyIEYe/WAf6fTSwgaiwJhPEXopIg4t4od5tlI85qzH8rX\nUqTuoX0UA+mgSt0t8oDIxRLaVeoxsGAdwhfDsL7pgGZUXPrSQ8pHpZTanNJS\nYk9akWAQqcABrpL6tpmEMw0KcpApa4WANV2psmSWyliZ5BBlrS4eNtM7bFly\no+oU2q/hfCIqx4M1n2lHy6KrIsO5eBVK1FIA5FY3eEKegXzmzEw4JW1N5IoE\nMfpxnecNoyrG0e6EdMZJMejv1puj6D04HPePhFQoAPLwrZy3Nq5sVLMyXCW3\n7elunT+t7JvIMxhqqBr5p8kV8J67t19YoCKpYKV/G0qpnGObh8AXQCuJnG+v\nry+QCImhA2icsPlmJ7w4k77SoCGkLWO8kBbbtZhZBGHt0HmO0mxJF1M95qbw\nk3mBjfCNYko23k3l0IRKwGf8IEcf8WWZfBWAdUtbhMRm5Z+wBdMKgO30eX2S\np4q2\r\n=aFuC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDnzqZgHgqUXLY+nVxCZVO+dXMELa5J86HDgANB8cv8MAIgYMp2aMyBSRw9YMx9KFBQSGZqrvEZLG+P1DT0BpUt7y4="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3-alpha.0_1616487361543_0.5640845149321694"},"_hasShrinkwrap":false},"1.5.3-alpha.1":{"version":"1.5.3-alpha.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.2"},"gitHead":"8239a72ce65db4f56d1b5eeaa6bb71662c00ca8e","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.5.3-alpha.1","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-CvVJmoLGw1oWE8dFeR9NCvgao3QlMI6aWo79BnktWN9YYgXo6Ebw06sWSSox4r83NPHZfhOtpbLVRTj0yIOZ+A==","shasum":"14e1e3a73040c01b6a06a5311cd4956037645c8f","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3-alpha.1.tgz","fileCount":50,"unpackedSize":252887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWabMCRA9TVsSAnZWagAA3f0P/RvKHFZrxTkb9tT4tfWE\nsx49n41gtKyacBuhz1l+D6vK/UdxLQH5bfJoRKdPb8+/b2j1zoCge5751RHa\nhNbCYIbr+I6RTL5btpBDaTr5/exv/QHoOKw4DOC5GzoCjTDjvjPbkG+hoTJx\nEnQSjiflvodt7deNtglwgTMrsNgVDyhpJs4TiXo6BOxq+CXcw68rcYsVJ2bj\ntVel6Ywj0IuWT+zzOqy/njMZwKeVl4nJ47G8bBJs5XaS6vaSGrnA3a5NaxRH\nqsuZsiuvpobEf3uwjID7/p6c39W7QntE4nukRuvHfSWuiIH/H3KmIgCkBXSY\nzfrHiDj/S2G9DmXeWbe3X9Rn1/RnDVQJAWerdJaLXLQI6Pxyz0TjsGIfQirY\n3pWiea3WAQniCx6LCY6lBeYT145KtmCVKEf7+D1et8v/VP+J8bae2EaYY6wn\nxmgExdB+t/Szyw5ji9P9wcql4lAvbb107dmkybldS/0kO2xkuOMzwW+LocXA\nXOePyf6a/1x/3w3qenan/WNTfJu1VcWDwY0lgOxiG6AKGE9YPA0nwPUfAwPc\nt2C9k57PF6hopT7JA2Qy9xL1tvclAaBWmwHJFjutphIaqYRKcz5PYs3DlXkv\nM2ARgNnmAwUPRwlLmF5emp6KdEfuMlXh1n2kcfmTzYxAlKGyyV57khaAM7Pu\noa1Y\r\n=Pmku\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD6+w3gNR4mts5TKZeMUPToCHu4nIhpKsj6CJJHUcuplAIgedbe4SyYEuJbaSxTxvf5IzXITfZXmCTKpOY9DnkVZMM="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3-alpha.1_1616488139593_0.12122095776167696"},"_hasShrinkwrap":false},"1.5.3-alpha.2":{"version":"1.5.3-alpha.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"31757996c452ee449eb71c57a58e34154d6ad018","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.5.3-alpha.2","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-rzWw2vBXb3vKjBopzP0fpDZabAOEyBnL4X7eOPbE4OCrGFfBr0lRGgF7Qr9lwl4wR1A+HD+9tIJlRiEe1V4jVg==","shasum":"d4aaf4a8631982a3bc1fa36efad2d9be7b31b2b6","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3-alpha.2.tgz","fileCount":50,"unpackedSize":252887,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWahVCRA9TVsSAnZWagAAhOYP/2MWL3PVMdLpy4GEO0H2\nF4E++6S/xVOZ8yioiwO0BcmJ+3TFSrU1J/Ps4CyhnCW0E2whtPs7CO5ocisK\nGqnPwVpenkBSQUkgjcQ8T+yZcyeg5ApIot3sF8yXr9Bl381+VDHdGonf8kvr\n9B3AjbxGADPsffUHVgb5LIbw/Cf/kRZwCTBOSMVdr2zkJ824kAVacHuEO5T7\nsIkfpLG2QgVorDOkTeG3rc8tFTEGsluOzMBvbuxHlyklPQXfN4Ixm689Mco4\n4Sx/pZU4AFYN6lhYEjXYB2zcGXN9g7pZMOKNFnfJSJ+J/xzD1/DvTbEvW3d7\nCJL4Iq/h1eaMi6neseNQL2gmSgZ52w6wsOjSBOytmpaRHKBrZEl+BZq69GH9\nlOf1s98PjLMY2Kf1VK8AmciNi66ezRZEo6q8X21db8WtZBh49o0J3J+ScHX7\nOlSxStbCm6Z+eH3OFhhqzmqOK63FMik8PUQlr9r9/kqZbiHbaREOptBdu6ms\na5glA7kqW00ergSwV/oPk7vocz+6rBtdQBIYpiw4/YguXxrKokq+XaNoTsTr\nSNPlUlnKjnFS+wsYdDpFS2embmys4vPK6go/sMfh1igBqp5DzN9hWGGDxxCe\nYzzcPa4b4hfiPtLcIH0QRfCpefgyuidGAoIWDA8EBvxPGMta1WBhO9/t6csF\nOHGF\r\n=3SyM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDlIX7u52lBP13BMdCV72NpmThpT9ww3ZEpS1LOazgxqwIgPfhzP+wLZSD1VJ6POxecn8w5FVg6+cn9mvvZtKpChrc="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3-alpha.2_1616488533055_0.1990758288259551"},"_hasShrinkwrap":false},"1.5.3-alpha.3":{"version":"1.5.3-alpha.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.3-alpha.3+ad77419","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"ad77419298df1bea1d76c9ce9824de5e3a2d259b","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.5.3-alpha.3","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-G+fd1RpUukp8mcdYi2MMhrL1IVVDHD+823J5YmkykV1kHJYHJzfMTOa9Y7nFCHghGMC5xNcgSNgSLGnA10cRUQ==","shasum":"9a3c534435940ff818f46ac54685be1cbfd80fb3","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3-alpha.3.tgz","fileCount":50,"unpackedSize":252903,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWapACRA9TVsSAnZWagAAnPQP/1oVBjB4AFV+afP8EnWt\n7DZmSJxcKE8rfwu1U1nHz63Y6W3i3XQzB58l34HmZtiGqZ6mBGw/6QLEMfTM\nS5ygi3tyuqqA5a16y86WMtDvVELYcBXHl3x8nbh9T3ubRlvT0Otpf1Y+eNiz\n31c0KthtDgTKgXb1NYU6LqpPmpWTqS1vuGcurdyZxcJph85IuCn7HXkJQSLj\nMibWcO1OwCMNTOS9aMximzuk3WL6DLA7ETyERq0UK0RUrdur4N9xQWiczvPq\nm6MJX43p2zwl/nXCkj2f6kd8Ygr3lyhIMM1ulXgh4hPw7vYvMxVGVOVYv2gj\ngAMur8Q70NB+F7usI7hh6QsimTld27yUoZkd2SRsZBxDUt2ra2bn4TPnuXOS\nrFM2NT5k0SG7I9J0i83hfPSZR8tvmwJNHNZLZHf+u2CWjA5DhzWgu+byT1qQ\nob3gTPKrNAfU31Ben1QZ6JrQczoZaWNRNOASYD3Hc20oL6rpFzyxupJiSYhA\njjVcbZ+NfmcE6JCi51h3FthFxSIbJSs9S17rRoiz/yEWd4N9aWGXg1mnNA+P\nZX0kkaTXyLc80RpU5Gajes+nKupqLFrJdEWtFRRqLewPP/9rY5pvuupI6RzI\nSPQg/nV8tn1oAlfhw10u2lfIbh6keXkXAOu3T9nSwzwrWZN7pllmI+Y9P52z\ncTDK\r\n=KX9U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDzDeB1j+XnC/p/Emo0GhUEgcowD+nZctaYvaueoacOLgIhANq5dliwy7UfuvUYpGz8g14MC0tgqF5SxU8De4L8mIM0"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3-alpha.3_1616489023627_0.4044388407546593"},"_hasShrinkwrap":false},"1.5.3-alpha.4":{"version":"1.5.3-alpha.4","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.3-alpha.4+cfe37ca","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"cfe37ca1aaa5e17d95dd032b6f5e7bcd8b49adcc","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.5.3-alpha.4","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-7G5t7CFGTnNWKAYtB72AhPFGE1yMgMrc4xSTJkLHalO1FtZM84gQzBU4bBgB2Wd2mp2fkrtqlDdT1d9AncCTvA==","shasum":"be60d6ce27b1241295c92fb24838e46e502e71ac","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3-alpha.4.tgz","fileCount":50,"unpackedSize":254612,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWa8ZCRA9TVsSAnZWagAAJiMP/0tYPKQePXtKhc1UMbnw\nosN/cZP9WXc0p0mARGJSP1AJsN+IIE5fTZz/5gpMH9cPApY0heRwpkPnP+CK\nRpV+T5rZVPd/5WvxH4ZHB/w1rYi4e2+AyoIC1T/TFeADYeGvs+5MtR/LJbpY\nYwIV5KARaIxBUH54rdFjgqGWJtQGhz30JVIfeJe+xL0/WCc+E1Ck88sVlAPd\nufKdTYMQtbYKPMe9UnPi62/TULwWmcePQ8G4lZ1LS8bXvMtdqqsVqpVh4etr\nt/fdGAs8r9kjNS/UGjDuWuAdUmU2UAPv4BK+Gov92YLLY0tXqp6h91Pm78tc\n+dhW7DdSxT83aUOMaNbKlmeBQ1uUUzWs4ECCN5Lz/kuaW5DSllp+Z12HO3h9\nGQQB7jwwTaEHJbamNEFBy7rVNF1IJN/5NXN3JqIpLx9GKymDP1XhH5qyX79L\nhe2Wj9MI65DJIUV+cYxlPZUr+PcV9/4WI7PpKdSAnWqzA68tlIaGnGKGigHG\njsdikvAF0QUd6flGCdWBMcnx3tWwGm5gEJn4ANznVYDCrlTV4NwsXoIGMZZs\nQUhj/CHqNQuyuVBCVY7Nac/o3WchxyMWC8PA4bA1eHn2HYbZXhQLVD+dPVce\nAgi5E8NKjsBO39XDgWPeIcqdXoN8AuTCIqPRqyLLYkmKI0dF6SZ2GlMzck4e\nLuaC\r\n=xXWR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDdJRVuJvYkUviQ8HQ8LM8zcnkIZZBbf5H/XXJBA5rM+AiEApbm1wvJ8yHM6Zo/s2/W4eL43i6xWv45pJXxQyEvtkRI="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3-alpha.4_1616490264580_0.6186479393911182"},"_hasShrinkwrap":false},"1.5.3":{"version":"1.5.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.5.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"d59b8d53331c0a78205293a9fc30dab300207ac5","_id":"react-graph-state@1.5.3","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-3PQ6FMMk/Js8kTJDcXlapt8Zt4auwmR22c8lAWHtgwLtl1JxFxTTPbvJlE21aWn5UVbo9VuGN6BzTRSX1407vQ==","shasum":"1e19624372567e313798f8e19c269a2a7842bb6d","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.5.3.tgz","fileCount":50,"unpackedSize":254580,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgWbBJCRA9TVsSAnZWagAAPukP/RSUn+hXbov7Gf8hRnDT\nQn0yXVqfSfrErM3FxWlTueKf6Abk5f1smmJaI4nnwU3ZtpuaPj7kz4NiL1q6\nnNjkhMIsjS8gOo99MLiGt9tNQY+DS+sL8VU4cYLC6ap1BGhs+zzDErB98UXW\nXPc8mRVoRSIRHEzS2HjQDMwyOxmxuL5Kc5MOU8DCrBeHOon6wMS41SlKwAIQ\nN5snqfYH0fFvvC+tuLizFAD0WYKFQLS8EkfmFujDn+1kb/D5OiASU1/RGKsV\nTziI15VGMAr8gGKiJEvNfLB9ihe4LkFcEXDgV6NeHn9SQO6taJOG+8WjmVsE\nu3d+/zvpx4ZuL5nLwZn/KfWUP3+7GHzjHdCxTKD6xA+SQS/iCz+EtfY/aoV3\ns5sbq95Iyq0d6oY2e5+8N5SWGvO3pQl+PW5wRO+naz/6CkbfmsoIUdlzqmeI\nX/wo8/J8X1A6NaTuja9unA8rhg/BHpDE7bvC4TeSq1Kh78XQ7GtfrZ5T8nzU\noIDzltW4RQQiqHwV5UmMCJ8YEY5o/D0qTdkIGVzZQTrQ/JHEq8luAbTK4IO8\nwFmxqtTCiYQqrXERgB0Jy9kxcX9TbirP9sg7zUIKMYHk703Y8j/7FkOWYixi\nt8WaOHHhWgRHngGUX7LgqtSRHlF83OMFOfBMD+ueHZaL4GxaOIflDPfZmDoG\n4xdf\r\n=F1AZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFWGxrusssYsNF6GSQ2jsL5DuR6DssxOCZFc0LS1Haa7AiEA4k/lo7sBwERfDWZL74BCPeI1WVZCEclk1YO4dJw3yzc="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.5.3_1616490568891_0.6829461236643213"},"_hasShrinkwrap":false},"1.6.0":{"version":"1.6.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"70bf200cae88ff745c7ebaaace96cc9fbbd922e6","_id":"react-graph-state@1.6.0","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-B2hirNTHeW8dXSE0JE3bZjI+VjLglPDEg3k3LyAu+41TU1Gl3zaoaCfBReK6SpfJaYEFXD/oW+6qNPcr17+pDw==","shasum":"466f2600723fb71fdf600c799c66395f95d47cee","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.0.tgz","fileCount":50,"unpackedSize":254801,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaIfNCRA9TVsSAnZWagAAQokP/jca8qDx6nAaT9q4A1tj\n+PIZxj5eV/iRPnEUvvSnrXohKJC1KXLiuMaAa55+fciUKF0sFe6dHsL5oUeV\n07rdfaz+VBYhCLAqieU3ZeJqNAsCWqECAsSNdsLU2DT2M+Idr9flW6pDE4aw\nZJzETmijLMQD8I+OfOMkCnavFSdAd5SibRQjwpT4oqicfJORmxXU4s8FduQe\nN7N25I2OSRC8XnHQLKMQu9ER5yMrhygUzCmlyJ0J3XDNcpWO65L8gnPLfi86\nkSm5jMmkUwbUU9tnO/MTky1RmZjQ+Zah4/lMmKouqFy4aYIVVXCj6RLplAji\n4D9nJP5ivGcv5WL0lP12R+V3YJ00Cnhd4J7QFGp1xuy5+79MVlcLnIbxarDV\n7r+wLlYotstE9XicpYGG71ei/2mDyur8sObYITEr042X3flzw9fUOmwwuWiY\nL8Yp1oIuEW+/qTQSjHADnzg7dKE7YJ0uBYYA/AfcDNNLi4J0wPnLDkFaNQZg\nishuYzc5dg+6r5QjU/yy+HSfL6Ybp/qj2dKLmH/mjZzXcVH5654+LrIzevte\n16GR2/PYMqFUZ6263x0E+Gd8K0dU2hgCSGmrUkkiqhjxTHpV9nc6vaQIG1yd\nus0dEZOaaLhPVdyanBHbH2Hq3ZUoZccqosIBVy2Z3osMxHZhRmf5J6hTqoqc\ndarX\r\n=bZ2O\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQChKQUmh2pWM1Iiya+DN5B5c5ikDin7QqSH44ynsot9yAIgQuNNEgqd0fkLsELHiWN4QyV8bbNvuqcUywCpai8N4iw="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.0_1617463245067_0.8559038268697305"},"_hasShrinkwrap":false},"1.6.1":{"version":"1.6.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.1","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"ed30ee63d826dd53ecbaf27dd5ee97c6c2d37f6b","_id":"react-graph-state@1.6.1","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-Zbj/qYBSxu91CmS8+X2r1B98VWghjA5/R7iry9Y0QAWWaVfrIakxlZpAfblE1m6cTjplFerJUoPfvLCk/zyOdg==","shasum":"e0e62141978e359067b54b6ecb702cd3ae0720e2","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.1.tgz","fileCount":50,"unpackedSize":254801,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaItfCRA9TVsSAnZWagAAqgQP/j9hGG6ioHdWyO9CuyCY\nDJ66omxnJx8G834hgodJ027f32BUjFAbBsYQcPBnvu5NbkiDbzIJ0dLZnX3P\ngVJNkj394PMULknFaa+npvesfQAbYJtlVk49HxUnmxj8Vp42Dyprq9cjkuB3\nHKGh67uD2vGFnBrjKuon66FpachtYujXBh9qWhEsmDC3eeke4rZzlyMyBjaa\nYGtz6cxD8Yf+a856Wwn3oWh0rzNRSXjPfp5KIVk/IGGv6k2X7Gv26PnfjeFZ\n1mLB8XU0g5p1KVNudU+KOZdytrjLnER+hVtEvyKdQwO4pfoIt1xqrGiT8Ciz\nDDsHA6oLKXNDNHMk3N7jJz1f/GKRhrCcH4owLVj/pSA4yCS6IyQ5V4gwLUCb\nrnya2NB5ZOgtS0Ru49galzQVM90czNkmEjAXTmoTZViRIZ4dOODMR8T05//F\nGUWvq4QI6nwqj/HaeuWhr8FETWPvropjhf/bySXBU05/4uqsQ0vtbPDiEdaK\n5Up8JwBsRofEAtSksb3KVV7HqBCj0j0BR5SbjumqsMSrNYjyvb5KYJUzxCIY\nOTYIY+lC4b0CNFq4JaZwdIuj9ftx6iDmADQAku5M46ar3A3Z6rkE1ISNEfhM\nBqgVabkyO+GEJ+1I3ijfcGEJ2rpX07ZicYzdiJJFObzz1EY8i3w8RJeArcoo\nAldU\r\n=SyDZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID/XJQlA3HKmRqgooaSFvsLH8eUHBef66AnScuwrrqPhAiEA974zJDVAR+SL/Z6+g8FLA8f2NP5AQ82qzSrtldgfS0I="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.1_1617464159049_0.5238774966399959"},"_hasShrinkwrap":false},"1.6.2-alpha.5":{"version":"1.6.2-alpha.5","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.5+9fef045","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"9fef0454fa006fda4f7ed623fe42831e8f44c4da","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.5","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-PiSKielFYQzK+6uc8bTolHMfIiDYZEA1mbrTE2saCEP2kzWAbuOBSa8wh2VHFiY4OFE6tcmYwtSxjGUnn0Ar+Q==","shasum":"48bae0cde6f28327bb0a0a7847d0b6ed98a720a0","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.5.tgz","fileCount":52,"unpackedSize":268099,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTWvCRA9TVsSAnZWagAAivwP/3iAgyuYXWtj7/be738W\nG8flIA56c4zSGYsKugf8jcVlOtroCVvL/nKLaFjbhXnewK0CgT1EGrNls196\ngS8azd4kxPFrwy8KxBs9m+O1Qiq7L4D2XS1HlXi3zQ6QJkkt2N3P51+0RtOs\n57Jd9wKNUwN5HOJaAg3DFpuub8EeZ0Nf8dxF3jJNkd1CaYeI/Sb0HdYFz3hp\n0rPm6PbjrJNnhrDHXaLb0q7Cj3FKNuw0VxQgbha5mI7QpDftWpFo+bZx4ltZ\n52VJxdeEe/gjP0onPogH1kbaJk9HAGR09gnQXitSx9BbOpRlv0GDllIsIbF7\n8S6YBTXMusZOrMFZ614GnNCGfld2YAELu61ERRji3YDz6UbyJtwSl2PypZbW\nt9fpaf/3mxzr5r6Lw3N3zfRdHHZXj4H6/Dhzn718xOOAfFA9h/ZaSDJLMeQi\nAt/SZj4A9F0Cqb8CKwhMhanFL1IjO45Ch7/NQEiTTTOhzrGnxXJFukhbLXyl\npZfp239DQoQsE3fUlD5Pe4ferCNC3+d4Ak7obqYCO49cmhy5PDTM84mm9ldg\ng8PJwu3NaH7Q2GYRwpKPQ7341ZjxrBdPiBPZOOJ2h6HugHex5hcATAevg3m4\niVC+7mpPakEkSuELmqlIRADXHd7E4rdX/VesLnPNfTMOnAvURbzxb/tm5XVK\njddr\r\n=Z1/u\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC2yI0z9bfXsxUsyMUuTxMKqmwqcUov+T8O2y07J5tSWQIhALUL+WAvwFEs1a60uwwG/7OO+Pnlh868L+kkzICd24rh"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.5_1617507759418_0.9028050076341907"},"_hasShrinkwrap":false},"1.6.2-alpha.6":{"version":"1.6.2-alpha.6","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.6+67d1e91","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"67d1e918687f58f362ec6b9aad619e27f7d441dd","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.6","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-WM1pShF6mvidqwLVpLWiWoUO5fQ5nZO8uMUG8/cDehBjHbEXe+iskodvhTK4qhrBFNCTxMrAjN2/lnCwLHjMUQ==","shasum":"653d4130c93deb06d8e0679ff2b296afb560261b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.6.tgz","fileCount":52,"unpackedSize":268099,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTazCRA9TVsSAnZWagAATsQP/1AJnJpTVWnSGGCQnzgZ\nZ+1V+OcaNNf/k+rCEgVWFgrs+cKwGfStDh3XJ0OfYx0JeoEeA+Cc+K92sjl7\n6b8xpbuEkVcOuj1W2XhgjosVhaAM092Df+GeoLY1SwoBiOQeaWqDd3VPEO69\n8Ti6zUHB9N0JY0RA4H4pVeJ6f6rZhq//Qeu7Hlu91ug+1yV+KSfl66fq64Yo\nkgVt7UvUM0FyI1ma22kpTDm7eCZNh1fLFWEPAX35uFbGT5Itx1pN3wx2Schq\n6h/kNrQnbpiJ0DWQKyhAYSqJTXp6k+8pyAgQpV3tDf8UM3PevXNRTK8nsh7O\nzDecpkZd95Nbkz2Ph492EjyQX0RIb9mYHRBms3gwdL4U69Yy13S6Dlz1Fblj\nUQopMRM8vMDdfOkiPWWM7A595p5cYs88MYW/j088umH690YmUfWXdXOJkJpq\nvfnyu2j1KRP52wsEsQDTBQHfFuWp5C3VodGllWyCH7snU9Cf+U0XwbnPh2nj\nFcjWukqQEbgO7SU+VqaI3RyZJ2DD7aF3mnYUcPGG5JZ/M+bF0I2cmhL2jCaF\nK/gi+6mrZzlTplDhu+oNRjoobEv0D0K7Bt03o2C17CVJriuYKbHKolrylo4b\nZkOpXu8eo9qLeE+Z1uwGoE8E8iu+CSeK5Xi4xUsnQymBkoMVgvz7Nv/FRHqu\nx7Az\r\n=jP1r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4Hhp4Q8CIIJfY+TIhNiPx9xKl5a3QxUBJOdoLyuefVgIhALp/qOiS/0UmcSwUt0istgl3+/74X9CHRdy6eMGXS8Rb"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.6_1617508019149_0.7410741161013643"},"_hasShrinkwrap":false},"1.6.2-alpha.7":{"version":"1.6.2-alpha.7","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.7+597b904","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"597b9043b1774e76e57c07c596a84d87b7ecc437","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.7","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-UzCzvAtWwedYxS4WXnES/moekKpSKDuhOR7lM9hs+YNpM/Bx8lNVndboV64oANruTbfAGTGl3zhywuWmb1kTow==","shasum":"48e324e9c819ea8a513bbc988280efe84d2c8421","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.7.tgz","fileCount":52,"unpackedSize":268099,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTeyCRA9TVsSAnZWagAAVj4P/RIZtYfWZXKhVyb3B7Lg\nCMz+OkS+Pa/UuomowyUCwAJECOaefT3eAU03DIod7Wa+rcTzRQmjSOC53UqV\n2mDI0BHlXIhHdUmUdkUQ0AQKyGzHKqEQy1iVLbHEy2PGU/eeoNGql8Beb73n\n9KX+GEkklRdYv8FF+/7DtA+E5PpLCjSLgu89jfUeQfU3IU/HqqwwBDO9vW7r\n71x3Ysyqlj2nPZ0nCrqPc8ntV5JoSL+1SICXbP6Dd/lIRVVXI/DLA2noZ914\nrRwimkwFFLGRxBGrHvdwfe/Dybw+cUNdRHmfKnvJqUq5GtvsEQVWrv2C5pIp\ncetfKgZOgjPxNXkiISuScPqNYkMdVun1u6b8phfBIfGIEhHqeCostXHB796z\npdFCBM5EzRgAOKaEGa1kfNdeuBlUk1giRkBWj69NFeXNzlVdDhSr93JT3hpU\nB8LLabD3vh8vr5oCkeF7tnNUL0EURjDa3A8DPU4PnslZ2NDzA2uq/QiEnclQ\nQGpu2nDkLFKZ1rEdrn2b7iQ+2QIBOzWFMMaomC3EjNRWY0kBb66uU6vX/0H6\n1xyA27GiAFzB6j+avOY/gZNM1/fpDz85/+JKr0pxy1OqXN8D1ROnxdEvBe53\nF7hUSOZDwN+pZQJoJq9KtMNxIDXjsBqG9nmwXVwKfHpVNeSf1b47/JVBPWv5\ns6nW\r\n=wM38\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC3Izz9Swav0j+dofk5YsUpLHGq+ceRI0uMSbX2TLUSHwIgNaJcxg2rxp5E8XRMiL7SA08Qd01mzWn89AxZ36yI8q0="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.7_1617508274208_0.9522086734911053"},"_hasShrinkwrap":false},"1.6.2-alpha.8":{"version":"1.6.2-alpha.8","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.8+7ea318b","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"7ea318bb7556de56993acd25b7f6efa16d1a9295","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.8","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-dWKcswvWJPtfj5PegDSArL+tEcT+26wJUBfoQOaAJwfDWbq5R/w7WyIuyxE/qGFXDzTfdNoXp1xZx9NBJznhsg==","shasum":"bf5732bcf0bc70e97a9e82e96c758cb6205694b8","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.8.tgz","fileCount":52,"unpackedSize":268099,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTqvCRA9TVsSAnZWagAACkYQAIRYEkWXLJtWqkWTROuk\nUhQVcf0FlYL4oUxSLodYN1eVcTQmUgH0TCYsKHYheBE3uRz8NQg3u1RA01y1\n8Qc22doxG5b/t7qtPDezuRZ85EuQct+U1NpC1ZluIMxt1VxkD8f0gWctYqK6\n8DIJ/820dfaII7D/pHjC5GQF8oTaMl2SOpYLd+lQvSg1hYqmvzOvZ2vbSjpL\nZAdC/+uxGTcps3Jdre9aeujHJbRA6FRpx7zt5gRo9OyyzNSP7ABru8dEwohF\nEZqa8uNmeQ3RdvZ+gH80SSIEs3GCE+oiJazs+g+d3s+1rdLOjoE+lLpR7NCw\nYZ/V92aUdgLRmWiRicaRconCD8Hu5iGx0jUONPyMEwFncUK88aBIYlI9wTYv\n/LxQEAdSlZber/EjOeVCkmk3qEb5RQmM+MHn4xLgzaukYCCX80+j44n9HqHg\nBHyZV/PqOctHfA0L4W+5Xvt7FihMkq5Ge3bBX41dfduz7Dab6mfgYObQxmGK\ntqT3CiwqdS2j+1+F3KzTZzLNEJVAS1YFkuv8bPyXe+9gTp6+4keq+xYnJQ3w\nzz9fKALLwKXv9FDrYr8nRsN+JxDRsByJ+s3YdrBaUaVgdFL3ZSxW+NeJ9Jp5\nESVDjik67anBFbUMrtKX/E3ECOq0yagu7g+/roze6UvHSnajJ4LLQjznV/Ul\nhDMt\r\n=Ls/z\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDzQdnJbevm5zeAXPQ/qBzLfusXH6/V+yA83LlZ+iA6EQIhAPaHk+OsrKCXsfYLKY5gbhT6PGyTNYR8Hks9W/5mqtrO"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.8_1617509038658_0.6969832531551392"},"_hasShrinkwrap":false},"1.6.2-alpha.9":{"version":"1.6.2-alpha.9","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.9+3a62d13","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"3a62d13fa30c84ed88539a17b9b1facd789b82b4","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.9","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-dSSZuMhUh+ir0lmuORxREtqSF8QfR/XuGDjayGVyiBrkYdFHHaPftz1g1Oq8lfS+nlo+k4P50ayAjDAFDc90VQ==","shasum":"6268ebec0b8780d3caa634b6764d6aed5089780d","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.9.tgz","fileCount":52,"unpackedSize":268099,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTr2CRA9TVsSAnZWagAA4ckP/RJKk2xpuI7C0b98tzx+\nT8NcPe6Lftw0CBefGExYnxeuGmOM8695a/hF0urSlV2766Pwesn1Ccq9yZUq\nJC/8wg+EAzqk2alZ6yrMP80rkG1A9qIxYgQuv8vWeP9fgF2KJGTH1mCM+1AB\nOSWYI/2oE+G+lvN3U5GuuxIo9Uc9Ut3pjjdWvwH+uyc0KujiU6Pw7n6zQLnM\nrooJcijHU0sBmXbPSSAX3ppe9rqIbJkwYQcAdYoW6rYNg+N3qYVdu9csRLMG\n77QDTcfu2/0jbtnndmN8p1rTCNKCrVeKgDLPSJHH9md0jk19kTBYYXAn8IIr\nIqKqpjqObTqQ5PtwZCGnhaDYIl5g8A+fAdeY+7TLCjuge+azbQ091TYDtaim\nr8QLsG1a3DYwzkZl7TBznladh9FDflMqj2a7y5g18pWbIUqoY0C/nO4KjAP9\nfR4HGJSBsvKzVOZtQb8nvTU7791UzTu4M5DANP3zlSz48e8YSYzf17SWUlQS\n7DUkZz3hmv5J9wDGfkYZYC+BDUpHu7R/1Rf9XzcrT6OeaZ5IyrWzkYx7v9aM\nC2ugYqVGEiPgih8y+unzITlPVVYnR93bb/YIJ45AWGSCwiPXKTjxKYvNDSd9\nPIutLBVqH5SiqDGDpPwo/iPBd5NJ1USp2W5h6s7XqATKeVPOMF9IEzr3Y48m\nM0bj\r\n=beQs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEKHZpX3xSv9MtsdnEiYXj2wfoIcb5CMzn1e0lhIvy4aAiBZWjvbvjCzeZspiyk9YZMEzS6VCalk9+HJFgjQQQYZWw=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.9_1617509110517_0.495695351257049"},"_hasShrinkwrap":false},"1.6.2-alpha.10":{"version":"1.6.2-alpha.10","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.1","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"80a855a406cbf4007a470388e7e028e31026e27a","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.10","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-rYtX7xCfyZF6DVB0Pyb6uFhSYxfyNex+m54G2GXblCf+/eF37jWjM2PjT1tZ76A8LVF8j0O2p5f+m3ta3UWuJA==","shasum":"29888588f8ce62462e30fa3d12a2a079dd014553","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.10.tgz","fileCount":52,"unpackedSize":269642,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaTyvCRA9TVsSAnZWagAAbR4P+wXFbiv3R/XAe1u3QnUQ\nKdTsW/sP1gjEJfAt57GMdeRG5UyHRWuFbhHpTIrN9M2Lfh6McLJDVykNUqWt\nPhGZefWFCEj6GZ8OoGbVkl+jfXTKgB+WSpqjrsZeaGG34T4sW0Ne9ognAsYb\nIwLV3rlLkmJfEAT2ym7NSDPNgIKTzAP0oAxQI27HH9SIyUb3MT8gmueE8Bpb\n6gDSUFujDZIVhtTuecZLoJI2dgXEleybPFJFDDJMD8VO4Z5U6Bf9D//CtVGL\neRfF0LjdhvVxrON8RNVpBmDaEmo56cf+vEzCQo/A9BDw304Xdv72J4u81GQY\nzIBsPaTQSt7w7SyrrcSIMkBFvYYqEtAvC1Say8EBD5H1VUyTxw13HLM9XST4\nYZZJOSDNWorgFEEXPsiVUfqtO8+3LZiH9ts3OaHkyveWG0Z8wVQH2jleJ5sx\nAw1e2Xk3dfR9DdBCzxBF2pv199Lp/7IN/liGwAHngbGiVlYLhvxRH+38niqa\nGK8UePxS8Fh/OvzPcuWH0uhKlH/4dtY5O+o51DLIDuCLb9i5RzzyCO6O5ons\nz8YAa5S445nmL4z/w0wRdtIKyzVt5SAjdROepWuKVbDFQxVLhvSDXDSSr1oY\nowWCCtIUnPZa/GdoC8F/IV5FvKr4fpRZZInOhLGyXb3+tcZjCMB5S+5FMCy0\nMcC3\r\n=Tmuk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCYrLQJbVTpMfzvD6umDqQC6RabmruCYRqs2LTlJ79qlwIhAJkFFD+cx79jewa6ufGy7BYpJeije8Kz92JnpIpeOipB"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.10_1617509551334_0.13073168204439556"},"_hasShrinkwrap":false},"1.6.2-alpha.12":{"version":"1.6.2-alpha.12","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.2-alpha.12+4681b45","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3"},"gitHead":"4681b45a310d32090edd342f1887be3fe3a0ec4c","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = createGraphNode({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeResource`: treats the graph node as a valid React resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeMutate`: silently mutates a graph node's state. **USE WITH CAUTION**: this hook is only recommended to be used by independent nodes.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = createGraphNode({\n  get: 0,\n});\n\nconst reducerNode = createGraphNode({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeMutate(countNode, 100);\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.12","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-+VPVcdyP96VLh9ChVWVY653gIqoYIZ/4At5jyt/bK2PIuy9kNjQBV0vPRRN0frBM9UnW4Z2LmP5YyIW1SKLWEA==","shasum":"cb5c1aa76e8da98c9763ba5e5e54d1a0051e4f9b","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.12.tgz","fileCount":52,"unpackedSize":268101,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgaWAbCRA9TVsSAnZWagAA+rsQAJz8mVDJbDTxSG0XDjNc\nECPKIXgdD1svYQhKMjBoRwQaSn6q3TonOoNKwGP33zkr8yIv8pvcGcBXsTSb\n7UiIHdIhGuVdJDXXRjXURhluWphcFyZPEUavwU7rLOW5rBzVitVBsQDgihLz\n+M+Q1Bh+rP0mRrWOYkm0COQASIbPyQe6RGarh2lxDPoLIj938EcCRN3D6OsQ\nzKxFTUQVSrjbtmfIOWaNdzbm1oXiJMtpPQFU0aYFqEUKrOcT+JbnPoYiDlEA\n+K20rZ1dBHIaWOhdiuEhwGJh2yVpZ1u0DhFj9QkP3w10bpP6Lzv/6uljqKBW\nWV0KAvpgUnK0G4VTHYzFSK3NhmAdCEnY4OJBkbcPb/2Exs+54xHgDetFMuQf\nvp5L9vQAHt5jzgh92oLxVN0CpbqOF9FTXDZmJ5cHglCwN0I3/265QsBOldrr\nap4J0MCwxV91L6ACH3C6tycZm3JmPNxfT4X8k4e4HOdwd+YyEUELHdx6hIdW\ncUMbnd8ne4matC0VvxPLVAmizSNBvjImORvITd/NOpa65JrVePgzq42R1hi3\nsxjDgrgizxpCemrkJ4nIUV3FZHHnBJ2hHgMtuNsPBrrnoWCt2Jlgws4vgIBg\n0T933aztHzFvJBdPQ8QCxImnNFuq2IludOMhU6YoON7BYi7Z0mrd/phlW3Pm\n9nZl\r\n=zfhz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICIGGLaz5MGHajKmjpqwfSNHy30AGk22DgYvQF8EHpHPAiA9KST1SGXFQaRlMn/Hv2WfoOrkPErEWWEh3P9GktHV5Q=="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.12_1617518619061_0.9928144188857964"},"_hasShrinkwrap":false},"1.6.2-alpha.43":{"version":"1.6.2-alpha.43","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"1.6.1","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3","react-scoped-model":"^2.0.2","react-store-adapter":"^0.3.1"},"gitHead":"8d82eb5032328e5828047c2210af27c35fa0867f","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = node({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeResource`: treats the graph node as a valid Preact resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeMutate`: provides a callback that allows graph node's state mutation.\n- `useGraphNodeSelector`: similar to `useGraphNodeValue`, but allows transformation of received value and conditional re-rendering.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = node({\n  get: 0,\n});\n\nconst reducerNode = node({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\nThis is a hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nconst setState = useGraphNodeMutate(node);\n\n// Rewrite!\nsetState(newState);\n\n// Derived\nsetState((prevState) => diff(prevState, newState));\n```\n\n##### `useGraphNodeHydrate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeHydrate(countNode, 100);\n```\n\n##### `useGraphNodeSelector`\n\nSimilar to `useGraphNodeValue` but allows transformation of received value and conditional re-rendering.\n\n```tsx\nconst name = useGraphNodeSelector(userNode, {\n  getSnapshot: (value) => {\n    return value.name;\n  },\n  shouldUpdate: (prev, next) => {\n    return prev !== next;\n  },\n});\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","_id":"react-graph-state@1.6.2-alpha.43","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-qm42/JhOdfhlxcgQoy7vCRkBuyZ8DCHxfrR7sa4MeeNPNU/HvzAXSNlRBIEAxDPQ74/yjgcZ1RKGu7Q5JcUJlg==","shasum":"6705adf7f5942786ec134b37bc433c7bfe38b8ea","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-1.6.2-alpha.43.tgz","fileCount":46,"unpackedSize":247369,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgevHoCRA9TVsSAnZWagAAZYEP/RzwnL0Y95tWXdEn7wG4\nvwCNCTY2Gj3s7JZe/RzQBwjjLwmo3WPaQwOoorYT7fd2fkTpk/jpE25tOUzJ\nJvXSXrzBTgeVjO2apCY8Hn93LaVzsdAjrdCN9539wJEc8LSLHkROwV9StAb/\nKiA/5NU4PCYEyqNztxRDuVC938EvgbtK7Z4+H3OjJ97qiDAzmiHyF1uUN+U/\nssj9dMOIPhrRQnfOFfpGVR+wS0jpSZP96tf1r1PWCOQ9DJoiiw0W+EMQI86r\nr1dhJuNspq/Spg7c1eWBWaI+YMdHd2hdLsOC8tMX35DkbrLOvrQvGqGWq1Nm\n6kt/GzXG7/H4eVsoBC8qix1ymIy7IovvUg5U/Lqgy+6PFuD+4NM8i2s7RC7G\nZju/uHPXFZmLWX8BkMTbOSoSVAZsTfP4C4buWYqdIJwLrJulebSCUDMJpcvk\nCczJlddBi3V/Gt7btNZUo6kCLoawoRzDAaFvoyZ9aBaDSCK0TkeUwwYsJ/nF\nYVWRHrMhO6v9Lei32dMhyXfiX6DRwm1q251YldK1PgYQAqMHKaJhtFLOQdta\nz5VJvyEy1q0ZXpxCzMekSiCrO90Ob4J1938Po8NXrM59AH9NUGpMdvQOHQuc\n6vTcBszB7x3I+0zf9l0puxXdV/CA3ZfxUD6soG3HiZ1CasHkls0fSLOlTgLv\n419b\r\n=NDkH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCVI7Em2GodIeadu1TD3RLzY6yPkI/H7vBjb4Fz12wd4AIgdClrct7yOUsf6lLUzfjMpeQtcfcEMuIkH4x2+P8EZ8k="}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_1.6.2-alpha.43_1618670055453_0.5220835171964748"},"_hasShrinkwrap":false},"2.0.0":{"version":"2.0.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.11.9","@testing-library/react":"^11.2.5","@testing-library/react-hooks":"^5.1.0","@types/jest":"^26.0.20","@types/node":"^14.14.34","@types/react":"^17.0.3","eslint":"^7.22.0","eslint-config-lxsmnsyc":"^0.1.20","graph-state":"2.0.0","pridepack":"^0.8.0","react":"^17.0.1","react-dom":"^17.0.1","react-test-renderer":"^17.0.1","ts-jest":"^26.5.3","tslib":"^2.1.0","typescript":"^4.2.3"},"peerDependencies":{"graph-state":"^1.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3","react-scoped-model":"^2.0.2","react-store-adapter":"^0.3.1"},"gitHead":"0518b879f40799a56c59dec1739b3560b7650ccb","_id":"react-graph-state@2.0.0","_nodeVersion":"15.4.0","_npmVersion":"lerna/3.22.1/node@v15.4.0+x64 (win32)","_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"dist":{"integrity":"sha512-FguPFMk7Fx3yogKT/Xzqt15VMEiLWfVp2F15eyamx2Jy3J9wLL8NuSJjs8/OhuB3/m4P5cAmXdhT0s5YWpk2NA==","shasum":"c2ba45e1cc370ed99d38a700c5351f175fd00c70","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.0.0.tgz","fileCount":46,"unpackedSize":247352,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgevKxCRA9TVsSAnZWagAATZwQAJhnOSMJkwVifTHjcLj0\nyaeisW5L9oYaCpq1r+uJ7xyhXx5HHJ20QaAYcwXpv4Tvqror0nFI56UePOdE\nJHe7C251QJQFgIew4xT0/D8hqeqMn+syQLZrJnE7+D32hIkje84XA4MCm3GC\neMuGNa+vv2+2qA2RWhwvxlNdGD69Tb/nrJBwvomYooFm/JmM8ALZIm487K+R\nFRLNH3WlvtHfR2AFBElQroirYqVfuCr2rzZ1K66EWyGb1Hw37A8vz66QV0g0\nm0NP1TqhJuV+5UnBFILUUwrhOBATI0kKlG1TuKx7XLdeYnyPQbPOa8afrIUO\nyZYOK77oCnnaRWuuWmkqiBYVQJcnQVtSlORGwG2oObVRcWbrvrprhUOxhODC\n5PetayDpVYGZoVqNPAIQ//JrGnc4BZqMjHYGKpGYcl/KTsw7bSGVbH1GSBIU\nBgokp+tZZ6/y41v6J1RGGohfW2ODo+o2Ajpf4Zjv2SEWV/Fu87Dx/PusmAUD\nkNeuEsvGxLMp2Cm/GI6t09kI2SBdbO1u3117wgLedUTJdcb9+Tjk5bm1Oh76\nQLOpyZxVGUGlqmIHOlPm/wMjOvJ5GHaia7t25rDrJ8kXt/oNsqmDXPYpjHuW\n7cO/LAsi3Z9A/jkOywY37Nd/7VxIE1iBMoMMi6CC9a3HEAViave+kAGOkf6g\n7f8Y\r\n=8qtZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCEalRUaKfNObCNSu0Xpxb0/2ais7tc7PQV3MgzBvdbwgIhANYiSfBIOhn8p3vysQvEMsndOquvoZLWOrHRjKou1eOQ"}]},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.0.0_1618670256693_0.9478552622129761"},"_hasShrinkwrap":false},"2.1.0":{"version":"2.1.0","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.12.0","@testing-library/react":"^11.2.6","@testing-library/react-hooks":"^5.1.2","@types/jest":"^26.0.22","@types/node":"^14.14.41","@types/react":"^17.0.3","eslint":"^7.24.0","eslint-config-lxsmnsyc":"^0.2.1","graph-state":"2.1.0","pridepack":"^0.9.2","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^26.5.5","tslib":"^2.2.0","typescript":"^4.2.4"},"peerDependencies":{"graph-state":"^2.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3","react-scoped-model":"^2.0.2","react-store-adapter":"^0.4.1"},"gitHead":"dcb1fd0346452f797b66fea07a77179bfff22e2d","_id":"react-graph-state@2.1.0","_nodeVersion":"15.4.0","_npmVersion":"lerna/4.0.0/node@v15.4.0+x64 (win32)","dist":{"integrity":"sha512-50eZBul4xcdKSWF1PUawFBLYsdxpQUTyeBAIvqHgm71gl0erVE8RlXWkd/3IJlbbkaGGUm3HmNEQvayEHyidug==","shasum":"db4acc1cff7a1262019e71ce7f94ae187691fdd0","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.1.0.tgz","fileCount":46,"unpackedSize":247351,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJggqUhCRA9TVsSAnZWagAAUr4QAKLKCBidyaJXtEB9JF9Q\nOz0YBW3kZg4zeLuUrw3+j6urAsTUfzmoTVG8wxKYj6EOq23yK9eUtnfsjlKh\nrjJwFTeztvWS4z7EsZ7AaTNoDUM1r82ThhL5cYzynlrmxzqO12/zAfFyd/2G\nRpKtuxRnGs/hLwCl5DbKfUuuMD4uWvCW+two+I5e16oFofxcGiTgvqAleem5\n7E4kwHDOgcBBwS3+V/VIoiHxHEDtT92hf7D7pZeaJV8zI6Qqg28UoOQwzO3j\nLbnzkKfKsJlLU3KgRX98kmSkWB2JIA3hs3u0k8x9clod93aiYGqhyytP0IOI\ngP8CmJHXrfnjpGrKpAuNlxKFl+I0RY2O/MtHkre17g/jtW++HnwmvWU2eW07\nqMJMM4Gu5PrvxWo3S28pPwaD6MLepwp6++0EbO+aBnSGL6TbDollJJapR+D+\npIt4OulZls+FNM3NruKb118eS9w98Mk8UOeiulRqE1M2p+wBRmz9ULOZwbG0\nmhJmMgkDQee2mDCubDaqmfU6TsDoZGBQdYnDmsO2h5migRgdv2tj5vyVbrbo\naeSHRb21h8NPELvMgZU5ss+xC/PytBJLGnu6Oaqrkfwxw/Oh/hI04JDmchxb\nU588LX56lI5ImXKNdz0bzbeR6kHvE3ONxH+BUeW9CvdHX6IeI/6f22SHu294\nWymF\r\n=F9Zk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHxsqqG0nqHO2sGMXweGJNEkHf6cU548YQA3ov8FVaNOAiEAsEBWBPErf8wz7Q3jjACFXIt3Yr5ZZqKHd5EU7h033jI="}]},"_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.1.0_1619174689323_0.5259872789728168"},"_hasShrinkwrap":false},"2.1.1":{"version":"2.1.1","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.12.0","@testing-library/react":"^11.2.6","@testing-library/react-hooks":"^5.1.2","@types/jest":"^26.0.22","@types/node":"^14.14.41","@types/react":"^17.0.3","eslint":"^7.24.0","eslint-config-lxsmnsyc":"^0.2.1","graph-state":"2.1.1","pridepack":"^0.9.2","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^26.5.5","tslib":"^2.2.0","typescript":"^4.2.4"},"peerDependencies":{"graph-state":"^2.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.3.3","react-scoped-model":"^2.0.2","react-store-adapter":"^0.4.1"},"gitHead":"59c6ca84e60309b287b590f06d46f523badb44ed","_id":"react-graph-state@2.1.1","_nodeVersion":"15.4.0","_npmVersion":"lerna/4.0.0/node@v15.4.0+x64 (win32)","dist":{"integrity":"sha512-P9KvmKnNqNQ9sA4w1L5aBgFerlffAd4fh/WljbZiRaazGrhmiK0aWvEzpYJ1iMiKXN60OP1mvaKd/tcKs/kvuA==","shasum":"f7379b9aa540d864305b6a307d3f8cbd12d11904","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.1.1.tgz","fileCount":46,"unpackedSize":247351,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJghsSACRA9TVsSAnZWagAAJasP/i5ZbgtsZ0RuRD/CplmB\nZZn4VcwVzLHaQXwHDPYgXVM6Rr8dibnxK/FZ8Dt+Q+9orE5mZmrKezKzpsCs\nolM1RwhXNIJhwKV+L+iOs/FU7AEk3EeOrO0lzFkFLq2a2Ic+WqI1+pHkrFAe\nGhEVxiVQxb+jt1lN1ZDerhBt9aRBNhdTzY0Tdm72xlDD++rpM+4MF/09gvDj\nFcNFfv2CmeUThAZTmdUYWueYJEwUJOdWW0E3sCVlNxQWFxp607+eQERHFd7/\nxPu+iB2J9MGw9rQziuEna5MiQJlUJpkG6Hw5PpsfsD94Rmp5AW/7DeXxmHlz\nFybApRysTItdqfbo5LCopJdq5Zyo6ia5rsVaH4+BwJOWKeZLtxtRPK3Z+Tnf\nnUwv3J/VmEM+cbqMmJc3/dozQr2NAg/K8k9lvLt9I3Yj0zadzHHefUoeXyCl\n1JjO4cvJJtef0UgqtHgROhCShJ4gReicmNOasSM5nFtPx9neUFLAKKO896+f\nTQzdYmnxy2ZnvT6I+lZyOpHz8m5IE90dN733VmBDPwNYkMCbrMqTjyz5WOeO\nLzpHRdnRQ6SYtqgz0Ic9RkOtx3nvedVKnORz6deqKCQNirOo2ChnoVFjr/HZ\nyrrMe0Tv8ObHktx6yapBrAqk2C5i4mh5BPKCwljuv+k1pfAF/jW2rTNq4rV/\ngzPh\r\n=Rh47\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBr0F0ghvY6/X/6JJEVmBmqTLnXwXNleZTX9K4QaWlv0AiEA9S+ivnC6xmPUFVnEnbIfxyQ9+qo2jhQdK9n+VfTSZGw="}]},"_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.1.1_1619444863618_0.6089049405763929"},"_hasShrinkwrap":false},"2.1.2":{"version":"2.1.2","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.12.0","@testing-library/react":"^11.2.6","@testing-library/react-hooks":"^5.1.2","@types/jest":"^26.0.23","@types/node":"^15.0.2","@types/react":"^17.0.5","eslint":"^7.25.0","eslint-config-lxsmnsyc":"^0.2.1","graph-state":"2.1.2","pridepack":"^0.9.3","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^26.5.6","tslib":"^2.2.0","typescript":"^4.2.4"},"peerDependencies":{"graph-state":"^2.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.5.0","react-scoped-model":"^2.0.4","react-store-adapter":"^0.4.3"},"gitHead":"0b6fa93a86e839b7cfd39b18218e5dcedbf416c7","_id":"react-graph-state@2.1.2","_nodeVersion":"15.4.0","_npmVersion":"lerna/4.0.0/node@v15.4.0+x64 (win32)","dist":{"integrity":"sha512-eoQPc3tvIvWzrGndo5rizoeMUPsOjEzfDCU+xvI/mjF33v9ysgGN5U349UNS9Y932zLnwMRLN8qugCT9OTcLcg==","shasum":"408487a0c638aebb4ca632cfb5d13977fead68b5","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.1.2.tgz","fileCount":46,"unpackedSize":247556,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgk/WoCRA9TVsSAnZWagAAuCcP/i2F457j5kL1nkpbiHM7\nMYHuZWmQoVE/BniP/MVwGNCwjqEww1SwJ/QNVpGalxEW3x4KDcHfIE42jGMO\n2NR8JzQGgIpzxpl7e66N0ypUVLUTQEnOPMddOMRBT7s7hs7TUC9jx/krADy1\nIBHuegI4OyVJ5zMWeI85KryBwBXL37qxyKcgErBwBHZfV+6MYYJoy3knGKRN\nLnJuzQwGYywdHCmWInCag/yKjDGGCobLd6+OcqwbXGDyiUQy9ciHAW3qBEQU\njb2LIfAhzsEDS0OAOiwU1NwGE6FlNW5fesOssQBt+xOcJHyYL38Kq9cTBA1d\nFPd+xAFF3dTbpQgj0KdRKrijP1iqGc04Mw67vgr7mwRERAjCCvC0aGPuZ880\nj0tjQGM0tGZWb7IiMV5PeFubcFZ0J+jyaeYzXcoZ6cGLx8OyhQOfea7uWBsz\nrgG5SQVReEU2EfPU/BZ9oRYvlepZhwiIGdIlXc83z6f3Mtdp+PHZSuSLoo4Z\nIQ115swOUL0bs3YmN8gECUpu3J5yV/46aBiEFUCgQFOgyCm2rYQdCKL/AcIq\nxXKNFmwMhpj6idTNxV3WaPlBOP9X6W9J4E/7rFxAkn0MGi9S8WNfKYdPxsk+\nLMQH0ZJjAhpwWIY1ByNeIc90PgR253hbTTHfu0a5SdTGeEPRpn/2RFaHpuCV\nzt0m\r\n=+zhh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCmgHjYQ7jRjYjMcVjPFo0zzvkzKeTcVlxFK2IKvY7sQQIgXHW6ti8xc4C/vsyJ/h6RoZvwtr/66MFDPnEkQ+dt1DU="}]},"_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.1.2_1620309415823_0.7035799911933531"},"_hasShrinkwrap":false},"2.1.3":{"version":"2.1.3","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.14.1","@testing-library/react":"^11.2.7","@types/jest":"^26.0.23","@types/node":"^15.12.2","@types/react":"^17.0.11","eslint":"^7.28.0","eslint-config-lxsmnsyc":"^0.2.1","graph-state":"2.1.3","pridepack":"^0.9.3","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","tslib":"^2.3.0","typescript":"^4.3.2"},"peerDependencies":{"graph-state":"^2.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.5.0","react-scoped-model":"^2.0.4","react-store-adapter":"^0.4.3"},"gitHead":"cb68222c7f85e73b02af165350f0c5b6f887470e","_id":"react-graph-state@2.1.3","_nodeVersion":"15.4.0","_npmVersion":"lerna/4.0.0/node@v15.4.0+x64 (win32)","dist":{"integrity":"sha512-2vx4emFj7KmP3klZoE+HQK8a4opCOAAS8KgDoqOeaAeKOQXrCrGLf2XXqj9Gu5jx6XYemuCt2cO2PCvAQEzIMw==","shasum":"a66ab33a4ef19809b0ffc991a91fcb47143930fe","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.1.3.tgz","fileCount":46,"unpackedSize":247486,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgxxHOCRA9TVsSAnZWagAAs7YP/iNfBU4wgCfgj8D8b84J\nvR3Bf6TlxkWFpPKejOU99IoYhyV6cceEx4MqOFiroGrOln6Et4hlQiHeAT8w\n1kqI4jtVKXEy8n8JVFB0k37ElYhhRRrOqq9OaAaQ5unIUvZnyC9/HGMG9Tmz\nn8rgPL5iWNdZENMrECjRUuTF0Ts3I9Eo5fyxNK8bT5rfK+AsBjc1jb+XmUBp\ncqlJvOk1GSOvL2c0rIr7AypyGZnBFdZekcEIBFAkZDN/xm+3UuqKgEGVT6F1\n4f5/gxUHAm9vqaSnRPmmfk2PHM2qIhMt/EIg+B2jy9RNRCY4nJBzOSTLt0fR\nhjx7NMfSbmAx9TVhFxeuZU99LMbDAFmuhZPNMYTxzzsQX9xmwDZm3N/2y6IG\nx1K+NP2qi20BTDX0vgGJmbaXi/VUYGP5dWF0lHU+XDZSUyWdPIr/cIkdb3wS\npaaRegES3z3xTNpi0qlSb+KSlvuX6czHPGysdigsgFlDn5ipVhaOcdxQo6Po\nMTq8MOm1HqnsrXn7ISFhOr/7NPsftR4dEEZ1AiXaOF/APtB+zh7CV8v9iWhr\nvSHDODOIdl2ovJmoDJJVOalZcbRdRAeQfMiLSQBsajMd2vnHuWxxDCJtvQLj\nMjrR0DT/d0AB9O1cFGKjP+eMEjnmfjv1l2ZL+E8WOPYHNDPqoiNQ6GZcnBdm\nA+Df\r\n=VWqL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEyrBJOO3OAmvCqu93wZ6MyIWPTxSEkQjZVCkJ2+TWfAAiEArvb3RK8jMorLc8Jqnld4NtUxRiusZB0SuD6QsbLX270="}]},"_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.1.3_1623658957970_0.14053579210574196"},"_hasShrinkwrap":false},"2.1.4":{"version":"2.1.4","description":"React bindings for `graph-state`","author":{"name":"Alexis Munsayac"},"main":"dist/cjs/index.js","module":"dist/esm/index.js","exports":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"types":"dist/types/index.d.ts","engines":{"node":">=10"},"scripts":{"prepublish":"pridepack clean && pridepack build","build":"pridepack build","type-check":"pridepack check","lint":"pridepack lint","test":"pridepack test --passWithNoTests","clean":"pridepack clean","watch":"pridepack watch"},"license":"MIT","name":"react-graph-state","devDependencies":{"@testing-library/jest-dom":"^5.14.1","@testing-library/react":"^11.2.7","@types/jest":"^26.0.23","@types/node":"^15.12.2","@types/react":"^17.0.11","eslint":"^7.28.0","eslint-config-lxsmnsyc":"^0.2.1","graph-state":"2.1.4","pridepack":"^0.10.0","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","tslib":"^2.3.0","typescript":"^4.3.2"},"peerDependencies":{"graph-state":"^2.0.0","react":"^16.8.0 || ^17.0.0"},"publishConfig":{"access":"public"},"repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"homepage":"https://github.com/lxsmnsyc/graph-state","bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"],"dependencies":{"@lyonph/react-hooks":"^0.5.1","react-scoped-model":"^2.0.5","react-store-adapter":"^0.4.4"},"gitHead":"9007b80a1c47f90fcd88b7c55a0a62c6a27eaceb","_id":"react-graph-state@2.1.4","_nodeVersion":"15.4.0","_npmVersion":"lerna/4.0.0/node@v15.4.0+x64 (win32)","dist":{"integrity":"sha512-GT6zD8IMwG1/Qvd1w/GlNBhGJ7uRElbIVZH4QUnjOmhXHyjYf2m4twklNOtfZ2N+reyF7vL8piQdxjsrju9XlA==","shasum":"f35bcc47fd93c68e31b4a40d51697d2304690237","tarball":"https://registry.npmjs.org/react-graph-state/-/react-graph-state-2.1.4.tgz","fileCount":46,"unpackedSize":203093,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgyG+qCRA9TVsSAnZWagAA+AUP/AveH2eXnsHljEHJ73Lu\nTL/BPxZvKPO6Cc43ThJVF3RhRCp/3142QR62+yGVXadE8Q01WewgJm1H39CK\n2QG2iXL8cc/9O7v9nKtk0Te9UUYMGSSZ59Pc1GHLfNr10ya2SXodzHdVF+ED\nzSye4Lrx62sk1pyCI5VEeutavVTiihH0HRI6vZVH50i8lPP9jVY3P6cUOefc\nY/yJEt0LGFwLX4lic1Ip96cQ/yvxYEgwiwYhFwoquHOyRTYTGUOW6mMuXn9r\nlpirvNM3Xq804W04kVmJjBWlW6SNfysWfbbrRYUqWPavn6Rx1OstBNb1LInz\n3F0e48xm3JI/lzuJ+aKB9IxNq/BHd2J5Zmb/r0Xe9w2Ib/Xr9avHCmOgEvOo\nnSRNPCO3uBgrnEuKiVBUpfidMzPZiO3KqHXKt2Xgr64OHdO/6CzUUfQDxo2T\n+77j1BfYrbkiorQGfA3KiccTZlYqtcRT15tSCDJnNJxiJqvmQuOak1j99Use\n1cS8X5+whhQQHmn2UwAg6oZb4ZAw3dmumQAAGHwe8Xywly0Hiil7P/WoYCun\nniG2HeH5Ef+5v8sbuQlsc3FtPHa6GCrpT3qGkZye6dw462uvrcyahEb/iSfL\n47/8PVmVq8Iu1hynj4C8w9xIolD9NBGwaSHIugm1RbukEUYemF8DG45TfJo/\nYMbJ\r\n=WO7N\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGF87Ge7FEn5UIF0u4xpcjxVnsLP8FPhzZVBadbwCwI0AiB6LpgXp3hmP3xjX4amQn91t/N8flXAw0+b/NrVfHcniQ=="}]},"_npmUser":{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"},"directories":{},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-graph-state_2.1.4_1623748522055_0.5295741535580096"},"_hasShrinkwrap":false}},"time":{"created":"2020-10-09T13:46:57.960Z","0.4.0":"2020-10-09T13:46:58.164Z","modified":"2022-05-14T11:46:07.703Z","0.4.1":"2020-10-10T14:30:39.697Z","0.4.2":"2020-10-11T03:25:44.802Z","0.4.3":"2020-10-12T13:30:05.888Z","0.4.4":"2020-10-12T14:32:47.459Z","0.4.5":"2020-10-13T03:15:13.110Z","0.5.0":"2020-10-13T10:09:35.687Z","0.5.1":"2020-10-13T10:27:59.736Z","0.5.2":"2020-10-15T11:57:26.739Z","0.5.3":"2020-10-16T01:54:55.462Z","0.6.0":"2020-10-16T13:42:36.432Z","0.6.1":"2020-10-18T03:48:27.386Z","0.6.2":"2020-10-23T11:27:01.741Z","0.6.3":"2020-10-24T12:29:04.328Z","0.6.4":"2020-10-26T08:54:53.311Z","0.6.5":"2020-10-26T13:09:49.316Z","0.6.6":"2020-10-26T13:31:53.049Z","0.6.7":"2020-10-26T14:17:22.603Z","0.6.8":"2020-10-26T14:59:34.816Z","0.6.9":"2020-10-26T15:47:32.426Z","0.6.10":"2020-11-02T16:34:37.540Z","0.7.0":"2020-11-03T10:51:40.386Z","0.8.0":"2020-11-08T16:52:03.557Z","0.8.1":"2020-11-12T08:29:59.671Z","0.8.2":"2020-11-12T08:53:57.773Z","0.8.3":"2020-11-12T12:10:32.720Z","1.0.0":"2020-11-13T13:17:08.940Z","1.1.0":"2020-11-14T16:51:13.820Z","1.1.1":"2020-11-15T03:18:25.104Z","1.2.0":"2020-11-27T16:21:02.731Z","1.3.0":"2020-12-09T05:41:52.007Z","1.3.1":"2020-12-09T06:25:43.049Z","1.3.2":"2020-12-09T08:40:02.229Z","1.3.3":"2020-12-10T06:12:36.167Z","1.3.4":"2020-12-10T06:27:34.764Z","1.3.5-alpha.0":"2020-12-10T15:52:31.745Z","1.3.5-alpha.1":"2020-12-11T05:50:04.976Z","1.3.5-alpha.2":"2020-12-11T05:51:13.481Z","1.3.5-alpha.3":"2020-12-11T06:04:35.531Z","1.3.5-alpha.5":"2020-12-11T09:04:21.527Z","1.3.5-alpha.8":"2020-12-12T04:10:28.514Z","1.3.5-alpha.10":"2020-12-12T04:43:19.022Z","1.3.5-alpha.11":"2020-12-12T12:45:32.649Z","1.3.5-alpha.12":"2020-12-12T13:21:42.510Z","1.3.5-alpha.13":"2020-12-12T16:39:12.954Z","1.3.5-alpha.14":"2020-12-12T16:52:44.866Z","1.3.5-alpha.15":"2020-12-12T16:56:42.879Z","1.3.5-alpha.18":"2020-12-12T17:13:28.527Z","1.3.5-alpha.20":"2020-12-13T13:38:48.111Z","1.3.5-alpha.21":"2020-12-13T13:39:31.940Z","1.3.5-alpha.22":"2020-12-13T13:43:40.577Z","1.3.5-alpha.23":"2020-12-13T14:01:03.778Z","1.3.5-alpha.26":"2020-12-13T14:12:31.141Z","1.3.5-alpha.27":"2020-12-13T14:20:39.765Z","1.3.5-alpha.35":"2020-12-13T16:45:34.149Z","1.3.5-alpha.36":"2020-12-13T16:55:46.888Z","1.3.5-alpha.37":"2020-12-13T17:10:26.495Z","1.3.5-alpha.41":"2020-12-13T17:55:40.289Z","1.3.5-alpha.42":"2020-12-13T18:09:20.617Z","1.3.5-alpha.43":"2020-12-14T10:46:12.457Z","1.3.5-alpha.44":"2020-12-14T10:56:09.040Z","1.3.5-alpha.45":"2020-12-14T10:57:34.920Z","1.3.5-alpha.46":"2020-12-14T11:03:03.882Z","1.3.5-alpha.47":"2020-12-14T11:05:58.534Z","1.3.5-alpha.48":"2020-12-14T11:13:51.144Z","1.3.5-alpha.49":"2020-12-14T11:22:00.573Z","1.3.5-alpha.50":"2020-12-14T11:24:13.737Z","1.3.5-alpha.51":"2020-12-14T11:31:47.241Z","1.3.5-alpha.52":"2020-12-14T11:38:33.377Z","1.3.5-alpha.54":"2020-12-14T11:43:14.870Z","1.3.5-alpha.55":"2020-12-14T11:57:07.132Z","1.3.5-alpha.56":"2020-12-14T11:58:58.063Z","1.3.5-alpha.60":"2020-12-14T13:32:47.366Z","1.3.5-alpha.61":"2020-12-14T13:36:02.554Z","1.3.5-alpha.62":"2020-12-14T13:40:08.308Z","1.3.5-alpha.63":"2020-12-14T13:42:26.523Z","1.4.1":"2020-12-14T16:34:14.011Z","1.4.2-alpha.7":"2020-12-20T12:03:10.404Z","1.5.0":"2021-03-20T11:39:35.520Z","1.5.1":"2021-03-23T07:33:48.052Z","1.5.2":"2021-03-23T07:58:58.740Z","1.5.3-alpha.0":"2021-03-23T08:16:01.694Z","1.5.3-alpha.1":"2021-03-23T08:28:59.764Z","1.5.3-alpha.2":"2021-03-23T08:35:33.273Z","1.5.3-alpha.3":"2021-03-23T08:43:43.909Z","1.5.3-alpha.4":"2021-03-23T09:04:24.913Z","1.5.3":"2021-03-23T09:09:29.024Z","1.6.0":"2021-04-03T15:20:45.206Z","1.6.1":"2021-04-03T15:35:59.238Z","1.6.2-alpha.5":"2021-04-04T03:42:39.586Z","1.6.2-alpha.6":"2021-04-04T03:46:59.339Z","1.6.2-alpha.7":"2021-04-04T03:51:14.399Z","1.6.2-alpha.8":"2021-04-04T04:03:58.792Z","1.6.2-alpha.9":"2021-04-04T04:05:10.689Z","1.6.2-alpha.10":"2021-04-04T04:12:31.517Z","1.6.2-alpha.12":"2021-04-04T06:43:39.478Z","1.6.2-alpha.43":"2021-04-17T14:34:15.636Z","2.0.0":"2021-04-17T14:37:36.838Z","2.1.0":"2021-04-23T10:44:49.473Z","2.1.1":"2021-04-26T13:47:43.954Z","2.1.2":"2021-05-06T13:56:55.979Z","2.1.3":"2021-06-14T08:22:38.183Z","2.1.4":"2021-06-15T09:15:22.221Z"},"maintainers":[{"name":"lxsmnsyc","email":"alexis.munsayac@gmail.com"}],"description":"React bindings for `graph-state`","homepage":"https://github.com/lxsmnsyc/graph-state","repository":{"url":"git+https://github.com/lxsmnsyc/graph-state.git","type":"git"},"bugs":{"url":"https://github.com/lxsmnsyc/graph-state/issues"},"license":"MIT","readme":"# react-graph-state\n\n> React bindings for `graph-state`\n\n[![NPM](https://img.shields.io/npm/v/react-graph-state.svg)](https://www.npmjs.com/package/react-graph-state) [![JavaScript Style Guide](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)[![Open in CodeSandbox](https://img.shields.io/badge/Open%20in-CodeSandbox-blue?style=flat-square&logo=codesandbox)](https://codesandbox.io/s/github/LXSMNSYC/graph-state/tree/main/examples/react-graph-state)\n\n## Install\n\n```bash\nyarn add graph-state react-graph-state\n```\n\n```bash\nnpm install graph-state react-graph-state\n```\n\n## Usage\n\n### Accessing a graph node\n\nGraph nodes, by themselves, are meaningless. They needed a domain to begin computing. `<GraphDomain>` is a component that defines such domain where all graph nodes live.\n\n```tsx\nimport { GraphDomain } from 'react-graph-state`;\n\nconst messageNode = node({\n  get: 'Hello World',\n});\n\nfunction App() {\n  return (\n    <GraphDomain>\n      {/* children */}\n    </GraphDomain>\n  );\n}\n```\n\nThere are also 8 hooks:\n\n- `useGraphNodeValue`: reads a graph node's value. Subscribes to the graph node's state updates.\n- `useGraphNodeDispatch`: provides a callback that allows graph node's state mutation or runs `set` field.\n- `useGraphNodeReset`: provides a callback for resetting (recomputing) a graph node's value.\n- `useGraphNodeState`: a combination of `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset` in a form of a tuple.\n- `useGraphNodeHydrate`: hydrates a node instance with a given initial state, then resets the node after commit. Useful for prefetched data.\n- `useGraphNodeResource`: treats the graph node as a valid Preact resource, suspending the component if the graph node's resource is pending.\n- `useGraphNodeSnapshot`: attaches a listener to the node for state updates.\n- `useGraphNodeMutate`: provides a callback that allows graph node's state mutation.\n- `useGraphNodeSelector`: similar to `useGraphNodeValue`, but allows transformation of received value and conditional re-rendering.\n\nIf one of these hooks are used to access a graph node, that graph node is registered within `<GraphDomain>` and creates a lifecycle.\n\n#### Hooks\n\n##### `useGraphNodeValue`\n\nThis is a React hook that reads the graph node's current state and subscribes to further state updates.\n\n```tsx\nfunction Message() {\n  const message = useGraphNodeValue(messageNode);\n\n  return <h1>{ message }</h1>;\n}\n```\n\n##### `useGraphNodeDispatch`\n\nThis is a React hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nfunction MessageInput() {\n  const setMessage = useGraphNodeDispatch(messageNode);\n\n  const onChange = useCallback((e) => {\n    setFahrenheit(Number.parseFloat(e.currentTarget.value));\n  }, []);\n\n  return (\n    <input\n      type=\"text\"\n      onChange={onChange}\n    />\n  );\n}\n```\n\nIf a graph node has a defined `set` function, `useGraphNodeDispatch` will not overwrite the graph node's state and thus, can accept any kind of value for dispatch. `set` will receive this value, allowing for custom graph node logic:\n\n```tsx\nconst countNode = node({\n  get: 0,\n});\n\nconst reducerNode = node({\n  get: ({ get }) => get(countNode),\n  set: ({ set }, action) => {\n    switch (action) {\n      case 'INCREMENT':\n        set(countNode, get(countNode) + 1);\n        break;\n      case 'DECREMENT':\n        set(countNode, get(countNode) - 1);\n        break;\n    }\n  },\n});\n\n// ...\nconst dispatch = useGraphNodeDispatch(reducerNode);\n\n// ...\ndispatch('INCREMENT');\n```\n\n##### `useGraphNodeReset`\n\nThis is a hook that provides a callback for resetting a graph node.\n\n```tsx\nconst reset = useGraphNodeReset(countNode);\n\n// ...\nreset(); // resets countNode back to 0\n```\n\n##### `useGraphNodeState`\n\nThis is a hook that returns a tuple based on `useGraphNodeValue`, `useGraphNodeDispatch` and `useGraphNodeReset`.\n\n```tsx\nconst [count, setCount, reset] = useGraphNodeState(countNode);\n```\n\n##### `useGraphNodeSnapshot`\n\nThis is a hook that attaches a listener to a graph node and subscribes for state updates.\n\n```tsx\nuseGraphNodeSnapshot(node, (state) => {\n  console.log('Received', state);\n});\n```\n\n##### `useGraphNodeMutate`\n\nThis is a hook that returns a callback similar to `setState` that allows state mutation for the given graph node.\n\n```tsx\nconst setState = useGraphNodeMutate(node);\n\n// Rewrite!\nsetState(newState);\n\n// Derived\nsetState((prevState) => diff(prevState, newState));\n```\n\n##### `useGraphNodeHydrate`\n\n**USE WITH CAUTION**\nSynchronously and silently mutates a graph node's state. This is only recommended for independent nodes as a form of lazy state hydration.\n\n```tsx\nuseGraphNodeHydrate(countNode, 100);\n```\n\n##### `useGraphNodeSelector`\n\nSimilar to `useGraphNodeValue` but allows transformation of received value and conditional re-rendering.\n\n```tsx\nconst name = useGraphNodeSelector(userNode, {\n  getSnapshot: (value) => {\n    return value.name;\n  },\n  shouldUpdate: (prev, next) => {\n    return prev !== next;\n  },\n});\n```\n\n##### `useGraphNodeResource`\n\nThis is a hook that receives a valid graph node resource and suspends the component until the resource is successful. This may resuspend the component if the resource updates itself.\n\n### Graph Node Resources\n\nAccessing graph node resources using `useGraphNodeValue` returns an object which represents the Promise result.\n\n```tsx\nfunction UserProfile() {\n  const result = useGraphNodeValue(userResourceNode);\n\n  if (result.status === 'pending') {\n    return <h1>Loading...</h1>;\n  }\n  if (result.status === 'failure') {\n    return <h1>Something went wrong.</h1>;\n  }\n  return <UserProfileInternal data={result.data} />;\n}\n```\n\nThere's also another hook called `useGraphNodeResource` which allows us to suspend the component until the resource is successful.\n\n```tsx\nfunction UserProfileInternal() {\n  const data = useGraphNodeResource(userResourceNode);\n\n  return (\n    <UserProfileContainer>\n      <UserProfileName>{ data.name }</UserProfileName>\n      <UserProfileDescription>{ data.description }</UserProfileDescription>\n    </UserProfile>\n  );\n}\n\nfunction UserProfile() {\n  return (\n    <ErrorBoundary fallback={<h1>Something went wrong.</h1>}>\n      <Suspense fallback={<h1>Loading...</h1>}>\n        <UserProfileInternal />\n      </Suspense>\n    </ErrorBoundary>\n  );\n}\n```\n\n## License\n\nMIT © [lxsmnsyc](https://github.com/lxsmnsyc)\n","readmeFilename":"README.md","author":{"name":"Alexis Munsayac"},"keywords":["graph-state","graph","state","digraph","state management","reactive","recoil","atomic","react"]}