{"_id":"@data-spring/sparkline","_rev":"2-98879855db4fa9a208c98e8ef16c2ca7","name":"@data-spring/sparkline","dist-tags":{"latest":"0.9.11"},"versions":{"0.9.10":{"name":"@data-spring/sparkline","version":"0.9.10","main":"build/index.js","scripts":{"build":"webpack --production","test":"jest"},"description":"Components and utility functions for using react-spring animations in data-ui/xy-chart data series visualizations https://ledgerinvesting.github.io/data-spring/","repository":{"type":"git","url":"git+https://github.com/LedgerInvesting/data-spring.git"},"keywords":["d3","react","chart","visualization","plot","motion","animated","animation","spring","data-ui","react-spring"],"author":{"name":"Matt Liu","email":"matt@ledgerinvesting.com"},"license":"MIT","devDependencies":{"@babel/core":"^7.0.1","@babel/preset-env":"^7.0.0","@babel/preset-react":"^7.0.0","@babel/runtime":"^7.3.1","@data-ui/sparkline":"^0.0.77","babel-eslint":"^8.2.2","babel-loader":"^8.0.2","eslint":"^4.19.1","eslint-config-airbnb":"^16.1.0","eslint-plugin-import":"^2.7.0","eslint-plugin-react":"^7.7.0","jest":"^24.1.0","react":"^16.0.0","react-dom":"^16.0.0","react-spring":"^7.2.8","react-test-renderer":"^16.8.1","webpack":"^4.20.2","webpack-cli":"^3.1.1","webpack-dev-server":"^3.1.8"},"jest":{"testURL":"http://localhost/"},"bugs":{"url":"https://github.com/LedgerInvesting/data-spring/issues"},"homepage":"https://github.com/LedgerInvesting/data-spring#readme","_id":"@data-spring/sparkline@0.9.10","_nodeVersion":"11.1.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-fgEnDPolVkj8Q+r2l5zJ+BOmZ7tMokSyhi+k/p4IQ1cuB1X0ELrKIKpGFSeGHO7v6rMCa/4g2gMMIb3FTLer8A==","shasum":"b6fa86bd92e6d6d9ee360ed1dfd0dc3c8881e719","tarball":"https://registry.npmjs.org/@data-spring/sparkline/-/sparkline-0.9.10.tgz","fileCount":14,"unpackedSize":484009,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcv4E2CRA9TVsSAnZWagAAARkQAJJ4Wl+Yim7MhLrYs8Al\nK9Nq8dvFL2qMu4a1wcME3rEt5EmeiGxYB9RslpKkngWax9pON9/PDQa5+VAR\nygwt5hI7duWzvHTmoogWFs+0O1XMnG4Ij/rf0/Lj9O+jGncxjQ81k9XSDkEW\nQq6PrNc6vBSdBcC1x5t8I3TNw+64gOAKIerj2R/7bN2D5w4p+3g3fuyQ5nCV\nqM1nn4KKanLOQZjMt3I0ca9lIoIdpASyMEdCfTUovUgyPqMDF8/VKHB1IHQH\n71fJF8tFwfyFyYuVLlnbJSht0BLJ/BjdULUIHab8U0i/MuhZpLFl0zppgX0w\nH9B6dku1vBFiYqBVBrKtoTDt3lHkFMMUxPjhB7PUx0+ENAu2uHH6vrxfrAd6\nvacc4U/TUApuALpGN4n9FIhSJ1K32sny+JoSodpRTaJrBI0lLoJ74NmaiJ8S\nhUlZyza5eK4C3cnp7+8sUc51BXD99ufvQC+FROlFX6oeP/7tdQCVeYCXgNSc\nfJBn44/lyD9F5+5F0+URDhO8j7+VMdpyyVpKm6Nxn/xz4JpIWhI2EOqeyScS\noDrm5EFaR2qilR44FiiSf36M9VT5G42diPwdpqT1tetWkaUveTEtaJT1qVy3\nU/q3ddimj5S+ON9Tq1jNqH02Gel4B1Pm4qTKn/ABl0XFA3RnIJr6O4ONw734\nZcJe\r\n=dke+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBnkw/1/PqnavuH+4l7d5gZLda3wgL4zc3a4dIBdSoulAiAm5S/5uG/Y6dGCW4orkQKkJQmtZFK+oCJbRFRKKJc4mQ=="}]},"maintainers":[{"name":"mlcrazy","email":"liumatt@gmail.com"}],"_npmUser":{"name":"mlcrazy","email":"liumatt@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/sparkline_0.9.10_1556054325592_0.7700523167754485"},"_hasShrinkwrap":false},"0.9.11":{"name":"@data-spring/sparkline","version":"0.9.11","main":"build/index.js","scripts":{"build":"webpack --production","test":"jest"},"description":"Components and utility functions for using react-spring animations in data-ui/sparkline data series visualizations https://mlcrazy.github.io/data-spring/","repository":{"type":"git","url":"git+https://github.com/mlcrazy/data-spring.git"},"keywords":["d3","react","chart","visualization","plot","motion","animated","animation","spring","data-ui","react-spring"],"author":{"name":"Matt Liu","email":"matt@ledgerinvesting.com"},"license":"MIT","devDependencies":{"@babel/core":"^7.0.1","@babel/preset-env":"^7.0.0","@babel/preset-react":"^7.0.0","@babel/runtime":"^7.3.1","@data-ui/sparkline":"^0.0.77","babel-eslint":"^8.2.2","babel-loader":"^8.0.2","eslint":"^4.19.1","eslint-config-airbnb":"^16.1.0","eslint-plugin-import":"^2.7.0","eslint-plugin-react":"^7.7.0","jest":"^24.1.0","react":"^16.0.0","react-dom":"^16.0.0","react-spring":"^7.2.8","react-test-renderer":"^16.8.1","webpack":"^4.20.2","webpack-cli":"^3.1.1","webpack-dev-server":"^3.1.8"},"jest":{"testURL":"http://localhost/"},"bugs":{"url":"https://github.com/mlcrazy/data-spring/issues"},"homepage":"https://github.com/mlcrazy/data-spring#readme","_id":"@data-spring/sparkline@0.9.11","_nodeVersion":"11.1.0","_npmVersion":"6.7.0","dist":{"integrity":"sha512-Yt9o1UXoT7uIYlIR4i3dIMUkeLqWSgDkFprWulTNQCsOO/PnPtRMMOnj5WFb6ptT5D6F1FL7TVwWyfLOxcYX5w==","shasum":"c860936cab16af0d45f4bf930d88b9ae110f3677","tarball":"https://registry.npmjs.org/@data-spring/sparkline/-/sparkline-0.9.11.tgz","fileCount":14,"unpackedSize":483986,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcv4N5CRA9TVsSAnZWagAA1hYQAI32GI7/JGfK4hbNDHjM\nuFJx8f+DXQKZJfiY0dUIZ8r9sdsDXJZywASaL4rCR4u8Yf/vvohonzl1hf+5\nvaEeIt1zhJQsH04SjQssZ0O43edrsE3xukkRoL5eEDZvBFq3rxytPVHHgdFk\nLVVCoYq+e0dJVkJclYv+M7q2PTilEF5GRhns/ujKNEBPhs8DekidAt7uLD6G\nScTSSq2+AUT1jh8RWd4OT78mbFcL5V/fy9REn6RpRMnpnE3IZpZ2QGt4lZK4\n9ddC8yuzIap+3ZJORGM/n4geB49zjX0LDA6JjP6F68hmo5FRj2D7W4fY/9Mw\nrG/rsp0CriyGOSYmjjA02Otnv86s76eI690PSDcFCsU0so84yRS3D1/qzqg+\nVM6XCtPnN3unV3xvKUmXezNHrdhQke2xk8mu3Dqz4neDlDqjwt+GHZvgluDq\nJRe/moDIlF50akQ2HiNzWH4svnMMflg2TY6y8ufwobuVsTWxphNJwfSGpI4X\n1ZwH0Ez1cRtChPMl2WeaaybNzvsD3FGXnrMgevCWz67mNDzITXIBzTpKeziI\nxUQOVQmYfRvU7naaqtjsNGhT98mDYa4eq+flRNZAFHco7hRvAuj4i/EIug/A\naBniacgSzibJJ5Ya3IybojkSk/rfRsYVLHvR/bjg58H+Deq81E2E42sJQYZc\nhTLY\r\n=NWXW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICbPXR7u7cZ+WRetHe7lNck17HB4yGhKA6X6z6ZJGgezAiASunX5ayE2fGjITqVa6U+rzNxt9TrRP4J9iNeDho/5AA=="}]},"maintainers":[{"name":"mlcrazy","email":"liumatt@gmail.com"}],"_npmUser":{"name":"mlcrazy","email":"liumatt@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/sparkline_0.9.11_1556054904818_0.996243003002546"},"_hasShrinkwrap":false}},"time":{"created":"2019-04-23T21:18:45.414Z","0.9.10":"2019-04-23T21:18:45.788Z","modified":"2022-04-05T02:50:43.873Z","0.9.11":"2019-04-23T21:28:25.011Z"},"maintainers":[{"name":"mlcrazy","email":"liumatt@gmail.com"}],"description":"Components and utility functions for using react-spring animations in data-ui/sparkline data series visualizations https://mlcrazy.github.io/data-spring/","homepage":"https://github.com/mlcrazy/data-spring#readme","keywords":["d3","react","chart","visualization","plot","motion","animated","animation","spring","data-ui","react-spring"],"repository":{"type":"git","url":"git+https://github.com/mlcrazy/data-spring.git"},"author":{"name":"Matt Liu","email":"matt@ledgerinvesting.com"},"bugs":{"url":"https://github.com/mlcrazy/data-spring/issues"},"license":"MIT","readme":"# data-spring/sparkline\nComponents and utility functions for using react-spring animations in data-ui/sparkline data series visualizations. [See some examples here!](https://mlcrazy.github.io/data-spring/)\n\n## Combining data-ui/sparkline With react-spring Wrappers\nA data-spring/sparkline series component works by wrapping a data-ui series component in react-spring containers. Use spring series components within the SparklineSpring the same way you would use a data-ui Sparkline component but with additional props for configuring react-spring and calculating the default data-spring animation start values.\n\n### Installation\n```\n$yarn add @data-spring/sparkline\n```\n\n### For Example\n```javascript\nimport React from 'react';\nimport { LineSeries } from '@data-ui/sparkline';\nimport { config } from 'react-spring';\nimport { SparklineSpring } from '@data-spring/sparkline';\n\nconst lineSeriesData = [\n  { x: 0 , y: 7 },\n  { x: 4 , y: 4 },\n  { x: 8 , y: 9 },\n  { x: 14 , y: 3 },\n  { x: 20 , y: 2 },\n];\n\nconst chartBounds = {\n  xMin: 0,\n  yMin: 0,\n  xMax: 20,\n  yMax: 10,\n};\n\nconst DemonstrativeAnimatedSparkline = (props) => (\n  <SparklineSpring\n    width={500}\n    height={250}\n    ariaLabel=\"Demonstrative animated line\"\n    min={chartBounds.yMin}\n    max={chartBounds.yMax}\n    data={lineSeriesData}\n    animationStart=\"bottom\"\n    bounds={chartBounds}\n    springConfig={config.gentle}\n  >\n    <LineSeries\n      curve=\"cardinal\"\n      strokeWidth={2}\n      stroke=\"blue\"\n    />\n  </SparklineSpring>\n);\n\n```\n\n### Coming Soon...\nUtilities for easier unmount animations\n","readmeFilename":"README.md"}