{"_id":"@actualwave/use-signalr","_rev":"3-cf258a7292b33ca4d4c365fe21e49bc0","name":"@actualwave/use-signalr","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@actualwave/use-signalr","version":"1.0.0","description":"React hooks for @microsoft/signalr library inspired by @apollo/client","main":"bundle.js","type":"module","scripts":{"build":"npx rollup --config rollup.config.js","test":"jest --coverage","test:watch":"jest --watch"},"repository":{"type":"git","url":"git+https://github.com/burdiuz/react-signalr-hooks.git"},"keywords":["react","hook","realtime","azure","websocket","client","microsoft","signalr","api","communication"],"author":{"name":"Oleg Galaburda"},"license":"ISC","bugs":{"url":"https://github.com/burdiuz/react-signalr-hooks/issues"},"homepage":"https://github.com/burdiuz/react-signalr-hooks#readme","peerDependencies":{"@microsoft/signalr":"^5.0.13","prop-types":"^15.7.2","react":"^16.8.0"},"devDependencies":{"@babel/plugin-syntax-jsx":"^7.16.7","@babel/plugin-transform-runtime":"^7.16.7","@babel/preset-env":"^7.16.7","@babel/preset-react":"^7.16.7","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-node-resolve":"^13.1.3","@testing-library/react":"^12.1.2","@types/jest":"^27.4.0","babel-jest":"^27.4.6","jest":"^27.4.5","rollup":"^2.63.0"},"gitHead":"6dd6262d6bb4c3cfa1598bb4c6ad56e95cbc0b8a","_id":"@actualwave/use-signalr@1.0.0","_nodeVersion":"16.4.0","_npmVersion":"7.18.1","dist":{"integrity":"sha512-D4dbg7omCkwKa5li6uBnxxWhPiOOr/rBDf16IMu5IC8spptKxgUdxcVDtxkbm1ariUWF/qmX9ZQtJVclG9uDiw==","shasum":"e767e7f8b97dace2f4263ffcb449f8f835c212b9","tarball":"https://registry.npmjs.org/@actualwave/use-signalr/-/use-signalr-1.0.0.tgz","fileCount":7,"unpackedSize":37283,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh2aAzCRA9TVsSAnZWagAA138P/3NZOzBpj5jR4cmt5MtR\nierOgGbA+vc8WbOuj8KyLXwPjvTmenhBVM/SHsovsVZnPItFCUXGMNqtpsIQ\npAfTA7rXRVlQ22Jb9qK1o9UaS7zONiTyNJ20+Q2mTpAIpYToN2hO9eCaOeNb\nxtcEhrbH4E8yZ+Q0QmzlkhQOnKzL+CodAb9twTbkMCNs993wYiG7Iho0Ocag\nFLh7+gRQly0plINFXxWFyAVm2K0cLr9qqYW0lTeJxKHVRb0b43Em9NIuAtUq\nYbkGp2IvwtsXwir9ZVULUCYTXx5T/OblPQ2v/j5z3rR6A4TCH2glVk6Ly5ot\nKzjoLZih8tPtsovyosP4fFgpGW3LmmgUfY1IcVvCzGsSfwN8YLb36N1NCMCT\nbwG3GnrVsRmXKPkspl/VLqoIdmEGA96e+X32pue6DvUGs9FlAEtf58PGoePg\nMGwUcIVN7q3tvcm9uKmWVVlpr/p/7m9dQ5uGOkIjM+DVX+oAFtdPNc0BJs5K\nXah4ZXNPrjPJMJrmrR3/zzPXsQ6udGFxAENERhVouIUxo3cFZSjer5nLOaJf\nYzH0PARh04KSi7YUkfb7obpBct81/8/kmalvBz5aFZ3ljpNpSY30FMnsrjKY\nxd2P8ZdTZzBKSxJX6zBKeWFYUsWGTtcO48idQp8Adxjo9Bomm18w6ehv1o3T\nY4k4\r\n=NbJf\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGxMdYV1rTa4FQTGKs1KT1tngf5QhrjPajGVjfTtExTLAiEApru10LRoG3QIWBzyjtotByX7D3fUF91I7GW3sqpuwR8="}]},"_npmUser":{"name":"actualwave","email":"burdiuz@gmail.com"},"directories":{},"maintainers":[{"name":"actualwave","email":"burdiuz@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-signalr_1.0.0_1641652274977_0.30696154810619425"},"_hasShrinkwrap":false,"deprecated":"new"},"1.0.1":{"name":"@actualwave/use-signalr","version":"1.0.1","description":"React hooks for @microsoft/signalr library inspired by @apollo/client","main":"bundle.js","type":"module","scripts":{"build":"npx rollup --config rollup.config.js","test":"jest --coverage","test:watch":"jest --watch"},"repository":{"type":"git","url":"git+https://github.com/burdiuz/react-signalr-hooks.git"},"keywords":["react","hook","realtime","azure","websocket","client","microsoft","signalr","api","communication"],"author":{"name":"Oleg Galaburda"},"license":"ISC","bugs":{"url":"https://github.com/burdiuz/react-signalr-hooks/issues"},"homepage":"https://github.com/burdiuz/react-signalr-hooks#readme","peerDependencies":{"@microsoft/signalr":"^5.0.13","prop-types":"^15.7.2","react":"^16.8.0"},"devDependencies":{"@babel/plugin-transform-runtime":"^7.16.7","@babel/preset-env":"^7.16.7","@babel/preset-react":"^7.16.7","@rollup/plugin-babel":"^5.3.0","@rollup/plugin-node-resolve":"^13.1.3","@testing-library/react":"^12.1.2","@types/jest":"^27.4.0","babel-jest":"^27.4.6","jest":"^27.4.5","rollup":"^2.63.0"},"gitHead":"0281ff0a115e246c12084a950a58576a26c9d669","_id":"@actualwave/use-signalr@1.0.1","_nodeVersion":"16.4.0","_npmVersion":"7.18.1","dist":{"integrity":"sha512-GbS5YWdcBwI1MWJqtqJnNNdfp7Xj0J3vEJ2bpBnMCLPKHH3RZ0obmVZ5jk1xAfD50WyTymwoXg75iVGYgu049Q==","shasum":"7ee61e91cabb58df1a4a86d2827eb5d11265fdf6","tarball":"https://registry.npmjs.org/@actualwave/use-signalr/-/use-signalr-1.0.1.tgz","fileCount":4,"unpackedSize":34555,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh3dT3CRA9TVsSAnZWagAA0BgP/j6IVdJ8UqS6EnDALknL\nk0HY16jShDUYapj+uSTjgO8QRGSjOnEcQnr+UGSG46Yf+cvEI6tlnkG14KbP\nKeg83FiYOGpDNjI2oZSBd0zn10XA4DGkdNydrqr36EwHxkspjhPVw8ckw7Fi\nf/7OqoQk4nL0kMaLRj8ugteqtSlrNaWWGkTjio7uT76UFBI7RAeUGkx27L85\nbiVwStSCRF+3GShIeMLpUqZaGXT36/c7rYDuB4qXeiXBcEWnx6y5e85YJm0D\nK3qn9yityBUFIb3+Mk85vyCuDZnA2w3heS9JVdJ16lAjJPaUYh5CezJC+bd+\ni/s63HNpaTIF0ZH+R+VVdC+zKNgNYxmP8BVSYZqzAKU/fIx86XvxpluZCOyE\ne4S5Vc3IKruYCOVEeTKfDusQynl0XeN96Lb9Zh39nbObPmd1Ot0hOfw8J6xc\nloEh+kkq+4dH1I6/pI21XDpYsOgL042QZJKxFNx6/coKeTa2ulaUd3vCjHqs\nYTvub07GlQqHJpH997n6dNaYoK7B/QPNu0BagU+WWi7CattbGNRyoYrPtHkB\naH6OdPg703nCp4e/T756w8pHXGT0lgtxV7ozmHBvts5oSFxI6u64JF2+Um1/\n5sv4nZh+vAzSSlKaGm8ep4cECDoc1LekD+kIt3Ac1K8Dv/xE/HRKyXQQpON5\nTfRr\r\n=mPeM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHwDHgOQICVHP7kaKNzuDK3HZeHOvYTHvMRbeFrHzhfjAiEAxw3ENZcjCVQze4JtgBpDe77aAG0vKRZqnOMudeW+Ips="}]},"_npmUser":{"name":"actualwave","email":"burdiuz@gmail.com"},"directories":{},"maintainers":[{"name":"actualwave","email":"burdiuz@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-signalr_1.0.1_1641927927579_0.7147952638139488"},"_hasShrinkwrap":false}},"time":{"created":"2022-01-08T14:31:14.901Z","1.0.0":"2022-01-08T14:31:15.154Z","modified":"2022-04-04T11:20:16.807Z","1.0.1":"2022-01-11T19:05:27.725Z"},"maintainers":[{"name":"actualwave","email":"burdiuz@gmail.com"}],"description":"React hooks for @microsoft/signalr library inspired by @apollo/client","homepage":"https://github.com/burdiuz/react-signalr-hooks#readme","keywords":["react","hook","realtime","azure","websocket","client","microsoft","signalr","api","communication"],"repository":{"type":"git","url":"git+https://github.com/burdiuz/react-signalr-hooks.git"},"author":{"name":"Oleg Galaburda"},"bugs":{"url":"https://github.com/burdiuz/react-signalr-hooks/issues"},"license":"ISC","readme":"# @actualwave/use-signalr\n\nReact hooks for @microsoft/signalr library inspired by @apollo/client.\n\n## Installation\n\n```\nnpm add @actualwave/use-signalr\n```\n\nor\n\n```\nyarn add @actualwave/use-signalr\n```\n\n## API\n\n- SignalRProvider - Provider component, should be the root node for every component using hooks from this package.\n\n```javascript\n<SignalRProvider\n  onConnected={onConnected}\n  onConnected={onError}\n  connectionUrl=\"https://my.sonarr.domain\"\n>\n  <App />\n</SignalRProvider>\n```\n\n- useSignalRSend - Call `HubConnection.send()` every time hook arguments change.\n\n```javascript\nconst MyComponent = () => {\n  const [data, setData] = useState(null);\n  const { loading, error } = useSignalRSend(\"mySignalRProcedure\", [\n    \"argument 1\",\n    123,\n  ]);\n\n  useSignalRSubscribe(\"mySignalREvent\", setData);\n\n  if (loading) {\n    return <span>Loading...</span>;\n  }\n\n  if (error) {\n    return <span className=\"danger\">Unexpected error</span>;\n  }\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useSignalRInvoke - Call `HubConnection.invoke()` every time hook arguments change.\n\n```javascript\nconst MyComponent = () => {\n  const { loading, data, error } = useSignalRSend(\"mySignalRProcedure\", [\n    \"argument 1\",\n    123,\n  ]);\n\n  if (loading) {\n    return <span>Loading...</span>;\n  }\n\n  if (error) {\n    return <span className=\"danger\">Unexpected error</span>;\n  }\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useLazySignalRSend - Returns send function with current hook state. Use function to call `HubConnection.send()`.\n\n```javascript\nconst MyComponent = () => {\n  const [data, setData] = useState(null);\n  const [mySignalRProcedure, { loading, error }] =\n    useLazySignalRSend(\"mySignalRProcedure\");\n\n  useSignalRSubscribe(\"mySignalREvent\", setData);\n\n  useEffect(() => {\n    mySignalRProcedure(\"argument 1\", 123);\n  }, []);\n\n  if (loading) {\n    return <span>Loading...</span>;\n  }\n\n  if (error) {\n    return <span className=\"danger\">Unexpected error</span>;\n  }\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useLazySignalRInvoke - Returns invoke function with current hook state. Use function to call `HubConnection.invoke()`.\n\n```javascript\nconst MyComponent = () => {\n  const [mySignalRProcedure, { loading, data, error }] =\n    useLazySignalRInvoke(\"mySignalRProcedure\");\n\n  useEffect(() => {\n    mySignalRProcedure(\"argument 1\", 123);\n  }, []);\n\n  if (loading) {\n    return <span>Loading...</span>;\n  }\n\n  if (error) {\n    return <span className=\"danger\">Unexpected error</span>;\n  }\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useSignalRSubscribe - Subscribes callback function to a HubConnection event. Returns unsubscribe function.\n\n```javascript\nconst MyComponent = () => {\n  const [data, setData] = useState(null);\n\n  const unsubscribeFn = useSignalRSubscribe(\"mySignalREvent\", setData);\n\n  // unsubscribe when MyComponent is unmounted\n  useEffect(() => unsubscribeFn(), []);\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useSignalRConnection - Returns HubConnection instance.\n\n```javascript\nconst MyComponent = ({ procedure, argument }) => {\n  const connection = useSignalRConnection();\n\n  // unsubscribe when MyComponent is unmounted\n  useEffect(() => {\n    connection.send(procedure, argument);\n  }, [procedure, argument]);\n\n  return <div>{renderData(data)}</div>;\n};\n```\n\n- useIsSignalRConnected - Returns boolean, true if HubConnection successfuly connected.\n\n```javascript\nconst MyComponent = () => {\n  const connected = useIsSignalRConnected();\n\n  if (!connected) {\n    return <span>Sorry, not connected...</span>;\n  }\n\n  return <MyRealtimeUI />;\n};\n```\n\n#### Additionaly\n\n- SignalRConsumer - Consumer accepts a render function as child and provides an tuple with connection and connected boolean value.\n\n```javascript\n<SignalRConsumer>\n  {([connection, connected]) => {\n    if (!connection || !connected) {\n      return null;\n    }\n\n    return <MyRealtimeUI connection={connection} />;\n  }}\n</SignalRConsumer>\n```\n\n- useCloseBeforeUnload - Use to call `HubConnection.stop()` when `beforeunload` event fired.\n\n```javascript\n// use hook somewhere in provider tree\nconst MyComponent = () => {\n  useCloseBeforeUnload();\n\n  return <MyRealtimeUI />;\n};\n\n<SignalRProvider>\n  <App>\n    <MyComponent />\n  </App>\n</SignalRProvider>;\n```\n\n- useSignalRConnectionState - Returns `HubConnection.state`. This property is being murated and hook `useSignalRConnectionState()` does not trigger rerender of the component.\n\n```javascript\nconst MyComponent = () => {\n  // ATTENTION: Will not cause rerender when state changes!\n  const state = useSignalRConnectionState();\n\n  if (state !== HubConnectionState.Connected) {\n    return <span>Sorry, not connected...</span>;\n  }\n\n  return <MyRealtimeUI />;\n};\n```\n","readmeFilename":"README.md"}