🎉 first commit

Author: prayerslayer

README.md

@@ -1,2 +1,11 @@
 # react-automatic-width
-Automatically sets `width` property on child components
+
+Reacts on window.onResize and sets its current width as property on its children. Use this to keep components such as [fixed-data-table](https://facebook.github.io/fixed-data-table/) or [react-d3-components](https://github.com/codesuki/react-d3-components) responsive.
+
+# Usage
+
+**TODO**
+
+# License
+
+Apache 2.0

src/react-automatic-width.jsx

@@ -0,0 +1,46 @@
+import React from 'react';
+
+class AutomaticWidth extends React.Component {
+    constructor(props) {
+        super();
+        this.state = {
+            listener: null,
+            width: props.initialWidth || 1000
+        };
+    }
+
+     _resizeHandler() {
+        let dom = this.refs.autowidthWrapper.getDOMNode();
+        if (dom.clientWidth !== this.state.width) {
+            this.setState({
+                width: dom.clientWidth
+            });
+        }
+    }
+
+    componentDidMount() {
+        let boundListener = this._resizeHandler.bind(this);
+        window.addEventListener('resize', boundListener);
+        this.setState({
+            listener: boundListener
+        });
+        boundListener();
+    }
+
+    componentWillUnmount() {
+        window.removeEventListener('resize', this.state.listener);
+    }
+
+    render() {
+        return <div ref='autowidthWrapper' {...this.props}>
+                    {React.Children.map(this.props.children, c =>
+                        React.addons.cloneWithProps(c, {
+                            width: this.state.width
+                        })
+                    )}
+                </div>;
+    }
+}
+AutomaticWidth.displayName='Automatic Width';
+export default AutomaticWidth;
+