React + Rebound

gistfile1.js

"use strict";

import React from "react";
import rebound from "rebound";

const springSystem = new rebound.SpringSystem();

const SpringGroup = React.createClass({
    getDefaultProps (){
        return {
            tension: 40,
            friction: 7
        };
    },
    getInitialState (){
        const { tension, friction } = this.props;
        const spring = springSystem.createSpring(tension, friction);

        spring.addListener({
            onSpringUpdate: (it) => {
                this.setState({
                    value: it.getCurrentValue()
                });
            }
        });

        return {
            spring: spring,
            value: 0,
        };
    },
    componentWillReceiveProps (nextProps) {
        if (nextProps.tension !== this.props.tension ||
            nextProps.friction !== this.props.friction) {
            this.setSpringConfig(nextProps.tension, nextProps.friction);
        }
    },
    setSpringConfig (tension, friction) {
        const { spring } = this.state;
        spring.setSpringConfig(
            rebound.SpringConfig.fromOrigamiTensionAndFriction(tension, friction));
    },
    render (){
        const { getStyle, children, endValue, renderChildren, onClick, checked} = this.props; 
        const { spring, value, careAboutMouseLeave } = this.state;

        const content = renderChildren ? renderChildren(value) : children;

        return (
            <div aria-role="button" 
                onMouseDown={e => {
                    spring.setEndValue(checked ? 0 : 1);
                }}
                onClick={e => {
                    if (checked === undefined){
                        spring.setEndValue(0);                        
                    }
                    if (onClick){ onClick(e); }
                }}
                onMouseLeave={e => {
                    spring.setEndValue(checked ? 1 : 0);
                }}
                style={getStyle ? getStyle(value) : {}}>
                {content}
            </div>
        );
    }
});