{"_id":"@dnewkerk/vue-bars","_rev":"4-8cdbb56df4b3ead3a080bf05eda05260","name":"@dnewkerk/vue-bars","dist-tags":{"latest":"1.0.2"},"versions":{"1.0.0":{"name":"@dnewkerk/vue-bars","version":"1.0.0","keywords":["vue","bars","svg","graph","data-visualization","component"],"license":"MIT","_id":"@dnewkerk/vue-bars@1.0.0","maintainers":[{"name":"dnewkerk","email":"davidnewkerk@protonmail.com"}],"homepage":"https://github.com/dnewkerk/vue-bars#readme","bugs":{"url":"https://github.com/dnewkerk/vue-bars/issues"},"dist":{"shasum":"5cc3824c7abfa9e13a2671c79eb7287ea1e20067","tarball":"https://registry.npmjs.org/@dnewkerk/vue-bars/-/vue-bars-1.0.0.tgz","fileCount":5,"integrity":"sha512-8aRHNqArvJs3/MHHpnGvL+ng/1q2TOZ5cVKxsBIviIGN9+9JJNS1E3SkvFjr/x9XyVfeH056RZ5GrKLIjlTUUw==","signatures":[{"sig":"MEUCIQDBHmcnhFD2FW224naW032bMDa2RnoOKhOwINS/htfMkAIgRhUKaE8pCjv7y+Lf3B3EYB2pALf+U6cFPOWnj6f9y5w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":17845},"main":"./dist/vue-bars.umd.cjs","type":"module","module":"./dist/vue-bars.js","exports":{".":{"import":"./dist/vue-bars.js","require":"./dist/vue-bars.umd.cjs"}},"gitHead":"57b4651147595e388e31d5959ce2475ef356d1b7","scripts":{"dev":"vite","lint":"eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore","build":"vite build","preview":"vite preview"},"_npmUser":{"name":"dnewkerk","email":"davidnewkerk@protonmail.com"},"repository":{"url":"git+https://github.com/dnewkerk/vue-bars.git","type":"git"},"_npmVersion":"8.19.3","description":"Simple, elegant spark bars for Vue 3","directories":{},"_nodeVersion":"16.19.0","_hasShrinkwrap":false,"productionName":"Vue Bars","devDependencies":{"vite":"^4.1.3","eslint":"^8.34.0","eslint-plugin-vue":"^9.9.0","@vitejs/plugin-vue":"^4.0.0"},"peerDependencies":{"vue":"^3.2.47"},"_npmOperationalInternal":{"tmp":"tmp/vue-bars_1.0.0_1686245303496_0.04186179043076277","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"@dnewkerk/vue-bars","productionName":"Vue Bars","version":"1.0.2","description":"Simple, elegant spark bars for Vue 3","type":"module","main":"./dist/vue-bars.umd.cjs","module":"./dist/vue-bars.js","exports":{".":{"import":"./dist/vue-bars.js","require":"./dist/vue-bars.umd.cjs"}},"scripts":{"dev":"vite","build":"vite build","preview":"vite preview","lint":"eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"},"keywords":["vue","bars","svg","graph","data-visualization","component"],"repository":{"type":"git","url":"git+https://github.com/dnewkerk/vue-bars.git"},"homepage":"https://github.com/dnewkerk/vue-bars#readme","license":"MIT","peerDependencies":{"vue":"^3.2.47"},"devDependencies":{"@vitejs/plugin-vue":"^4.0.0","eslint":"^8.34.0","eslint-plugin-vue":"^9.9.0","vite":"^4.1.3"},"gitHead":"dbc1cf73d8180f589f7a1e56aee0907bdc08553e","_id":"@dnewkerk/vue-bars@1.0.2","bugs":{"url":"https://github.com/dnewkerk/vue-bars/issues"},"_nodeVersion":"25.2.1","_npmVersion":"11.6.2","dist":{"integrity":"sha512-eAUljhHym2BVnu5DRpMmF4Fo2tMwma+ocQQuLeqaW35TPQ2vgk1i1G3MrlNLupTeKamsbjfDmEzL9s40iS8gtA==","shasum":"162cf36e63b3d3a6048280500f3b4e26f70ed529","tarball":"https://registry.npmjs.org/@dnewkerk/vue-bars/-/vue-bars-1.0.2.tgz","fileCount":5,"unpackedSize":17895,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCKSHu9bkz4LM1R0uFci85NG6MmS7tyf3x/QI7xuV8ZtwIhALByBLP5omt2GSmvPIM2GwILQQ+aFRZD1ky83BB/yfw+"}]},"_npmUser":{"name":"dnewkerk","email":"davidnewkerk@protonmail.com"},"directories":{},"maintainers":[{"name":"dnewkerk","email":"davidnewkerk@protonmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vue-bars_1.0.2_1766811401653_0.8706336728331432"},"_hasShrinkwrap":false}},"time":{"created":"2023-06-08T17:28:23.421Z","modified":"2025-12-27T04:56:42.015Z","1.0.0":"2023-06-08T17:28:23.736Z","1.0.1":"2025-12-27T04:42:59.283Z","1.0.2":"2025-12-27T04:56:41.825Z"},"bugs":{"url":"https://github.com/dnewkerk/vue-bars/issues"},"license":"MIT","homepage":"https://github.com/dnewkerk/vue-bars#readme","keywords":["vue","bars","svg","graph","data-visualization","component"],"repository":{"type":"git","url":"git+https://github.com/dnewkerk/vue-bars.git"},"description":"Simple, elegant spark bars for Vue 3","maintainers":[{"name":"dnewkerk","email":"davidnewkerk@protonmail.com"}],"readme":"
\n \"Vue\n
\n

Vue Bars

\n

🌈 Simple, elegant spark bars for Vue 3

\n
\n \"npm\"\n \"vue\"\n
\n\n
\n\n## Installation\n\n```shell\nnpm i @dnewkerk/vue-bars -S\n```\n\n## Usage\n\n```js\nimport VueBars from \"@dnewkerk/vue-bars\";\n```\n\n_vue template_\n\n```vue\n\n\n```\n\n## Upgrading from vuebars (Vue 2)\n\nFor consistency and to resolve lint errors, the repository and components have been renamed.\n\n- Update imports from `import Bar` to `import VueBars`\n- Update `` to ``\n- Global installation has been removed. Please import the component where needed in your project.\n\n## Inspired by\n\n[vuetrend](https://www.npmjs.org/package/vuetrend) - 📈 Simple, elegant spark lines\n\nForked from https://github.com/DeviaVir/vue-bar to support Vue 3\n\n## Props\n\n| Name | Type | Default | Description | Example |\n| ------------ | -------------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------- |\n| data | Number\\|Object | `undefined` | The data accepted by Vue Bars is incredibly simple: An array of y-axis values to graph. | `[120, 149, 193.4, 200, 92]` or `[{ value: 4 }, { value: 6 }, { value: 8 }]` |\n| gradient | String | `['#000']` | Colour can be specified as any SVG-supported format (named, rgb, hex, etc). | `['#0FF', '#F0F', '#FF0']` |\n| width | Number | auto | Set an explicit width for your SVG. | - |\n| height | Number | auto | Set an explicit height for your SVG. | - |\n| padding | Number | `8` | If you set a very large `strokeWidth` on your line, you may notice that it gets \"cropped\" towards the edges. | - |\n| rounding | Number | `2` | To control radius on each bar's corners | - |\n| barWidth | Number | `4` | Set width of each bar | - |\n| labelRotate | Number | `-45` | To control rotation of labels | - |\n| labelSize | Number | `0.7` | To control size of labels | - |\n| labelColor | String | `#999` | To control color of labels | - |\n| labelData | String | `[]` | Array of strings | `['label1','label2','label3']` |\n| minBarHeight | Number | `3` | Minimum height | - |\n| autoDraw | Boolean | `false` | Allow the line to draw itself on mount. Set to `true` to enable, and customize using `autoDrawDuration` and `autoDrawEasing`. | - |\n| growDuration | Number | `0.5` | The amount of time, in seconds, that the autoDraw animation should span. This prop has no effect if `autoDraw` isn't set to `true`. | - |\n| max | Number | `-Infinity` | Specify max value | - |\n| min | Number | `Infinity` | Specify min value, This is useful if you have multiple lines. See [#8](https://github.com/QingWei-Li/vue-trend/issues/8) | - |\n\n#### SVG Props\n\nBy default, all properties not recognized by Vue Bars will be delegated to the SVG. The line inherits these properties if none of its own override them.\n\n## On-the-fly reloading\n\nMake sure you use pass the same variable for your `data` as for the `key`, this will make sure Vue recognizes changes to your data array,\nand consequently forces a reload of the instance.\n\n## TODO\n\n- Unit test\n\n## License\n\nMIT\n","readmeFilename":"README.md"}