https://github.com/hzdg/gsap-react-plugin

A GSAP plugin for tweening React.js component state.
https://github.com/hzdg/gsap-react-plugin

Last synced: about 1 month ago
JSON representation

A GSAP plugin for tweening React.js component state.

• Host: GitHub
• URL: https://github.com/hzdg/gsap-react-plugin
• Owner: hzdg
• License: other
• Created: 2014-07-10T19:07:50.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2014-08-08T20:26:06.000Z (over 10 years ago)
• Last Synced: 2024-07-21T13:15:31.298Z (5 months ago)
• Language: CoffeeScript
• Size: 652 KB
• Stars: 130
• Watchers: 32
• Forks: 8
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react - gsap-react-plugin - A GSAP plugin for tweening React.js component state

README

        
GSAP React Plugin

=================

A [GSAP] plugin for tweening [React.js] component state.

This plugin will handle tweening values on a prop called `state`. If the tween

target does not have a `setState` method, the plugin will not initialize.

Usage

-----

```javascript

React.createClass({

    getInitialState: function() {

        return {width: 0};

    },

    componentDidMount: function() {

        TweenLite.to(this, 1, {state: {width: 100}});

    },

    render: function() {

        return 
Hello World!

    }

});

```


Installation

------------

- Via [npm]: `npm install gsap-react-plugin`

- Via [bower]: `bower install gsap-react-plugin`

- Via file > save as: [gsap-react-plugin.js]

[GSAP]: http://www.greensock.com/gsap-js/

[React.js]: http://facebook.github.io/react/

[npm]: http://npmjs.org

[bower]: http://bower.io

[gsap-react-plugin.js]: https://raw.githubusercontent.com/hzdg/gsap-react-plugin/master/gsap-react-plugin.js