v0.4.5 React Component, with module.exports, test & update()

bower.json

@@ -1,6 +1,6 @@
 {
     "name": "scrolly",
-    "version": "0.4.4",
+    "version": "0.4.5",
     "description": "Scrolly: fast vanilla JS scrollbar plugin.",
     "keywords": [
         "scroll", "scrollbar", "scrolly", "bar",

gulpfile.js

@@ -44,7 +44,8 @@ var bwr = JSON.parse(fs.readFileSync('./.bowerrc')),// standard require() doesn'
     src = {
         jade: sources + 'jade/{,*/}index.jade',
         js: sources + 'js/*.js',
-        jsx: sources + 'jsx/*.jsx',
+        jsx: sources + 'jsx/react-*.jsx',
+        jsxTest: sources + 'jsx/test-*.jsx',
         less: sources + 'less/styles*.less'
     },
     pkg = require('./package.json'),
@@ -115,6 +116,21 @@ gulp.task('jsx', function () {
         .pipe(wrapper({ header: banner() }))
         .pipe(gulp.dest(paths.js));
 });
+/*
+ * React JSX test component
+ */
+gulp.task('jsx-test', function () {
+    return gulp.src([
+        src.jsxTest
+    ])
+        .pipe(plumber())
+        .pipe(concat('react-scrolly-test.js', {newLine: '\n\n'}))
+        .pipe(react())
+        .on('error', function (e) {
+            console.error(e.message + '\n  in ' + e.fileName);
+        })
+        .pipe(gulp.dest(paths.js))
+});
 
 /*
  * LESS sources.
@@ -180,7 +196,7 @@ gulp.task('vendor-react', function () {
  * Build, Watch & Default tasks.
  * Runs pre-build automatically on run.
  */
-gulp.task('build-all', ['jshint', 'build', 'vendor', 'vendor-react', 'jsx', 'less', 'jade']);
+gulp.task('build-all', ['jshint', 'build', 'vendor', 'vendor-react', 'jsx', 'jsx-test', 'less', 'jade']);
 
 gulp.task('serve', ['build-all'], function() {
     var http = require('http'),
@@ -200,6 +216,7 @@ gulp.task('watch', ['serve'], function () {
     gulp.watch(src.jade, ['jade']);
     gulp.watch(src.js, ['jshint', 'build']);
     gulp.watch(src.jsx, ['jsx']);
+    gulp.watch(src.jsxTest, ['jsx-test']);
     gulp.watch(src.less, ['less']);
 
     gulp.watch(paths.server + masks.all).on('change', livereload.changed);

package.json

@@ -1,6 +1,6 @@
 {
     "name": "scrolly",
-    "version": "0.4.4",
+    "version": "0.4.5",
     "description": "Scrolly: fast vanilla JS scrollbar plugin.",
     "keywords": [
         "scroll", "scrollbar", "scrolly", "bar",

public/css/styles-example.css

@@ -1,3 +1,3 @@
 body{font-family:"Helvetica Neue",Arial,Helvetica,sans-serif;font-size:12px}article{clear:both;float:none;padding:.2em 1em}.scrolly{float:left;width:25%;height:400px}.scrolly>.area.test1{background:#f2e4d8}.scrolly>.area.test1.scrolly.area+.bar{background:#808ca6}.scrolly>.area.test1.scrolly.area+.bar .thumb{background:#283d59}.scrolly .scrolly{background:rgba(0,0,0,0.1);width:100%}
 
-/*  scrolly v0.4.4, 2014.12.31  */
+/*  scrolly v0.4.5, 2015.01.01  */

public/js/react-scrolly.js

@@ -1,4 +1,4 @@
-/*  scrolly v0.4.4, 2014.12.31  */
+/*  scrolly v0.4.5, 2015.01.01  */
 var dataSet = function initDataSet() {
     if (document.documentElement.dataset) {
         return function native(el, prop, value) {
@@ -484,15 +484,30 @@ var Scrolly = React.createClass({displayName: "Scrolly",
             params: {}
         }
     },
+    getID: function () {
+        return this.id;
+    },
     componentDidMount: function () {
         if (typeof scrolly === 'undefined') {
             return;
         }
 
-        var area = this.refs.area.getDOMNode();
-
-        scrolly.barNode(area, this.props.params);
+        this.id = scrolly.barNode(
+            this.refs.area.getDOMNode(),
+            this.props.params
+        );
+    },
+    componentWillUnmount: function() {
+        if (this.id) {
+            scrolly.dispose(this.id);
+        }
     },
+    componentDidUpdate: function() {
+        if (this.id) {
+            scrolly.update(this.id);
+        }
+    },
+
     render: function() {
         return (
             React.createElement("div", React.__spread({},  this.props), 
@@ -508,3 +523,7 @@ var Scrolly = React.createClass({displayName: "Scrolly",
         );
     }
 });
+
+if (typeof module !== 'undefined') {
+    module.exports = Scrolly;
+}

public/js/scrolly.js

@@ -1,4 +1,4 @@
-/*  scrolly v0.4.4, 2014.12.31  */
+/*  scrolly v0.4.5, 2015.01.01  */
 var dataSet = function initDataSet() {
     if (document.documentElement.dataset) {
         return function native(el, prop, value) {