usepages-blocks/cjs.js

blocks for usePages.today

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var webfontloader = require('webfontloader');
var React = require('react');
var React__default = _interopDefault(React);
var panelsUi = require('panels-ui');
var toCSS = _interopDefault(require('style-to-css'));
var uniqueId = _interopDefault(require('mini-unique-id'));
var Waiting = _interopDefault(require('waiting'));

var asyncGenerator = function () {
  function AwaitValue(value) {
    this.value = value;
  }

  function AsyncGenerator(gen) {
    var front, back;

    function send(key, arg) {
      return new Promise(function (resolve, reject) {
        var request = {
          key: key,
          arg: arg,
          resolve: resolve,
          reject: reject,
          next: null
        };

        if (back) {
          back = back.next = request;
        } else {
          front = back = request;
          resume(key, arg);
        }
      });
    }

    function resume(key, arg) {
      try {
        var result = gen[key](arg);
        var value = result.value;

        if (value instanceof AwaitValue) {
          Promise.resolve(value.value).then(function (arg) {
            resume("next", arg);
          }, function (arg) {
            resume("throw", arg);
          });
        } else {
          settle(result.done ? "return" : "normal", result.value);
        }
      } catch (err) {
        settle("throw", err);
      }
    }

    function settle(type, value) {
      switch (type) {
        case "return":
          front.resolve({
            value: value,
            done: true
          });
          break;

        case "throw":
          front.reject(value);
          break;

        default:
          front.resolve({
            value: value,
            done: false
          });
          break;
      }

      front = front.next;

      if (front) {
        resume(front.key, front.arg);
      } else {
        back = null;
      }
    }

    this._invoke = send;

    if (typeof gen.return !== "function") {
      this.return = undefined;
    }
  }

  if (typeof Symbol === "function" && Symbol.asyncIterator) {
    AsyncGenerator.prototype[Symbol.asyncIterator] = function () {
      return this;
    };
  }

  AsyncGenerator.prototype.next = function (arg) {
    return this._invoke("next", arg);
  };

  AsyncGenerator.prototype.throw = function (arg) {
    return this._invoke("throw", arg);
  };

  AsyncGenerator.prototype.return = function (arg) {
    return this._invoke("return", arg);
  };

  return {
    wrap: function (fn) {
      return function () {
        return new AsyncGenerator(fn.apply(this, arguments));
      };
    },
    await: function (value) {
      return new AwaitValue(value);
    }
  };
}();





var classCallCheck = function (instance, Constructor) {
  if (!(instance instanceof Constructor)) {
    throw new TypeError("Cannot call a class as a function");
  }
};









var _extends = Object.assign || function (target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i];

    for (var key in source) {
      if (Object.prototype.hasOwnProperty.call(source, key)) {
        target[key] = source[key];
      }
    }
  }

  return target;
};

var get = function get(object, property, receiver) {
  if (object === null) object = Function.prototype;
  var desc = Object.getOwnPropertyDescriptor(object, property);

  if (desc === undefined) {
    var parent = Object.getPrototypeOf(object);

    if (parent === null) {
      return undefined;
    } else {
      return get(parent, property, receiver);
    }
  } else if ("value" in desc) {
    return desc.value;
  } else {
    var getter = desc.get;

    if (getter === undefined) {
      return undefined;
    }

    return getter.call(receiver);
  }
};

var inherits = function (subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
    throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
  }

  subClass.prototype = Object.create(superClass && superClass.prototype, {
    constructor: {
      value: subClass,
      enumerable: false,
      writable: true,
      configurable: true
    }
  });
  if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
};









var objectWithoutProperties = function (obj, keys) {
  var target = {};

  for (var i in obj) {
    if (keys.indexOf(i) >= 0) continue;
    if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
    target[i] = obj[i];
  }

  return target;
};

var possibleConstructorReturn = function (self, call) {
  if (!self) {
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  }

  return call && (typeof call === "object" || typeof call === "function") ? call : self;
};



var set = function set(object, property, value, receiver) {
  var desc = Object.getOwnPropertyDescriptor(object, property);

  if (desc === undefined) {
    var parent = Object.getPrototypeOf(object);

    if (parent !== null) {
      set(parent, property, value, receiver);
    }
  } else if ("value" in desc && desc.writable) {
    desc.value = value;
  } else {
    var setter = desc.set;

    if (setter !== undefined) {
      setter.call(receiver, value);
    }
  }

  return value;
};

