# scrollomatic

> Pretty scrollbar container for react

Latest version **1.0.9** (published 2019-02-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install scrollomatic
pnpm add scrollomatic
yarn add scrollomatic
bun add scrollomatic
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.9 |
| Published | 2019-02-04 |
| First published | 2018-11-26 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=8 |
| Dependencies | 1 |
| Unpacked size | 222.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | SethHamilton |
| Maintainers | ponykyle, sethhamilton |

## Links

- npm: https://www.npmjs.com/package/scrollomatic
- Repository: https://github.com/CrowdConduct/Scrollomatic
- Homepage: https://github.com/CrowdConduct/Scrollomatic#readme
- Issues: https://github.com/CrowdConduct/Scrollomatic/issues
- npm.io page: https://npm.io/package/scrollomatic

## Dependencies (1)

- [normalize-wheel](https://npm.io/package/normalize-wheel.md) ^1.0.1

## Recent versions

- 1.0.9 (latest) — 2019-02-04
- 1.0.8 — 2019-01-15
- 1.0.7 — 2019-01-15
- 1.0.6 — 2019-01-15
- 1.0.5 — 2018-12-14
- 1.0.4 — 2018-11-28
- 1.0.3 — 2018-11-28
- 1.0.2 — 2018-11-26
- 1.0.1 — 2018-11-26
- 1.0.0 — 2018-11-26

## README

# Scrollomatic

> Pretty scrollbar container for react

[![NPM](https://img.shields.io/npm/v/scrollomatic.svg)](https://www.npmjs.com/package/scrollomatic) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)


> :baby_bottle: `scrollomatic` is in alpha

## Install

```bash
npm install --save scrollomatic
```

## Live Example

[Live Scrollomatic Example]()

## Usage

Here we have a small div with a much larger div within it. The the larger div is wrapped
with a Scrollomatic which will assume the size of it's parent. 

You can pass styles to `Scrollomatic` with a `styles=` property.

```jsx
export default class App extends Component {

  render () {
    return (
      <div style={{
          margin: 30,
          width:250, 
          height: 250, 
          overflow: 'hidden',
          backgroundColor: 'lightgray',
          fontSize: 22,
          borderWidth: 1, 
          borderStyle: 'solid',
          borderColor: 'black'}}>
        <Scrollomatic>
          <div>
            Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
          </div>
        </Scrollomatic>
      </div>
    )
  }
}
```

## License

MIT

Copyright 2018, Crowd Conduct Corp.

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