{"_id":"@plot-and-scatter/react-animated-number","_rev":"1-d3154dee16cc8f631550ae1b5b597a52","name":"@plot-and-scatter/react-animated-number","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@plot-and-scatter/react-animated-number","author":{"name":"Amey Sakhadeo, Frank Hangler"},"version":"1.0.0","description":"React component for animating numbers","main":"build/index.js","engines":{"node":">=4.0.0"},"scripts":{},"keywords":["react","animations"],"repository":{"type":"git","url":"git+https://github.com/plot-and-scatter/react-animated-number.git"},"license":"MIT","bugs":{"url":"https://github.com/plot-and-scatter/react-animated-number/issues"},"devDependencies":{"ava":"^0.24.0","babel":"6.23.0","babel-core":"6.26.0","babel-eslint":"8.1.2","babel-plugin-constant-folding":"^1.0.1","babel-plugin-dead-code-elimination":"^1.0.2","babel-plugin-react-transform":"^3.0.0","babel-plugin-uglify":"^1.0.2","babel-preset-es2015":"^6.9.0","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","babel-preset-stage-1":"^6.5.0","babel-preset-stage-2":"^6.5.0","babel-register":"6.26.0","babel-runtime":"6.26.0","babelify":"^8.0.0","bluebird":"^3.4.1","browserify":"^14.5.0","del":"^3.0.0","enzyme":"^3.3.0","eslint":"~4.14.0","eslint-plugin-babel":"^4.1.2","eslint-plugin-react":"^7.5.1","gulp":"^3.9.1","gulp-babel":"^7.0.0","gulp-cache":"^1.0.2","gulp-connect":"^5.0.0","gulp-eslint":"^4.0.0","gulp-if":"^2.0.1","gulp-load-plugins":"^1.2.4","gulp-nodemon":"^2.1.0","gulp-plumber":"^1.1.0","gulp-size":"^3.0.0","gulp-util":"^3.0.7","react":"^16.2.0","react-addons-test-utils":"^15.1.0","react-dom":"^16.2.0","vinyl-source-stream":"^2.0.0"},"dependencies":{"prop-types":"^15.5.8","raf":"^3.2.0"},"peerDependencies":{"react":">=16.9"},"gitHead":"d69fcdc945d1a673e1cd6401fc9d29c7f96139cf","homepage":"https://github.com/plot-and-scatter/react-animated-number#readme","_id":"@plot-and-scatter/react-animated-number@1.0.0","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-04KPNMfayj8qEWBCujZbJzaZTTucIxLoiOzd4zL0tT0GzulDlwE30nrB15qD1rYd3kDwoGBFETGOFA9dJyAg0w==","shasum":"4fa24b3b1a28df88873da53b3bbbbccdd7b45a54","tarball":"https://registry.npmjs.org/@plot-and-scatter/react-animated-number/-/react-animated-number-1.0.0.tgz","fileCount":3,"unpackedSize":5529,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCINHxFuGPSPx/a/HMDd9XMmjOrLfYHLXyfzOADMpIBUwIgShNL1FALkqNMXZv6lIOwhPVdDsicei6Ay4ODoxlAOc0="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjRf7aACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrSbRAAmKZQfp9BPudfjlNxO7FE40XYK3zERB/4ZnsBa0vBlS8h6PF0\r\nF8tTqUsstRo3fzn2/ML95/HdufOIB7tjSM7UzfbKESzgSE9vgshQwRTp+CFd\r\nOyT3ZU2Puj3KFojbhZfyVq4qgNlesZA/pe7KtSk9SOGZ+4VrTCPZ6fOQ1trN\r\nI89TlwbGbebXUjhxThRF8bRcfg9EcGwMO8aA0obOOBqQwoo4wgdVWPOAVjTJ\r\njodqVWUt2IAAmgltw1Rv+6ElqGfkypa2f73sSGgBb4tdYDtNcXp5J5SSeglC\r\nD0Vf0fF/ikFBhUFRl/ska93lDzcQRoAVIIPSGDXiSJ8wrPEu9SoBhbzSgSU7\r\nXf5SFpYbAGkpetJ8ptVyuCbZa1cMrM8zkQQ4D8rFKKyW0JP0icAPBC764E9M\r\nCUwnjOoV6bvhkBU4kbDeomEfYIS1sCgk4XHY8ZbIjqeVHJotZHXn2CX2O+/s\r\n8DacDdvmH4i5I7085PATEeFOHvWh+uLyMXcNDvUOiJ0dpqg3dUFIwi0FNERz\r\nUHfCuOF9b07RhZURjEoldPXWmudhcOEbcM9GoHnmv+f/Cdn5JyyezL+tv+4m\r\nWVm1CZEaX3XxcWYGFN+zWehKk6HGu7pO2IjwNk9A9wk1NwGXD4DCxTtx+gJG\r\n4j4euJCQPOnIVkR06sLa7TlDv3ezaKCn0UE=\r\n=k5q7\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"hangler","email":"frank@plotandscatter.com"},"directories":{},"maintainers":[{"name":"hangler","email":"frank@plotandscatter.com"},{"name":"heather.armstrong","email":"heather@plotandscatter.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-animated-number_1.0.0_1665531609858_0.3255177213073912"},"_hasShrinkwrap":false},"1.1.0":{"name":"@plot-and-scatter/react-animated-number","author":{"name":"Amey Sakhadeo, Frank Hangler"},"version":"1.1.0","description":"React component for animating numbers","main":"build/index.js","engines":{"node":">=4.0.0"},"scripts":{},"keywords":["react","animations"],"repository":{"type":"git","url":"git+https://github.com/plot-and-scatter/react-animated-number.git"},"license":"MIT","bugs":{"url":"https://github.com/plot-and-scatter/react-animated-number/issues"},"devDependencies":{"ava":"^0.24.0","babel":"6.23.0","babel-core":"6.26.0","babel-eslint":"8.1.2","babel-plugin-constant-folding":"^1.0.1","babel-plugin-dead-code-elimination":"^1.0.2","babel-plugin-react-transform":"^3.0.0","babel-plugin-uglify":"^1.0.2","babel-preset-es2015":"^6.9.0","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","babel-preset-stage-1":"^6.5.0","babel-preset-stage-2":"^6.5.0","babel-register":"6.26.0","babel-runtime":"6.26.0","babelify":"^8.0.0","bluebird":"^3.4.1","browserify":"^14.5.0","del":"^3.0.0","enzyme":"^3.3.0","eslint":"~4.14.0","eslint-plugin-babel":"^4.1.2","eslint-plugin-react":"^7.5.1","gulp":"^4.0.2","gulp-babel":"^7.0.0","gulp-cache":"^1.0.2","gulp-connect":"^5.0.0","gulp-eslint":"^4.0.0","gulp-if":"^2.0.1","gulp-load-plugins":"^1.2.4","gulp-nodemon":"^2.1.0","gulp-plumber":"^1.1.0","gulp-size":"^3.0.0","gulp-util":"^3.0.7","react":">=16.9.0","react-dom":">=16.9.0","vinyl-source-stream":"^2.0.0"},"dependencies":{"prop-types":"^15.5.8","raf":"^3.2.0"},"peerDependencies":{"react":">=16.9"},"gitHead":"59c199acb7e938b8c253c757b9c8e6976c75e075","homepage":"https://github.com/plot-and-scatter/react-animated-number#readme","_id":"@plot-and-scatter/react-animated-number@1.1.0","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-NGfHA91WveB4KOtjMI1a7InMszldUvRmdVm345E6Jbao+yTSvBbai48dtANIT1GMcgffv3XpJ/dzlUUHQnPTKg==","shasum":"e98b812b89fb51a5905470bb54b2087540caa348","tarball":"https://registry.npmjs.org/@plot-and-scatter/react-animated-number/-/react-animated-number-1.1.0.tgz","fileCount":5,"unpackedSize":13857,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDMp252TiW+Q7m7IVgK88/PUggRASL2l0o8QsQKhsF+3gIhAJvjuvBt2E2QuKx3WclDKsDoh4lo6Q+vB1AB+z2tVEu6"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjRgSXACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqhvQ//TjA5lAQ6Gr9Nf6JHUldXh5vmjU7Vm7e6nQS0rgxFdP8ekLmS\r\nkgD8DRNDd9lg2/r4XRZqgLGOU51Js1CInpDUwJBzhGDpXJa9ClzwrZ2SODyf\r\n+jT9ySd6aWxvhcVOqln0vcVvP+5B8K9LB9jInZQzV6FRwL4DQwKIy1dp6kS+\r\njXtq5ZhQInGx3UnHzaPgaze4lQoR9+GpkPQUdo1k6EFzrSflXjt8OZ9h1M4q\r\nKmuMaqDnaNARvm5JHshYN9ZTu7/MzWEytAbKIDduCw9wYxVQDAtCeTGxy34F\r\nLeoFZh7IA3OuuMOFQhjLGaO1v7OVwPwrMbYpxrG0BlyUXDo58XxZElxX+zBd\r\nyB5HubGvwXsQSx0xo0vC54q1mH0WjjKBFm5AHM29umA5gI8x/GvM8GLI5aCk\r\nT5jIblbd1p7tLgYvpJqCaBbjS7603jU1fDsFSGjcQw3n/nk97ONUewXU/Y8I\r\n9syBNA88XODko+immz66gIDvbU9V1ntrbFSR+coUCau0klyeFMhD9fHWGj9R\r\neTcqUW0BeiF023Vpbq4Q4THjPqsnMZeWfd0g3luN0/rJ8rg0KyCOt6t7Z/OC\r\nk1ADWibVtbSNz94MdP4OMKW5VbA8lDFtrFE7M5v5sfEtbsmxDTztuWLyWmFb\r\nao8UjRULByO/v2tFr/LLJknUt/zD4rTzA4w=\r\n=HOfj\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"hangler","email":"frank@plotandscatter.com"},"directories":{},"maintainers":[{"name":"hangler","email":"frank@plotandscatter.com"},{"name":"heather.armstrong","email":"heather@plotandscatter.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-animated-number_1.1.0_1665533079586_0.8771454950823832"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-11T23:40:09.789Z","1.0.0":"2022-10-11T23:40:10.012Z","modified":"2022-10-12T00:04:39.960Z","1.1.0":"2022-10-12T00:04:39.811Z"},"maintainers":[{"name":"hangler","email":"frank@plotandscatter.com"},{"name":"heather.armstrong","email":"heather@plotandscatter.com"}],"description":"React component for animating numbers","homepage":"https://github.com/plot-and-scatter/react-animated-number#readme","keywords":["react","animations"],"repository":{"type":"git","url":"git+https://github.com/plot-and-scatter/react-animated-number.git"},"author":{"name":"Amey Sakhadeo, Frank Hangler"},"bugs":{"url":"https://github.com/plot-and-scatter/react-animated-number/issues"},"license":"MIT","readme":"# react-animated-number\n[![npm version](https://badge.fury.io/js/react-animated-number.svg)](http://badge.fury.io/js/react-animated-number)\n[![devDependency Status](https://david-dm.org/ameyms/react-animated-number/dev-status.svg)](https://david-dm.org/ameyms/react-animated-number#info=devDependencies)\n\nReact component for animating numbers\n\n## Install\nreact-animated-number is available via npm and can be used with [browserify](http://browserify.org/) or [webpack](https://webpack.github.io/).\n\n```\nnpm install --save react-animated-number\n```\n## Usage\n\n```js\nimport AnimatedNumber from 'react-animated-number';\n...\n...\n\nclass Demo extends Component {\n\n    ...\n\n    render () {\n        <AnimatedNumber component=\"text\" value={bigValue}\n            style={{\n                transition: '0.8s ease-out',\n                fontSize: 48,\n                transitionProperty:\n                    'background-color, color, opacity'\n            }}\n            frameStyle={perc => (\n                perc === 100 ? {} : {backgroundColor: '#ffeb3b'}\n            )}\n            duration={300}\n            formatValue={n => prettyBytes(n)}/>\n    }\n}\n```\n## API\n\n#### value: number\n**required**<br/>\nNumeric value to which to tween to\n\n----\n#### initialValue: number\n**default**: `0`<br/>\nInitial numeric value for the tween start\n\n----\n\n#### component: any\n**default**: `\"span\"`<br/>\nThis is similar to the react transition [API](https://facebook.github.io/react/docs/animation.html#rendering-a-different-component). By default, renders text inside a `<span>`. You can pass in any valid `ReactElement`. Use `\"text\"` for rendering into SVG.\n\n----\n\n#### formatValue: ?(n: number) => string\nA callback function that accepts a number and returns a formatted string\n\n----\n\n#### duration: ?number\n**default**: `300`<br/>\nTotal duration of animation in milliseconds\n\n----\n\n\n#### frameStyle: ?(perc: number) => Object | void,\nA callback function that accepts the percentage of completion of current animation and returns the style object to applied to the current frame\n\n----\n\n#### stepPrecision: ?number\nThe number of decimal places to render for intermediate values.\nIf set to `0`, rounds off the intermediate values using `Math.round`\n\n\n<br/>\n\n\n## Demo\nA demo can be found [here](http://ameyms.com/react-animated-number/).\nSource code for the demo can be found [here](https://github.com/ameyms/react-animated-number/blob/master/example/demo.jsx).\n\n## License\nreact-animated-number is licensed under MIT license.\n","readmeFilename":"README.md"}