{"_id":"@bigin/vue-roller","_rev":"8-a6ccd3a11db4e451934e3ec74d6bc142","name":"@bigin/vue-roller","dist-tags":{"latest":"2.1.0"},"versions":{"2.1.0":{"name":"@bigin/vue-roller","version":"2.1.0","keywords":["vue","roller"],"author":{"url":"https://github.com/andy-0414","name":"Park JongHoon","email":"pjh8667@gmail.com"},"license":"MIT","_id":"@bigin/vue-roller@2.1.0","maintainers":[{"name":"duynhuyn","email":"duyen.tran@bigin.vn"},{"name":"tammai.bigin","email":"tam.mai@bigin.vn"},{"name":"trinhnguyen1103","email":"trinh.nguyen@bigin.vn"}],"homepage":"https://andy-0414.github.io/vue-roller/","bugs":{"url":"https://github.com/Andy-0414/vue-roller/issues","email":"pjh8667@gmail.com"},"dist":{"shasum":"9363939041d23e04a253210f44239062efd80207","tarball":"https://registry.npmjs.org/@bigin/vue-roller/-/vue-roller-2.1.0.tgz","fileCount":17,"integrity":"sha512-YMWFnzv5roAW/CRw4yvsRSZygr8+qA3KIFKBlo1jw36bbv+6WBFnr1Rm0kWMPdyPZjjh0ZrDWTcVee0dz8zd9Q==","signatures":[{"sig":"MEUCIQD4LLokoGaA0NWb/UNEZ06KPTYbgr0bSHi7yxG7CTDf6AIge9JUFKVaLhKFvW3GPhSpiRKtK1jozm5Lj9PuTBrL/E8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":27485},"main":"./dist/vue-roller.umd.js","type":"module","_from":"file:bigin-vue-roller-2.1.0.tgz","types":"./dist/index.d.ts","module":"./dist/vue-roller.es.js","exports":{".":{"import":"./dist/vue-roller.es.js","require":"./dist/vue-roller.umd.js"},"./dist/style.css":"./dist/style.css"},"private":false,"scripts":{"p":"npm run build && npm publish --access=public","dev":"vite","build":"vite build && vue-tsc --emitDeclarationOnly","preview":"vite preview"},"_npmUser":{"name":"tammai.bigin","email":"tam.mai@bigin.vn"},"_resolved":"/private/var/folders/sk/rsdy069s6_9761vblx8x3tvw0000gp/T/96983ead3e6bed199ade45558a19ca79/bigin-vue-roller-2.1.0.tgz","_integrity":"sha512-YMWFnzv5roAW/CRw4yvsRSZygr8+qA3KIFKBlo1jw36bbv+6WBFnr1Rm0kWMPdyPZjjh0ZrDWTcVee0dz8zd9Q==","repository":{"url":"git+https://github.com/andy-0414/vue-roller.git","type":"git"},"_npmVersion":"10.2.3","description":"Fluid and smooth rolling animation for Vue.js","directories":{},"_nodeVersion":"18.19.0","dependencies":{"vue":"^3.3.11"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"sass":"^1.69.5","vite":"^5.0.9","vue-tsc":"^1.8.25","typescript":"^5.3.3","@types/node":"^20.10.4","@vitejs/plugin-vue":"^4.5.2"},"_npmOperationalInternal":{"tmp":"tmp/vue-roller_2.1.0_1702613794846_0.027442289011708976","host":"s3://npm-registry-packages"}}},"time":{"created":"2023-12-15T04:16:34.780Z","modified":"2026-01-07T04:08:35.263Z","2.1.0":"2023-12-15T04:16:35.126Z"},"bugs":{"url":"https://github.com/Andy-0414/vue-roller/issues","email":"pjh8667@gmail.com"},"author":{"url":"https://github.com/andy-0414","name":"Park JongHoon","email":"pjh8667@gmail.com"},"license":"MIT","homepage":"https://andy-0414.github.io/vue-roller/","keywords":["vue","roller"],"repository":{"url":"git+https://github.com/andy-0414/vue-roller.git","type":"git"},"description":"Fluid and smooth rolling animation for Vue.js","maintainers":[{"email":"trinh.nguyen@bigin.vn","name":"trinhnguyen1103"},{"email":"vy.trinh@bigin.vn","name":"vytrinh-bg"},{"email":"duyen.tran@bigin.vn","name":"duynhuyn"}],"readme":"![Animated logo](https://github.com/andy-0414/vue-roller/blob/master/img/vue2-roller.webp?raw=true)\n\n[![License](https://img.shields.io/npm/l/vue-roller.svg?sanitize=true)](https://www.npmjs.com/package/vue-roller)\n[![Version](https://img.shields.io/npm/v/vue-roller.svg?sanitize=true)](https://www.npmjs.com/package/vue-roller)\n\n# vue-roller\n\nFluid and smooth rolling animation for Vue.js\n\n# Demo\n\n![Animated Demo](https://github.com/andy-0414/vue-roller/blob/master/img/vue2-example1.webp?raw=true)\n![Animated Demo](https://github.com/andy-0414/vue-roller/blob/master/img/vue2-example2.webp?raw=true)\n\nTry out [here](http://andy-0414.github.io/vue-roller) with your own text!\n\n# Getting Started\n\nnpm (Vue.js 2)\n\n```sh\nnpm i vue-roller@1.12.7\n```\n\nVue\n\n```js\nimport Roller from \"vue-roller\";\n\nexport default {\n    components:{\n        Roller\n    }\n}\n...\n```\n\nVue-typescript\n\n```js\nimport Roller from \"vue-roller\";\n\n@Component({\n\tcomponents: { Roller }\n})\n...\n```\n\n# Options\n\n## text (Required)\n\n```html\n<Roller text=\"1234\"></Roller>\n```\n\nDisplays text.\n\n## transition\n\n```html\n<Roller :transition=\"1\"></Roller>\n```\n\nSets the time for the animation to complete in second(s). `0.5` by default.\n\n## isNumberFormat\n```html\n<Roller :isNumberFormat=\"true\"></Roller>\n```\n\nCan be set to `true` if you want to display commas as thousands separators. `false` by default.\n\n## isStatic\n\n```html\n<Roller :isStatic=\"true\"></Roller>\n```\n\ndefault : false\nUsed for disposable animation. (Performance improvement)\n\n## charList\n\n```html\n<Roller :charList=\"['a', 'b', 'c']\"></Roller>\n```\n\nSets the list of characters used for the animation.\n\nDefault: `[\"0\", \"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\"]`\n\n## defaultChar\n\n```html\n<Roller defaultChar=\"0\"></Roller>\n```\n\nSets the text to display when the page is first loaded (before the animation actually starts).\n\nMust be included in charList.\n\n`\"\"` by default.\n\n## wordWrap\n\n```html\n<Roller :wordWrap=\"20\"></Roller>\n```\n\nSets the number of line break characters (word-break: keep-all)\n\n`0` by default. (word-break: break-all)\n\n## Event : animationend\n\n```html\n<Roller @animationend=\"event\"></Roller>\n```\n\nCall the event at the end of the animation.\n\n# Style\n\n```html\n<Roller class=\"roller\"></Roller>\n\n<style>\n\t.roller .rollerBlock {\n\t\tfont-family: ~~~;\n\t\tmargin: 20px;\n\t}\n</style>\n```\n","readmeFilename":"README.vue2.md"}