ember-scrollable

OSX-like scrollbar components in ember

Usage no npm install needed!

<script type="module">
  import emberScrollable from 'https://cdn.skypack.dev/ember-scrollable';
</script>

README

Ember Scrollable

Ember Version Npm Version Code Climate Build Status

A simple scrollbar implementation inspired by Trackpad Scroll Emulator.

Check out the demo

Installation

  • ember install ember-scrollable

Basic Usage

{{! app/templates/index.hbs }}

{{#ember-scrollable}}
  Some long content...
{{/ember-scrollable}}

Configuring the Component

The component accepts the following options:

  • horizontal: Enables horizontal scrolling (default: false)
  • vertical: Enables vertical scrolling (default: true if horizontal is unset)
  • autoHide: Enables auto hiding of the scrollbars on mouse out (default: true)
  • scrollTo: Set this property to manually scroll to a certain position (if in single bar mode)
  • scrollToX: Set this property to manually scroll to a certain position in the horizontal direction
  • scrollToY: Set this property to manually scroll to a certain position in the vertical direction
  • onScroll(scrollOffset, event): action triggered whenever the user scrolls, called with the current scrollOffset and the original scroll event
  • onScrolledToBottom: action triggered when user scrolled to the bottom

Advanced Usage

{{#ember-scrollable horizontal=true vertical=true}}
  content that is wide and long.
{{/ember-scrollable}}

Developing

Setup

  • git clone https://github.com/alphasights/ember-scrollable.git
  • npm install && bower install

Running

  • ember server

Linting

  • npm run lint:js
  • npm run lint:js -- --fix

Running tests

  • ember test – Runs the test suite on the current Ember version
  • ember test --server – Runs the test suite in "watch mode"
  • ember try:each – Runs the test suite against multiple Ember versions

Running the dummy application

For more information on using ember-cli, visit https://ember-cli.com/.

License

This project is licensed under the MIT License.