var Font = function (_Component) {
  inherits(Font, _Component);

  function Font() {
    classCallCheck(this, Font);
    return possibleConstructorReturn(this, _Component.apply(this, arguments));
  }

  Font.prototype.componentDidMount = function componentDidMount() {
    this.load();
  };

  Font.prototype.componentDidUpdate = function componentDidUpdate() {
    this.load();
  };

  Font.prototype.load = function load() {
    var _load2;

    var props = this.props;


    var source = props.source;
    var weight = '';

    var urls = void 0;
    if (props.family === 'FontAwesome') {
      source = 'custom';
      urls = ['https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css'];
    } else {
      weight = ':' + props.weight;
    }

    webfontloader.load((_load2 = {}, _load2[source] = {
      families: ['' + props.family + weight],
      urls: urls
    }, _load2));
  };

  Font.prototype.render = function render() {
    return null;
  };

  return Font;
}(React.Component);

Font.defaultProps = {
  source: 'google',
  weight: '300'
};
Font.propTypes = {
  family: React.PropTypes.string.isRequired,
  source: React.PropTypes.oneOf(['custom', 'google']).isRequired,
  weight: React.PropTypes.string.isRequired
};

var GoTo = function (_Component) {
  inherits(GoTo, _Component);

  function GoTo() {
    classCallCheck(this, GoTo);
    return possibleConstructorReturn(this, _Component.apply(this, arguments));
  }

  GoTo.prototype.render = function render() {
    var _props = this.props;
    var children = _props.children;
    var className = _props.className;
    var _ref = _props._ref;
    var styleActive = _props.styleActive;
    var styleHover = _props.styleHover;
    var props = objectWithoutProperties(_props, ['children', 'className', '_ref', 'styleActive', 'styleHover']);


    var inlineStyle = null;
    if (Object.keys(styleHover).length) {
      inlineStyle = React__default.createElement(
        'style',
        null,
        '.' + className + ':hover {' + toCSS(styleHover) + '}'
      );
    }

    if (_ref) {
      props.ref = _ref;
    }

    return React__default.createElement(
      'a',
      _extends({}, props, { className: className, target: '_blank' }),
      inlineStyle,
      children
    );
  };

  return GoTo;
}(React.Component);

GoTo.propTypes = {
  href: React.PropTypes.string.isRequired,
  _ref: React.PropTypes.func,
  style: React.PropTypes.object,
  styleActive: React.PropTypes.object,
  styleHover: React.PropTypes.object
};

var OnClick = function (_Component) {
  inherits(OnClick, _Component);

  function OnClick() {
    classCallCheck(this, OnClick);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    var _this = possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args)));

    _this.state = {};
    return _this;
  }

  OnClick.prototype.componentWillMount = function componentWillMount() {
    var props = this.props;


    var manualActive = typeof props.isActive === 'boolean';
    this.setState({
      isActive: manualActive ? props.isActive : false,
      manualActive: manualActive
    });

    this.bindOnClick(props.onClick);
  };

  OnClick.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    this.bindOnClick(nextProps.onClick);

    var manualActive = typeof nextProps.isActive === 'boolean';

    if (manualActive) {
      this.setState({
        isActive: nextProps.isActive,
        manualActive: manualActive
      });
    }
  };

  OnClick.prototype.componentWillUnmount = function componentWillUnmount() {
    if (this.onClickTimeout) {
      clearTimeout(this.onClickTimeout);
    }
  };

  OnClick.prototype.bindOnClick = function bindOnClick(onClick) {
    var _this2 = this;

    /* eslint-disable no-console */
    var finalOnClick = typeof onClick === 'function' ? onClick : function () {
      return console.log(onClick);
    };

    this.onClick = function (event) {
      finalOnClick(event);

      event.stopPropagation();

      if (!_this2.state.manualActive) {
        _this2.setState({
          isActive: true
        });

        _this2.onClickTimeout = setTimeout(function () {
          _this2.setState({
            isActive: false
          });
          _this2.onClickTimeout = null;
        }, _this2.props.styleActiveTimeout);
      }
    };
  };

  OnClick.prototype.render = function render() {
    var isActive = this.state.isActive;
    /* eslint-disable no-unused-vars */

    var _props = this.props;
    var children = _props.children;
    var className = _props.className;
    var _isActive = _props.isActive;
    var _ref = _props._ref;
    var style = _props.style;
    var styleActive = _props.styleActive;
    var styleActiveTimeout = _props.styleActiveTimeout;
    var styleHover = _props.styleHover;
    var rest = objectWithoutProperties(_props, ['children', 'className', 'isActive', '_ref', 'style', 'styleActive', 'styleActiveTimeout', 'styleHover']);


    var inlineStyle = null;
    if (!isActive && Object.keys(styleHover).length) {
      inlineStyle = React__default.createElement(
        'style',
        null,
        '.' + className + ':hover {' + toCSS(styleHover) + '}'
      );
    }

    var finalStyle = isActive ? _extends({}, style, styleActive, {
      outline: 0
    }) : _extends({}, style, {
      outline: 0,
      cursor: 'pointer'
    });

    if (_ref) {
      rest.ref = _ref;
    }

    return React__default.createElement(
      'button',
      _extends({}, rest, {
        className: className,
        disabled: isActive,
        onClick: this.onClick,
        style: finalStyle
      }),
      inlineStyle,
      children
    );
  };

  return OnClick;
}(React.Component);

