# @honk1/vue-scroll-progressbar

> scroll progress bar for vue3

Latest version **0.1.3** (published 2021-12-16) · ISC license · 0 weekly downloads

## Install

```sh
npm install @honk1/vue-scroll-progressbar
pnpm add @honk1/vue-scroll-progressbar
yarn add @honk1/vue-scroll-progressbar
bun add @honk1/vue-scroll-progressbar
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.3 |
| Published | 2021-12-16 |
| First published | 2021-12-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 2.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | honk1 |
| Maintainers | honk1 |

## Links

- npm: https://www.npmjs.com/package/@honk1/vue-scroll-progressbar
- npm.io page: https://npm.io/package/@honk1/vue-scroll-progressbar

## Recent versions

- 0.1.3 (latest) — 2021-12-16
- 0.1.2 — 2021-12-16
- 0.1.0 — 2021-12-16

## README

# 📜 vue-scroll-progressBar

- [Docs](#docs)
- [Screeenshot](#screenshot)



## Docs

#### register global component
```typescript
import { createApp } from "vue";
import ProgressBarSpinner from "<YOUR DIR>/scrollProgressBar.ts";

export function createMyApp() {
  const app = createApp(App);
  // ...
  app.component("v-loader", ProgressBarSpinner);

  // ...
  return app;
}
```

#### use in template
```vue
<template>
    <v-loader />
    <div class="wrapper">
      <Component1 />
      <Component2 />
    </div>
</template>
```



#### props
| Propery      | Type | Default | Required? |
| ----------- | ----------- | ----------- | ----------- |
| bgColor      | String       | #df1e2 | false |
| width   | String        | "0%" | false |
| height   | String        | "5px" | false |

## Screenshot

![Demo Image](https://i.imgur.com/9MlXM7Q.png)

---
_Source: https://npm.io/package/@honk1/vue-scroll-progressbar · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._