react-responsive-grid/dist/components/Breakpoint.js

Power tools for responsive layouts with React

// Generated by CoffeeScript 1.10.0
var ComponentWidthComponent, PageWidthComponent, PageWidthMixin, React, componentWidthMixin, objectAssign;

React = require('react');

componentWidthMixin = require('react-component-width-mixin');

PageWidthMixin = require('react-page-width');

objectAssign = require('object-assign');

ComponentWidthComponent = React.createClass({
  displayName: "Breakpoint",
  mixins: [componentWidthMixin],
  propTypes: {
    minWidth: React.PropTypes.number,
    maxWidth: React.PropTypes.number
  },
  getDefaultProps: function() {
    return {
      minWidth: 0,
      maxWidth: 1000000000000000000000
    };
  },
  renderChildren: function() {
    return React.Children.map(this.props.children, (function(_this) {
      return function(child) {
        var ref;
        if ((child != null ? (ref = child.type) != null ? ref.displayName : void 0 : void 0) === "Span") {
          return React.cloneElement(child, {
            context: _this.props.context
          });
        } else {
          return child;
        }
      };
    })(this));
  },
  render: function() {
    var props, ref;
    props = objectAssign({}, this.props);
    delete props.maxWidth;
    delete props.minWidth;
    delete props.widthMethod;
    if (this.state.componentWidth) {
      if ((this.props.minWidth <= (ref = this.state.componentWidth) && ref < this.props.maxWidth)) {
        return React.createElement("div", Object.assign({}, props), this.renderChildren());
      } else {
        return React.createElement("div", null);
      }
    } else {
      return React.createElement("div", null);
    }
  }
});

PageWidthComponent = React.createClass({
  displayName: "Breakpoint",
  mixins: [PageWidthMixin],
  propTypes: {
    minWidth: React.PropTypes.number,
    maxWidth: React.PropTypes.number
  },
  getDefaultProps: function() {
    return {
      minWidth: 0,
      maxWidth: 1000000000000000000000
    };
  },
  renderChildren: function() {
    return React.Children.map(this.props.children, (function(_this) {
      return function(child) {
        var ref;
        if (((ref = child.type) != null ? ref.displayName : void 0) === "Span") {
          return React.cloneElement(child, {
            context: _this.props.context
          });
        } else {
          return child;
        }
      };
    })(this));
  },
  render: function() {
    var props, ref;
    props = objectAssign({}, this.props);
    delete props.maxWidth;
    delete props.minWidth;
    delete props.widthMethod;
    if (this.state.pageWidth) {
      if ((this.props.minWidth <= (ref = this.state.pageWidth) && ref < this.props.maxWidth)) {
        return React.createElement("div", Object.assign({}, props), this.renderChildren());
      } else {
        return React.createElement("div", null);
      }
    } else {
      return React.createElement("div", null);
    }
  }
});

module.exports = React.createClass({
  displayName: 'Breakpoint',
  propTypes: {
    widthMethod: React.PropTypes.string.isRequired,
    minWidth: React.PropTypes.number,
    maxWidth: React.PropTypes.number
  },
  getDefaultProps: function() {
    return {
      widthMethod: 'pageWidth'
    };
  },
  render: function() {
    if (this.props.widthMethod === "pageWidth") {
      return React.createElement(PageWidthComponent, Object.assign({}, this.props));
    } else if (this.props.widthMethod === "componentWidth") {
      return React.createElement(ComponentWidthComponent, Object.assign({}, this.props));
    }
  }
});