OnClick.defaultProps = {
  styleActiveTimeout: 1000
};
OnClick.propTypes = {
  isActive: React.PropTypes.bool,
  onClick: React.PropTypes.oneOfType([React.PropTypes.func, React.PropTypes.string]),
  _ref: React.PropTypes.func,
  style: React.PropTypes.object,
  styleActive: React.PropTypes.object,
  styleActiveTimeout: React.PropTypes.number.isRequired,
  styleHover: React.PropTypes.object
};

function createGroup(name, groupStyle) {
  var Group = function (_Component) {
    inherits(Group, _Component);

    function Group(props, context) {
      classCallCheck(this, Group);

      var _this = possibleConstructorReturn(this, _Component.call(this, props, context));

      _this.className = 'Horizontal-' + uniqueId();
      return _this;
    }

    Group.prototype.render = function render() {
      var _props = this.props;
      var children = _props.children;
      var moreClassName = _props.className;
      var goTo = _props.goTo;
      var style = _props.style;
      var teleportTo = _props.teleportTo;
      var props = objectWithoutProperties(_props, ['children', 'className', 'goTo', 'style', 'teleportTo']);
      var className = this.className;
      var pages = this.context.pages;


      var finalStyle = _extends({
        flexWrap: 'wrap'
      }, groupStyle, style);

      var Base = void 0;
      if (teleportTo) {
        Base = panelsUi.Teleport;
        props.to = teleportTo;
      } else if (goTo) {
        Base = GoTo;
        props.href = goTo;
      } else if (props.onClick) {
        Base = OnClick;
      } else {
        var _ref = props._ref;
        var styleActive = props.styleActive;
        var styleHover = props.styleHover;
        var rest = objectWithoutProperties(props, ['_ref', 'styleActive', 'styleHover']);


        var inlineStyle = null;
        if (Object.keys(styleHover).length) {
          inlineStyle = React__default.createElement(
            'style',
            null,
            '.' + className + ':hover {' + toCSS(styleHover) + '}'
          );
        }

        return React__default.createElement(
          'div',
          _extends({}, rest, {
            className: className + ' ' + moreClassName,
            ref: _ref,
            style: finalStyle
          }),
          inlineStyle,
          children
        );
      }

      if (pages && pages.isSelecting) {
        props.onClick = function (event) {
          if (event) {
            event.preventDefault();
          }
          return true;
        };
      }

      return React__default.createElement(
        Base,
        _extends({}, props, {
          className: className,
          style: finalStyle
        }),
        children
      );
    };

    return Group;
  }(React.Component);

  Group.contextTypes = {
    pages: React.PropTypes.shape({
      isSelecting: React.PropTypes.bool
    })
  };

  Group.defaultProps = {
    className: '',
    style: {},
    styleActive: {},
    styleHover: {}
  };

  Group.displayName = name;

  Group.propTypes = {
    blocks: React.PropTypes.any,
    goTo: React.PropTypes.string,
    onClick: React.PropTypes.oneOfType([React.PropTypes.bool, React.PropTypes.string, React.PropTypes.func]),
    _ref: React.PropTypes.func,
    style: React.PropTypes.object,
    styleActive: React.PropTypes.object,
    styleHover: React.PropTypes.object,
    teleportTo: React.PropTypes.string
  };

  return Group;
}

var horizontal = createGroup('Horizontal', { flexDirection: 'row' });

