fullscreen.js

import React, { PropTypes, Component, Children, cloneElement } from 'react';

export default class Fullscreen extends Component {
  static propTypes = {
    children: PropTypes.node
  };
  
  state = {
    width: 0,
    height: 0
  };

  componentDidMount() {
    this.setState(this.getDimensions());
    window.addEventListener('resize', this.handleResize);
  }

  componentWillUnmount() {
    window.removeEventListener('resize', this.handleResize);
  }

  getDimensions() {
    return {
      width: window.innerWidth,
      height: window.innerHeight
    };
  }

  handleResize = () => {
    this.setState(this.getDimensions());
  };

  render() {
    const { children } = this.props;
    const { width, height } = this.state;
    const child = cloneElement(Children.only(children), { width: width, height: height});

    return child;
  }
}