var Knocking = function Knocking(_ref) {
  var dataBlock = _ref['data-block'];
  var size = _ref.size;
  var _ref$style = _ref.style;
  var style = _ref$style === undefined ? {} : _ref$style;
  return React__default.createElement(
    'div',
    { 'data-block': dataBlock, style: style },
    React__default.createElement(Waiting, { color: style.color, size: size })
  );
};

Knocking.defaultProps = {
  style: {
    color: '#323232'
  },
  size: 20
};

Knocking.description = 'A handy loading indicator ;)';

Knocking.propTypes = {
  style: React.PropTypes.object,
  size: React.PropTypes.number.isRequired
};

var Image = function (_Component) {
  inherits(Image, _Component);

  function Image(props) {
    classCallCheck(this, Image);

    var _this = possibleConstructorReturn(this, _Component.call(this, props));

    _this.onLoad = _this.onLoad.bind(_this);
    _this.state = {
      isLoading: true
    };
    return _this;
  }

  Image.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    if (this.props.src !== nextProps.src) {
      this.setState({
        isLoading: true
      });
    }
  };

  Image.prototype.onLoad = function onLoad() {
    this.setState({
      isLoading: false
    });
  };

  Image.prototype.render = function render() {
    var isLoading = this.state.isLoading;
    var _props = this.props;
    var text = _props.text;
    var src = _props.src;
    var style = _props.style;
    var styleLoading = _props.styleLoading;
    var styleWrapper = _props.styleWrapper;


    return React__default.createElement(
      'div',
      { style: styleWrapper },
      isLoading && React__default.createElement(Knocking, { style: styleLoading }),
      React__default.createElement('img', {
        alt: text,
        onLoad: this.onLoad,
        src: src,
        style: style,
        title: text
      })
    );
  };

  return Image;
}(React.Component);

Image.defaultProps = {
  src: 'https://files.usepages.today/usepages.today/image-placeholder.svg',
  style: {},
  styleLoading: {
    position: 'absolute'
  },
  styleWrapper: {},
  text: 'Alternative text'
};

Image.description = "Add some text for when the image can't be displayed.";

Image.propTypes = {
  src: React.PropTypes.string.isRequired,
  style: React.PropTypes.object,
  styleLoading: React.PropTypes.object,
  styleWrapper: React.PropTypes.object,
  text: React.PropTypes.string
};

var PLACEHOLDER_PREFIXES = ['::-webkit-input-placeholder', '::-moz-placeholder', ':-ms-input-placeholder', ':placeholder-shown'];

var Input = function (_Component) {
  inherits(Input, _Component);

  function Input() {
    classCallCheck(this, Input);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    var _this = possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args)));

    _this.id = 'Input-' + uniqueId();
    return _this;
  }

  Input.prototype.render = function render() {
    var id = this.id;
    var _props = this.props;
    var onEnter = _props.onEnter;
    var _ref = _props._ref;
    var style = _props.style;
    var styleFocus = _props.styleFocus;
    var styleHover = _props.styleHover;
    var stylePlaceholder = _props.stylePlaceholder;
    var styleWrapper = _props.styleWrapper;
    var rest = objectWithoutProperties(_props, ['onEnter', '_ref', 'style', 'styleFocus', 'styleHover', 'stylePlaceholder', 'styleWrapper']);


    var backgroundColor = style && style.backgroundColor || 'transparent';
    var color = style && style.color || 'black';
    var inlineStyle = ['#' + id + ':-webkit-autofill {\n      background-color: ' + backgroundColor + ' !important;\n      box-shadow: 0 0 0px 1000px ' + backgroundColor + ' inset;\n      color: ' + color + ' !important;\n    }'];

    if (stylePlaceholder) {
      PLACEHOLDER_PREFIXES.forEach(function (prefix) {
        inlineStyle.push('#' + id + prefix + ' {' + toCSS(stylePlaceholder) + '}');
      });
    }
    if (styleHover) {
      inlineStyle.push(inlineStyle + ' #' + id + ':hover {' + toCSS(styleHover) + '}');
    }
    if (styleFocus) {
      inlineStyle.push('#' + id + ':focus {' + toCSS(styleFocus) + '}');
    }

    var onKeyUp = void 0;
    if (typeof onEnter !== 'undefined') {
      (function () {
        /* eslint-disable no-console */
        var finalOnEnter = typeof onEnter === 'function' ? onEnter : function () {
          return console.log(onEnter);
        };
        onKeyUp = function onKeyUp(event) {
          return event.key === 'Enter' && finalOnEnter(event);
        };
      })();
    }

    return React__default.createElement(
      'div',
      { style: styleWrapper },
      React__default.createElement(
        'style',
        null,
        inlineStyle.join('\n')
      ),
      React__default.createElement('input', _extends({}, rest, {
        autoComplete: 'off',
        id: id,
        onKeyUp: onKeyUp,
        ref: _ref,
        style: style
      }))
    );
  };

  return Input;
}(React.Component);

Input.defaultProps = {
  placeholder: '',
  style: {},
  styleHover: {},
  styleWrapper: {},
  type: 'text'
};

Input.propTypes = {
  onEnter: React.PropTypes.func,
  placeholder: React.PropTypes.string,
  _ref: React.PropTypes.func,
  style: React.PropTypes.object,
  styleFocus: React.PropTypes.object,
  styleHover: React.PropTypes.object,
  stylePlaceholder: React.PropTypes.object,
  styleWrapper: React.PropTypes.object,
  type: React.PropTypes.string.isRequired
};

var List = function List() {
  return null;
};

List.propTypes = {
  from: React.PropTypes.string,
  of: React.PropTypes.object,
  item: React.PropTypes.string,
  style: React.PropTypes.object,
  variable: React.PropTypes.string
};

var Text = function Text(_ref) {
  var dataBlock = _ref['data-block'];
  var lineBreak = _ref.lineBreak;
  var style = _ref.style;
  var text = _ref.text;

  var styleLine = { marginTop: lineBreak };

  return React__default.createElement(
    'div',
    { 'data-block': dataBlock, style: style },
    ('' + text).split('\n').map(function (t, i) {
      return React__default.createElement(
        'div',
        { key: i, style: i ? styleLine : undefined },
        t
      );
    })
  );
};

Text.defaultProps = {
  lineBreak: 10,
  style: {},
  text: ''
};

Text.propTypes = {
  lineBreak: React.PropTypes.number,
  style: React.PropTypes.object,
  text: React.PropTypes.string.isRequired
};

var PLACEHOLDER_PREFIXES$1 = ['::-webkit-input-placeholder', '::-moz-placeholder', ':-ms-input-placeholder', ':placeholder-shown'];

var Textarea = function (_Component) {
  inherits(Textarea, _Component);

  function Textarea() {
    classCallCheck(this, Textarea);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    var _this = possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args)));

    _this.id = 'Textarea-' + uniqueId();
    return _this;
  }

  Textarea.prototype.render = function render() {
    var id = this.id;
    var _props = this.props;
    var _ref = _props._ref;
    var stylePlaceholder = _props.stylePlaceholder;
    var styleHover = _props.styleHover;
    var styleFocus = _props.styleFocus;
    var styleDisabled = _props.styleDisabled;
    var text = _props.text;
    var rest = objectWithoutProperties(_props, ['_ref', 'stylePlaceholder', 'styleHover', 'styleFocus', 'styleDisabled', 'text']);


    var inlineStyle = [];
    if (stylePlaceholder) {
      PLACEHOLDER_PREFIXES$1.forEach(function (prefix) {
        inlineStyle.push('#' + id + prefix + ' {' + toCSS(stylePlaceholder) + '}');
      });
    }
    if (styleHover) {
      inlineStyle.push(inlineStyle + ' #' + id + ':hover {' + toCSS(styleHover) + '}');
    }
    if (styleFocus) {
      inlineStyle.push('#' + id + ':focus {' + toCSS(styleFocus) + '}');
    }
    if (styleDisabled) {
      inlineStyle.push('#' + id + ':disabled {' + toCSS(styleDisabled) + '}');
    }

    return React__default.createElement(
      'div',
      null,
      React__default.createElement(
        'style',
        null,
        inlineStyle.join('\n')
      ),
      React__default.createElement('textarea', _extends({}, rest, {
        defaultValue: text,
        id: id,
        ref: _ref
      }))
    );
  };

  return Textarea;
}(React.Component);

Textarea.defaultProps = {
  style: {},
  styleDisabled: {},
  styleFocus: {},
  stylePlaceholder: {},
  text: ''
};
Textarea.propTypes = {
  disabled: React.PropTypes.bool,
  placeholder: React.PropTypes.string,
  rows: React.PropTypes.number,
  style: React.PropTypes.object,
  styleDisabled: React.PropTypes.object,
  styleFocus: React.PropTypes.object,
  stylePlaceholder: React.PropTypes.object,
  text: React.PropTypes.string.isRequired
};

var vertical = createGroup('Vertical', { flexDirection: 'column' });

var Embed = function (_Component) {
  inherits(Embed, _Component);

  function Embed(props, context) {
    classCallCheck(this, Embed);

    var _this = possibleConstructorReturn(this, _Component.call(this, props, context));

    _this.state = {
      error: !!props.src === false,
      isLoading: !!props.src,
      isReady: false
    };
    return _this;
  }

  Embed.prototype.componentWillMount = function componentWillMount() {
    this.getEmbed(this.props.src);
  };

  Embed.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    if (this.props.src !== nextProps.src) {
      this.getEmbed(nextProps.src);
    }
  };

  Embed.prototype.getEmbed = function getEmbed(src) {
    var _this2 = this;

    fetch(src).then(function (res) {
      return res.json();
    }).then(function (data) {
      _this2.setState({
        data: data,
        isLoading: false,
        isReady: true,
        showCover: !!data.thumbnail_url
      });
    }).catch(function (err) {
      _this2.setState({
        error: true,
        message: err
      });
    });
  };

  Embed.prototype.render = function render() {
    var _this3 = this;

    var _state = this.state;
    var data = _state.data;
    var error = _state.error;
    var isLoading = _state.isLoading;
    var isReady = _state.isReady;
    var showCover = _state.showCover;
    var _props = this.props;
    var autoplay = _props.autoplay;
    var overCover = _props.overCover;
    var style = _props.style;
    var styleCover = _props.styleCover;
    var styleCoverWrapper = _props.styleCoverWrapper;
    var styleKnocking = _props.styleKnocking;


    var ret = void 0;
    if (isLoading) {
      ret = React__default.createElement(Knocking, { style: styleKnocking });
    } else if (isReady) {
      if (showCover && !autoplay) {
        ret = React__default.createElement(
          'div',
          { onClick: function onClick() {
              return _this3.setState({ showCover: false });
            }, style: styleCoverWrapper },
          overCover && React__default.createElement('img', overCover),
          React__default.createElement('img', { src: data.thumbnail_url, style: styleCover })
        );
      } else {
        ret = React__default.createElement('div', { dangerouslySetInnerHTML: { __html: data.html } });
      }
    } else if (error) {
      ret = React__default.createElement(
        'div',
        null,
        typeof message === 'undefined' ? 'Do you src in your props?' : message
      );
    }

    return React__default.createElement(
      'div',
      {
        'data-block': this.props['data-block'],
        style: style
      },
      ret
    );
  };

  return Embed;
}(React.Component);

Embed.defaultProps = {
  overCover: false
};
Embed.propTypes = {
  overCover: React.PropTypes.oneOfType([React.PropTypes.object, React.PropTypes.bool]),
  style: React.PropTypes.object,
  styleCover: React.PropTypes.object,
  styleCoverWrapper: React.PropTypes.object,
  styleKnocking: React.PropTypes.object
};

var whitelist = ['autopause', 'autoplay', 'byline', 'color', 'height', 'loop', 'maxheight', 'maxwidth', 'portrait', 'title', 'width'];

function asParams(params) {
  return Object.keys(params).map(function (k) {
    return k + '=' + params[k];
  }).join('&');
}

function createSrc(props) {
  var video = props.video;
  var rest = objectWithoutProperties(props, ['video']);


  var config = {
    autoplay: true,
    byline: false,
    title: false,
    url: 'https%3A//vimeo.com/' + video,
    width: 360
  };

  Object.keys(rest).forEach(function (key) {
    if (whitelist.indexOf(key) > -1) {
      config[key] = rest[key];
    }
  });

  return 'https://vimeo.com/api/oembed.json?' + asParams(config);
}

var Vimeo = function Vimeo(props) {
  return React__default.createElement(Embed, _extends({ src: createSrc(props) }, props));
};
Vimeo.propTypes = _extends({}, Embed.propTypes, {
  autoplay: React.PropTypes.bool,
  video: React.PropTypes.oneOfType([React.PropTypes.number, React.PropTypes.string])
});

exports.Font = Font;
exports.Horizontal = horizontal;
exports.Image = Image;
exports.Input = Input;
exports.Knocking = Knocking;
exports.List = List;
exports.Text = Text;
exports.Textarea = Textarea;
exports.Vertical = vertical;
exports.Vimeo = Vimeo;