import React__default, { createContext, Component, forwardRef, PureComponent, useRef, useState, useEffect } from 'react';
import { c as createCommonjsModule, a as commonjsGlobal, u as unwrapExports } from './_commonjsHelpers-0c4b6f40.js';
import PropTypes from 'prop-types';
import { _ as _slicedToArray } from './slicedToArray-6ebcbfea.js';
import { s as smoothscroll } from './smoothscroll-fa4e3f8c.js';
import urlFor from './urlFor.js';

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
  try {
    var info = gen[key](arg);
    var value = info.value;
  } catch (error) {
    reject(error);
    return;
  }

  if (info.done) {
    resolve(value);
  } else {
    Promise.resolve(value).then(_next, _throw);
  }
}

function _asyncToGenerator(fn) {
  return function () {
    var self = this,
        args = arguments;
    return new Promise(function (resolve, reject) {
      var gen = fn.apply(self, args);

      function _next(value) {
        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
      }

      function _throw(err) {
        asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
      }

      _next(undefined);
    });
  };
}

var asyncToGenerator = _asyncToGenerator;

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

var defineProperty = _defineProperty;

var canUseDOM = !!(
  typeof window !== 'undefined' &&
  window.document &&
  window.document.createElement
);

var canUseDom = canUseDOM;

function _objectWithoutPropertiesLoose(source, excluded) {
  if (source == null) return {};
  var target = {};
  var sourceKeys = Object.keys(source);
  var key, i;

  for (i = 0; i < sourceKeys.length; i++) {
    key = sourceKeys[i];
    if (excluded.indexOf(key) >= 0) continue;
    target[key] = source[key];
  }

  return target;
}

var objectWithoutPropertiesLoose = _objectWithoutPropertiesLoose;

function _objectWithoutProperties(source, excluded) {
  if (source == null) return {};
  var target = objectWithoutPropertiesLoose(source, excluded);
  var key, i;

  if (Object.getOwnPropertySymbols) {
    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);

    for (i = 0; i < sourceSymbolKeys.length; i++) {
      key = sourceSymbolKeys[i];
      if (excluded.indexOf(key) >= 0) continue;
      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
      target[key] = source[key];
    }
  }

  return target;
}

var objectWithoutProperties = _objectWithoutProperties;

var LoginStatus$1 = {
  CONNECTED: 'connected',
  AUTHORIZATION_EXPIRED: 'authorization_expired',
  NOT_AUTHORIZED: 'not_authorized',
  UNKNOWN: 'unknown'
};

function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(source, true).forEach(function (key) { defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
const Method = {
  GET: 'get',
  POST: 'post',
  DELETE: 'delete'
};
class Facebook$1 {
  constructor(options = {}) {
    this.options = _objectSpread$3({
      domain: 'connect.facebook.net',
      version: 'v3.2',
      cookie: false,
      status: false,
      xfbml: false,
      language: 'en_US',
      frictionlessRequests: false,
      debug: false,
      chatSupport: false
    }, options);

    if (!this.options.appId) {
      throw new Error('You need to set appId');
    }

    if (!this.options.wait) {
      this.init();
    }
  }

  getAppId() {
    return this.options.appId;
  }

  init() {
    var _this = this;

    return asyncToGenerator(function* () {
      if (_this.loadingPromise) {
        return _this.loadingPromise;
      }

      _this.loadingPromise = new Promise(resolve => {
        const _this$options = _this.options,
              {
          domain,
          language,
          debug,
          chatSupport
        } = _this$options,
              restOptions = objectWithoutProperties(_this$options, ["domain", "language", "debug", "chatSupport"]);

        window.fbAsyncInit = () => {
          window.FB.init({
            appId: restOptions.appId,
            version: restOptions.version,
            cookie: restOptions.cookie,
            status: restOptions.status,
            xfbml: restOptions.xfbml,
            frictionlessRequests: _this.frictionlessRequests
          });
          resolve(window.FB);
        };

        if (window.document.getElementById('facebook-jssdk')) {
          return resolve(window.FB);
        }

        const js = window.document.createElement('script');
        js.id = 'facebook-jssdk';
        js.async = true;
        js.defer = true;
        js.src = `https://${domain}/${language}/sdk${chatSupport ? '/xfbml.customerchat' : ''}${debug ? '/debug' : ''}.js`;
        window.document.body.appendChild(js);
      });
      return _this.loadingPromise;
    })();
  }

  process(method, before = [], after = []) {
    var _this2 = this;

    return asyncToGenerator(function* () {
      const fb = yield _this2.init();
      return new Promise((resolve, reject) => {
        fb[method](...before, response => {
          if (!response) {
            if (method === 'ui') return;
            reject(new Error('Response is undefined'));
          } else if (response.error) {
            const {
              code,
              type,
              message
            } = response.error;
            const error = new Error(message);
            error.code = code;
            error.type = type;
            reject(error);
          } else {
            resolve(response);
          }
        }, ...after);
      });
    })();
  }

  ui(options) {
    var _this3 = this;

    return asyncToGenerator(function* () {
      return _this3.process('ui', [options]);
    })();
  }

  api(path, method = Method.GET, params = {}) {
    var _this4 = this;

    return asyncToGenerator(function* () {
      return _this4.process('api', [path, method, params]);
    })();
  }

  login(opts = null) {
    var _this5 = this;

    return asyncToGenerator(function* () {
      return _this5.process('login', [], [opts]);
    })();
  }

  logout() {
    var _this6 = this;

    return asyncToGenerator(function* () {
      return _this6.process('logout');
    })();
  }

  getLoginStatus() {
    var _this7 = this;

    return asyncToGenerator(function* () {
      return _this7.process('getLoginStatus');
    })();
  }

  getAuthResponse() {
    var _this8 = this;

    return asyncToGenerator(function* () {
      return _this8.process('getAuthResponse');
    })();
  }

  getTokenDetail(loginResponse) {
    var _this9 = this;

    return asyncToGenerator(function* () {
      if (loginResponse.status === LoginStatus$1.CONNECTED && loginResponse.authResponse) {
        return loginResponse.authResponse;
      }

      const response = yield _this9.getLoginStatus();

      if (response.status === LoginStatus$1.CONNECTED && response.authResponse) {
        return response.authResponse;
      }

      throw new Error('Token is undefined');
    })();
  }

  getProfile(params) {
    var _this10 = this;

    return asyncToGenerator(function* () {
      return _this10.api('/me', Method.GET, params);
    })();
  }

  getTokenDetailWithProfile(params, response) {
    var _this11 = this;

    return asyncToGenerator(function* () {
      const tokenDetail = yield _this11.getTokenDetail(response);
      const profile = yield _this11.getProfile(params);
      return {
        profile,
        tokenDetail
      };
    })();
  }

  getToken() {
    var _this12 = this;

    return asyncToGenerator(function* () {
      const authResponse = yield _this12.getTokenDetail();
      return authResponse.accessToken;
    })();
  }

  getUserId() {
    var _this13 = this;

    return asyncToGenerator(function* () {
      const authResponse = yield _this13.getTokenDetail();
      return authResponse.userID;
    })();
  }

  sendInvite(to, options) {
    var _this14 = this;

    return asyncToGenerator(function* () {
      return _this14.ui(_objectSpread$3({
        to,
        method: 'apprequests'
      }, options));
    })();
  }

  postAction(ogNamespace, ogAction, ogObject, ogObjectUrl, noFeedStory) {
    var _this15 = this;

    return asyncToGenerator(function* () {
      let url = `/me/${ogNamespace}:${ogAction}?${ogObject}=${encodeURIComponent(ogObjectUrl)}`;

      if (noFeedStory === true) {
        url += '&no_feed_story=true';
      }

      return _this15.api(url, Method.POST);
    })();
  }

  getPermissions() {
    var _this16 = this;

    return asyncToGenerator(function* () {
      const response = yield _this16.api('/me/permissions');
      return response.data;
    })();
  }

  hasPermissions(permissions) {
    var _this17 = this;

    return asyncToGenerator(function* () {
      const usersPermissions = yield _this17.getPermissions();
      const findedPermissions = permissions.filter(p => {
        const currentPermission = usersPermissions.find(row => {
          const {
            permission,
            status
          } = row;
          return status === 'granted' && permission === p;
        });
        return !!currentPermission;
      });
      return findedPermissions.length === permissions.length;
    })();
  }

  subscribe(eventName, callback) {
    var _this18 = this;

    return asyncToGenerator(function* () {
      const fb = yield _this18.init();
      fb.Event.subscribe(eventName, callback);
    })();
  }

  unsubscribe(eventName, callback) {
    var _this19 = this;

    return asyncToGenerator(function* () {
      const fb = yield _this19.init();
      fb.Event.unsubscribe(eventName, callback);
    })();
  }

  parse(parentNode) {
    var _this20 = this;

    return asyncToGenerator(function* () {
      const fb = yield _this20.init();

      if (typeof parentNode === 'undefined') {
        fb.XFBML.parse();
      } else {
        fb.XFBML.parse(parentNode);
      }
    })();
  }

  getRequests() {
    var _this21 = this;

    return asyncToGenerator(function* () {
      return _this21.api('/me/apprequests');
    })();
  }

  removeRequest(requestID) {
    var _this22 = this;

    return asyncToGenerator(function* () {
      return _this22.api(requestID, Method.DELETE);
    })();
  }

  setAutoGrow() {
    var _this23 = this;

    return asyncToGenerator(function* () {
      const fb = yield _this23.init();
      fb.Canvas.setAutoGrow();
    })();
  }

  paySimple(product, quantity = 1) {
    var _this24 = this;

    return asyncToGenerator(function* () {
      return _this24.ui({
        method: 'pay',
        action: 'purchaseitem',
        product,
        quantity
      });
    })();
  }

  pay(product, options) {
    var _this25 = this;

    return asyncToGenerator(function* () {
      return _this25.ui(_objectSpread$3({
        method: 'pay',
        action: 'purchaseitem',
        product
      }, options));
    })();
  }

}
/*
  sendToFriends: function(options, callback) {
    if(!options) {
      options = {};
    }

    options.method = 'send';

    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.ui(options, function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  sendMessage: function(message, name, caption, description, url, imgUrl, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.ui({
        method: 'stream.publish',
        message: message,
        attachment: {
          name: name,
          caption: caption,
          description: description,
          href: url,
          media:[{
            type: 'image',
            src:  imgUrl,
            href: url
          }]
        },
        action_links: [{
          text: 'Code',
          href: url
        }],
        user_prompt_message: message
      },
      function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  sendInviteForm: function(options, callback) {
    if(typeof options === 'function') {
      callback = options;
      options = {};
    }

    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      options.method = options.method || 'apprequests';


      FB.ui(options, function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  checkPageLike: function(pageID, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      fbApi.getUserID(function(err, userID) {
        if(err) {
          return callback(err);
        }

        var fqlQuery = `SELECT uid FROM page_fan WHERE page_id = ${pageID} and uid = ${userID}`;
        var query = FB.Data.query(fqlQuery);

        query.wait(function(rows) {
          if (rows.length === 1 && rows[0].uid === userID) {
            callback(null, true, query);
          }
          else {
            callback(null, false, query);
          }
        });
      });
    });
  },

  sendMessageToFriend: function (friendID, link, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.ui({
        to: friendID,
        method: 'send',
        link: link
      }, function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  _prepareUsers: function(data) {
    var users=[];

    for(var index in data) {
      var userData=data[index];

      var user = {
        provider_uid: 'facebook'+'_'+userData.uid,
        provider: 'facebook',
        id: userData.uid,
        name: userData.name,
        first_name: userData.first_name,
        last_name: userData.last_name,
        status: (userData.status!==null) ? userData.status : null,
        image: '//graph.facebook.com/'+userData.uid+'/picture?'
      };

      users.push(user);
    }

    return users;
  },

  getUserList: function(callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('fql', {
        q: `
          SELECT uid, name, first_name, last_name, online_presence, status
          FROM user
          WHERE uid IN
            ( SELECT uid2 FROM friend WHERE uid1 = me()) ORDER BY name
        `,
      }, function (response)
      {
        var users = fbApi._prepareUsers(response.data);
        callback(null, users, response);
      });
    });
  },

  postFeed: function(options, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      options.method='feed';

      FB.ui(options, function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //need publish_stream
  createAlbum: function(name, description, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/me/albums', 'post', {
        name: name,
        description: description
      },function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //need publish_stream
  addImageToAlbum: function(albumID, imageURL, message, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/'+albumID+'/photos', 'post', {
        message: message,
        url: imageURL
      }, function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //'user_photos'
  getAlbums: function(callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/me/albums', function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //'user_photos'
  getAlbumPhotos: function(albumID, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/'+albumID+'/photos', function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //'user_photos'
  getAlbumCoverPicture: function(albumID, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/'+albumID+'/picture', function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  //'publish_stream'
  postPhoto: function(photoUrl, message, callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.api('/me/photos', 'post', {
        message: message,
        url: photoUrl
      },function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  },

  getPageInfo: function(callback) {
    this.afterLoad(function(err, fbApi) {
      if(err) {
        return callback(err);
      }

      FB.Canvas.getPageInfo(function(response) {
        fbApi._callCallbackByResponse(callback, response);
      });
    });
  }
*/

var FacebookContext = createContext();

let api = null;
class Facebook extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "state", {
      isReady: false
    });

    defineProperty(this, "handleInit",
    /*#__PURE__*/
    asyncToGenerator(function* () {
      // do not run if SSR
      if (!canUseDom) {
        throw new Error('You can not use Facebook without DOM');
      }

      const {
        isReady
      } = _this.state;

      if (isReady) {
        return api;
      }

      if (!api) {
        const {
          domain,
          version,
          appId,
          cookie,
          status,
          xfbml,
          language,
          frictionlessRequests,
          wait,
          debug,
          chatSupport
        } = _this.props;
        api = new Facebook$1({
          domain,
          appId,
          version,
          cookie,
          status,
          xfbml,
          language,
          frictionlessRequests,
          wait,
          debug,
          chatSupport
        });
      }

      yield api.init();

      if (!_this.state.isReady) {
        _this.setState({
          isReady: true
        });
      }

      return api;
    }));
  }

  componentDidMount() {
    const {
      wait
    } = this.props;

    if (!wait) {
      this.handleInit();
    }
  }

  render() {
    const {
      children
    } = this.props;
    const {
      isReady,
      error
    } = this.state;
    const {
      handleInit
    } = this;
    const value = {
      isReady,
      error,
      handleInit,
      api
    };
    return React__default.createElement(FacebookContext.Provider, {
      value: value
    }, children);
  }

}

defineProperty(Facebook, "defaultProps", {
  version: 'v3.1',
  cookie: false,
  status: false,
  xfbml: false,
  language: 'en_US',
  frictionlessRequests: false,
  domain: 'connect.facebook.net',
  children: undefined,
  wait: false,
  debug: false,
  chatSupport: false
});

var _extends_1 = createCommonjsModule(function (module) {
function _extends() {
  module.exports = _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;
  };

  return _extends.apply(this, arguments);
}

module.exports = _extends;
});

class Initialize extends Component {
  componentDidMount() {
    this.$isMounted = true;
    this.prepare();
  }

  componentWillUnmount() {
    this.$isMounted = false;
  }

  prepare() {
    var _this = this;

    return asyncToGenerator(function* () {
      const {
        onReady,
        handleInit
      } = _this.props;
      const api = yield handleInit();

      if (onReady && _this.$isMounted) {
        onReady(api);
      }
    })();
  }

  render() {
    const {
      children,
      isReady,
      api
    } = this.props;
    const childrenProps = {
      isReady,
      api
    };

    if (typeof children === 'function') {
      return children(childrenProps);
    }

    return children;
  }

}

defineProperty(Initialize, "defaultProps", {
  onReady: undefined,
  api: undefined
});

var Initialize$1 = forwardRef((props, ref) => React__default.createElement(FacebookContext.Consumer, null, ({
  handleInit,
  isReady,
  api
}) => React__default.createElement(Initialize, _extends_1({}, props, {
  handleInit: handleInit,
  isReady: isReady,
  api: api,
  ref: ref
}))));

class Parser extends Component {
  constructor(...args) {
    super(...args);

    defineProperty(this, "state", {});

    defineProperty(this, "handleReady", api => {
      this.setState({
        api
      }, this.handleParse);
    });

    defineProperty(this, "handleContainer", container => {
      this.setState({
        container
      }, this.handleParse);
    });

    defineProperty(this, "handleParse", () => {
      const {
        api,
        container
      } = this.state;

      if (!api || !container) {
        return;
      }

      api.parse(container);
    });
  }

  render() {
    const {
      className,
      children
    } = this.props;
    return React__default.createElement("div", {
      className: className,
      ref: this.handleContainer
    }, React__default.createElement(Initialize$1, {
      onReady: this.handleReady
    }, children({
      handleParse: this.handleParse
    })));
  }

}

defineProperty(Parser, "defaultProps", {
  className: undefined
});

function getCurrentHref() {
  if (!canUseDom) {
    return 'https://www.facebook.com';
  }

  return window.location.href;
}

class Like extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      href = getCurrentHref(),
      layout,
      colorScheme,
      action,
      showFaces,
      share,
      children,
      width,
      size,
      kidDirectedSite,
      referral
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-like",
      "data-ref": referral,
      "data-href": href,
      "data-layout": layout,
      "data-colorscheme": colorScheme,
      "data-action": action,
      "data-show-faces": showFaces,
      "data-share": share,
      "data-width": width,
      "data-size": size,
      "data-kid-directed-site": kidDirectedSite
    }, children);
  }

}

defineProperty(Like, "defaultProps", {
  layout: undefined,
  showFaces: undefined,
  colorScheme: undefined,
  action: undefined,
  share: undefined,
  size: undefined,
  kidDirectedSite: undefined,
  children: undefined,
  href: undefined,
  referral: undefined,
  width: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(Like, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

function clearUndefinedProperties(obj) {
  if (!obj) {
    return obj;
  }

  const newObj = {};
  Object.keys(obj).forEach(propertyName => {
    const value = obj[propertyName];

    if (value !== undefined) {
      newObj[propertyName] = value;
    }
  });
  return newObj;
}

class Process extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "state", {
      api: undefined
    });

    defineProperty(this, "handleProcess",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (fn, handleSuccess = () => {}) {
        _this.setState({
          data: undefined,
          error: undefined,
          loading: true
        });

        try {
          const {
            api
          } = _this.state;

          if (!api) {
            throw new Error('Facebook is not initialized. Wait for isReady');
          }

          const data = yield fn(api);

          _this.setState({
            data,
            loading: false
          }, handleSuccess);

          return data;
        } catch (error) {
          _this.setState({
            error,
            loading: false
          });

          throw error;
        }
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());

    defineProperty(this, "handleReady", api => {
      this.setState({
        api
      });
    });
  }

  render() {
    const {
      children
    } = this.props;
    const {
      api,
      loading,
      data,
      error
    } = this.state;
    return React__default.createElement(Initialize$1, {
      onReady: this.handleReady
    }, children({
      loading: !api || loading,
      handleProcess: this.handleProcess,
      data,
      error
    }));
  }

}

class Send extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "handleClick",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (evn) {
        evn.preventDefault();
        const {
          handleProcess
        } = _this.props;
        return handleProcess(
        /*#__PURE__*/
        function () {
          var _ref2 = asyncToGenerator(function* (api) {
            const {
              link = getCurrentHref(),
              display,
              appId = api.getAppId(),
              to,
              redirectURI
            } = _this.props;
            return api.ui(clearUndefinedProperties({
              method: 'send',
              link,
              display,
              app_id: appId,
              to,
              redirect_uri: redirectURI
            }));
          });

          return function (_x2) {
            return _ref2.apply(this, arguments);
          };
        }());
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());
  }

  render() {
    const {
      children,
      loading
    } = this.props;
    return children({
      loading,
      handleClick: this.handleClick
    });
  }

}

defineProperty(Send, "defaultProps", {
  to: undefined,
  display: undefined,
  appId: undefined,
  redirectURI: undefined
});

forwardRef((props, ref) => React__default.createElement(Process, null, ({
  loading,
  handleProcess
}) => React__default.createElement(Send, _extends_1({}, props, {
  loading: loading,
  handleProcess: handleProcess,
  ref: ref
}))));

class Share extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "handleClick",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (evn) {
        evn.preventDefault();
        const {
          handleProcess
        } = _this.props;
        return handleProcess(
        /*#__PURE__*/
        function () {
          var _ref2 = asyncToGenerator(function* (api) {
            const {
              href = getCurrentHref(),
              display,
              appId = api.getAppId(),
              hashtag,
              redirectURI,
              quote,
              mobileIframe
            } = _this.props;
            return api.ui(clearUndefinedProperties({
              method: 'share',
              href,
              display,
              app_id: appId,
              hashtag,
              redirect_uri: redirectURI,
              quote,
              mobile_iframe: mobileIframe
            }));
          });

          return function (_x2) {
            return _ref2.apply(this, arguments);
          };
        }());
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());
  }

  render() {
    const {
      children,
      loading,
      error,
      data
    } = this.props;
    return children({
      loading,
      handleClick: this.handleClick,
      error,
      data
    });
  }

}

defineProperty(Share, "defaultProps", {
  href: undefined,
  hashtag: undefined,
  quote: undefined,
  mobileIframe: undefined,
  display: undefined,
  appId: undefined,
  redirectURI: undefined
});

var Share$1 = forwardRef((props, ref) => React__default.createElement(Process, null, ({
  loading,
  handleProcess,
  data,
  error
}) => React__default.createElement(Share, _extends_1({}, props, {
  loading: loading,
  handleProcess: handleProcess,
  data: data,
  error: error,
  ref: ref
}))));

function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(source, true).forEach(function (key) { defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
_objectSpread$2({}, Share$1.defaultProps, {
  className: undefined
});

class Page extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      style,
      href = getCurrentHref(),
      tabs,
      hideCover,
      width,
      height,
      showFacepile,
      hideCTA,
      smallHeader,
      adaptContainerWidth,
      children
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-page",
      style: style,
      "data-tabs": tabs,
      "data-hide-cover": hideCover,
      "data-show-facepile": showFacepile,
      "data-hide-cta": hideCTA,
      "data-href": href,
      "data-small-header": smallHeader,
      "data-adapt-container-width": adaptContainerWidth,
      "data-height": height,
      "data-width": width
    }, children);
  }

}

defineProperty(Page, "defaultProps", {
  width: undefined,
  height: undefined,
  tabs: undefined,
  hideCover: undefined,
  showFacepile: undefined,
  hideCTA: undefined,
  smallHeader: undefined,
  adaptContainerWidth: undefined,
  children: undefined,
  style: undefined,
  href: undefined
});

var Page$1 = forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(Page, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

// 3.0 fields without app review https://developers.facebook.com/docs/facebook-login/permissions/?locale=en_US#reference-default
var Fields = ['id', 'first_name', 'last_name', 'middle_name', 'name', 'name_format', 'picture', 'short_name', 'email'];

function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(source, true).forEach(function (key) { defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

class Login extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "handleClick",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (evn) {
        evn.preventDefault();
        const {
          handleProcess,
          onCompleted,
          onError,
          onSuccess
        } = _this.props;

        try {
          yield handleProcess(
          /*#__PURE__*/
          function () {
            var _ref2 = asyncToGenerator(function* (api) {
              const {
                scope,
                fields,
                returnScopes,
                rerequest,
                reauthorize,
                eventKey
              } = _this.props;
              const loginQpts = {
                scope
              };
              const authType = [];

              if (returnScopes) {
                loginQpts.return_scopes = true;
              }

              if (rerequest) {
                authType.push('rerequest');
              }

              if (reauthorize) {
                authType.push('reauthenticate');
              }

              if (authType.length) {
                loginQpts.auth_type = authType.join(',');
              }

              const loginResponse = yield api.login(loginQpts);

              if (loginResponse.status !== 'connected') {
                throw new Error('Unauthorized user');
              }

              const data = yield api.getTokenDetailWithProfile({
                fields
              }, loginResponse);

              if (onCompleted) {
                yield onCompleted(_objectSpread$1({}, data, {
                  eventKey
                }));
              }

              return data;
            });

            return function (_x2) {
              return _ref2.apply(this, arguments);
            };
          }(), onSuccess);
        } catch (error) {
          if (onError) {
            onError(error);
          }
        }
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());
  }

  render() {
    const {
      children,
      loading,
      error,
      data
    } = this.props;
    return children({
      loading,
      handleClick: this.handleClick,
      error,
      data
    });
  }

}

defineProperty(Login, "defaultProps", {
  scope: '',
  fields: Fields,
  returnScopes: false,
  rerequest: false,
  reauthorize: false,
  onCompleted: undefined,
  onError: undefined,
  eventKey: undefined
});

var Login$1 = forwardRef((props, ref) => React__default.createElement(Process, null, ({
  loading,
  handleProcess,
  data,
  error
}) => React__default.createElement(Login, _extends_1({}, props, {
  loading: loading,
  handleProcess: handleProcess,
  data: data,
  error: error,
  ref: ref
}))));

var spin = createCommonjsModule(function (module) {
(function (root, factory) {

  /* CommonJS */
  if (module.exports) module.exports = factory();

  /* AMD module */
  else root.Spinner = factory();
}(commonjsGlobal, function () {

  var prefixes = ['webkit', 'Moz', 'ms', 'O'] /* Vendor prefixes */
    , animations = {} /* Animation rules keyed by their name */
    , useCssAnimations /* Whether to use CSS animations or setTimeout */
    , sheet; /* A stylesheet to hold the @keyframe or VML rules. */

  /**
   * Utility function to create elements. If no tag name is given,
   * a DIV is created. Optionally properties can be passed.
   */
  function createEl (tag, prop) {
    var el = document.createElement(tag || 'div')
      , n;

    for (n in prop) el[n] = prop[n];
    return el
  }

  /**
   * Appends children and returns the parent.
   */
  function ins (parent /* child1, child2, ...*/) {
    for (var i = 1, n = arguments.length; i < n; i++) {
      parent.appendChild(arguments[i]);
    }

    return parent
  }

  /**
   * Creates an opacity keyframe animation rule and returns its name.
   * Since most mobile Webkits have timing issues with animation-delay,
   * we create separate rules for each line/segment.
   */
  function addAnimation (alpha, trail, i, lines) {
    var name = ['opacity', trail, ~~(alpha * 100), i, lines].join('-')
      , start = 0.01 + i/lines * 100
      , z = Math.max(1 - (1-alpha) / trail * (100-start), alpha)
      , prefix = useCssAnimations.substring(0, useCssAnimations.indexOf('Animation')).toLowerCase()
      , pre = prefix && '-' + prefix + '-' || '';

    if (!animations[name]) {
      sheet.insertRule(
        '@' + pre + 'keyframes ' + name + '{' +
        '0%{opacity:' + z + '}' +
        start + '%{opacity:' + alpha + '}' +
        (start+0.01) + '%{opacity:1}' +
        (start+trail) % 100 + '%{opacity:' + alpha + '}' +
        '100%{opacity:' + z + '}' +
        '}', sheet.cssRules.length);

      animations[name] = 1;
    }

    return name
  }

  /**
   * Tries various vendor prefixes and returns the first supported property.
   */
  function vendor (el, prop) {
    var s = el.style
      , pp
      , i;

    prop = prop.charAt(0).toUpperCase() + prop.slice(1);
    if (s[prop] !== undefined) return prop
    for (i = 0; i < prefixes.length; i++) {
      pp = prefixes[i]+prop;
      if (s[pp] !== undefined) return pp
    }
  }

  /**
   * Sets multiple style properties at once.
   */
  function css (el, prop) {
    for (var n in prop) {
      el.style[vendor(el, n) || n] = prop[n];
    }

    return el
  }

  /**
   * Fills in default values.
   */
  function merge (obj) {
    for (var i = 1; i < arguments.length; i++) {
      var def = arguments[i];
      for (var n in def) {
        if (obj[n] === undefined) obj[n] = def[n];
      }
    }
    return obj
  }

  /**
   * Returns the line color from the given string or array.
   */
  function getColor (color, idx) {
    return typeof color == 'string' ? color : color[idx % color.length]
  }

  // Built-in defaults

  var defaults = {
    lines: 12             // The number of lines to draw
  , length: 7             // The length of each line
  , width: 5              // The line thickness
  , radius: 10            // The radius of the inner circle
  , scale: 1.0            // Scales overall size of the spinner
  , corners: 1            // Roundness (0..1)
  , color: '#000'         // #rgb or #rrggbb
  , opacity: 1/4          // Opacity of the lines
  , rotate: 0             // Rotation offset
  , direction: 1          // 1: clockwise, -1: counterclockwise
  , speed: 1              // Rounds per second
  , trail: 100            // Afterglow percentage
  , fps: 20               // Frames per second when using setTimeout()
  , zIndex: 2e9           // Use a high z-index by default
  , className: 'spinner'  // CSS class to assign to the element
  , top: '50%'            // center vertically
  , left: '50%'           // center horizontally
  , shadow: false         // Whether to render a shadow
  , hwaccel: false        // Whether to use hardware acceleration (might be buggy)
  , position: 'absolute'  // Element positioning
  };

  /** The constructor */
  function Spinner (o) {
    this.opts = merge(o || {}, Spinner.defaults, defaults);
  }

  // Global defaults that override the built-ins:
  Spinner.defaults = {};

  merge(Spinner.prototype, {
    /**
     * Adds the spinner to the given target element. If this instance is already
     * spinning, it is automatically removed from its previous target b calling
     * stop() internally.
     */
    spin: function (target) {
      this.stop();

      var self = this
        , o = self.opts
        , el = self.el = createEl(null, {className: o.className});

      css(el, {
        position: o.position
      , width: 0
      , zIndex: o.zIndex
      , left: o.left
      , top: o.top
      });

      if (target) {
        target.insertBefore(el, target.firstChild || null);
      }

      el.setAttribute('role', 'progressbar');
      self.lines(el, self.opts);

      if (!useCssAnimations) {
        // No CSS animation support, use setTimeout() instead
        var i = 0
          , start = (o.lines - 1) * (1 - o.direction) / 2
          , alpha
          , fps = o.fps
          , f = fps / o.speed
          , ostep = (1 - o.opacity) / (f * o.trail / 100)
          , astep = f / o.lines

        ;(function anim () {
          i++;
          for (var j = 0; j < o.lines; j++) {
            alpha = Math.max(1 - (i + (o.lines - j) * astep) % f * ostep, o.opacity);

            self.opacity(el, j * o.direction + start, alpha, o);
          }
          self.timeout = self.el && setTimeout(anim, ~~(1000 / fps));
        })();
      }
      return self
    }

    /**
     * Stops and removes the Spinner.
     */
  , stop: function () {
      var el = this.el;
      if (el) {
        clearTimeout(this.timeout);
        if (el.parentNode) el.parentNode.removeChild(el);
        this.el = undefined;
      }
      return this
    }

    /**
     * Internal method that draws the individual lines. Will be overwritten
     * in VML fallback mode below.
     */
  , lines: function (el, o) {
      var i = 0
        , start = (o.lines - 1) * (1 - o.direction) / 2
        , seg;

      function fill (color, shadow) {
        return css(createEl(), {
          position: 'absolute'
        , width: o.scale * (o.length + o.width) + 'px'
        , height: o.scale * o.width + 'px'
        , background: color
        , boxShadow: shadow
        , transformOrigin: 'left'
        , transform: 'rotate(' + ~~(360/o.lines*i + o.rotate) + 'deg) translate(' + o.scale*o.radius + 'px' + ',0)'
        , borderRadius: (o.corners * o.scale * o.width >> 1) + 'px'
        })
      }

      for (; i < o.lines; i++) {
        seg = css(createEl(), {
          position: 'absolute'
        , top: 1 + ~(o.scale * o.width / 2) + 'px'
        , transform: o.hwaccel ? 'translate3d(0,0,0)' : ''
        , opacity: o.opacity
        , animation: useCssAnimations && addAnimation(o.opacity, o.trail, start + i * o.direction, o.lines) + ' ' + 1 / o.speed + 's linear infinite'
        });

        if (o.shadow) ins(seg, css(fill('#000', '0 0 4px #000'), {top: '2px'}));
        ins(el, ins(seg, fill(getColor(o.color, i), '0 0 1px rgba(0,0,0,.1)')));
      }
      return el
    }

    /**
     * Internal method that adjusts the opacity of a single line.
     * Will be overwritten in VML fallback mode below.
     */
  , opacity: function (el, i, val) {
      if (i < el.childNodes.length) el.childNodes[i].style.opacity = val;
    }

  });


  function initVML () {

    /* Utility function to create a VML tag */
    function vml (tag, attr) {
      return createEl('<' + tag + ' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">', attr)
    }

    // No CSS transforms but VML support, add a CSS rule for VML elements:
    sheet.addRule('.spin-vml', 'behavior:url(#default#VML)');

    Spinner.prototype.lines = function (el, o) {
      var r = o.scale * (o.length + o.width)
        , s = o.scale * 2 * r;

      function grp () {
        return css(
          vml('group', {
            coordsize: s + ' ' + s
          , coordorigin: -r + ' ' + -r
          })
        , { width: s, height: s }
        )
      }

      var margin = -(o.width + o.length) * o.scale * 2 + 'px'
        , g = css(grp(), {position: 'absolute', top: margin, left: margin})
        , i;

      function seg (i, dx, filter) {
        ins(
          g
        , ins(
            css(grp(), {rotation: 360 / o.lines * i + 'deg', left: ~~dx})
          , ins(
              css(
                vml('roundrect', {arcsize: o.corners})
              , { width: r
                , height: o.scale * o.width
                , left: o.scale * o.radius
                , top: -o.scale * o.width >> 1
                , filter: filter
                }
              )
            , vml('fill', {color: getColor(o.color, i), opacity: o.opacity})
            , vml('stroke', {opacity: 0}) // transparent stroke to fix color bleeding upon opacity change
            )
          )
        );
      }

      if (o.shadow)
        for (i = 1; i <= o.lines; i++) {
          seg(i, -2, 'progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)');
        }

      for (i = 1; i <= o.lines; i++) seg(i);
      return ins(el, g)
    };

    Spinner.prototype.opacity = function (el, i, val, o) {
      var c = el.firstChild;
      o = o.shadow && o.lines || 0;
      if (c && i + o < c.childNodes.length) {
        c = c.childNodes[i + o]; c = c && c.firstChild; c = c && c.firstChild;
        if (c) c.opacity = val;
      }
    };
  }

  if (typeof document !== 'undefined') {
    sheet = (function () {
      var el = createEl('style', {type : 'text/css'});
      ins(document.getElementsByTagName('head')[0], el);
      return el.sheet || el.styleSheet
    }());

    var probe = css(createEl('group'), {behavior: 'url(#default#VML)'});

    if (!vendor(probe, 'transform') && probe.adj) initVML();
    else useCssAnimations = vendor(probe, 'animation');
  }

  return Spinner

}));
});

var dist = createCommonjsModule(function (module, exports) {

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

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();



var _react2 = _interopRequireDefault(React__default);



var _propTypes2 = _interopRequireDefault(PropTypes);



var _spin2 = _interopRequireDefault(spin);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

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

function _possibleConstructorReturn(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; }

function _inherits(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 Spinner = function (_Component) {
  _inherits(Spinner, _Component);

  function Spinner() {
    _classCallCheck(this, Spinner);

    return _possibleConstructorReturn(this, (Spinner.__proto__ || Object.getPrototypeOf(Spinner)).apply(this, arguments));
  }

  _createClass(Spinner, [{
    key: 'componentDidMount',
    value: function componentDidMount() {
      this.updateSpinner();
    }
  }, {
    key: 'componentDidUpdate',
    value: function componentDidUpdate() {
      this.updateSpinner();
    }
  }, {
    key: 'componentWillUnmount',
    value: function componentWillUnmount() {
      if (this.spinner) {
        this.spinner.stop();
        this.spinner = null;
      }
    }
  }, {
    key: 'updateSpinner',
    value: function updateSpinner() {
      var loaded = this.props.loaded;

      if (!loaded && !this.spinner) {
        this.spinner = new _spin2.default(this.props.config);
        this.spinner.spin(this.refs.loader);
      } else if (loaded && this.spinner) {
        this.spinner.stop();
        this.spinner = null;
      }
    }
  }, {
    key: 'render',
    value: function render() {
      var _props = this.props,
          loaded = _props.loaded,
          className = _props.className;


      if (loaded) {
        return this.props.children ? React__default.Children.only(this.props.children) : null;
      }

      return _react2.default.createElement('div', { className: className, ref: 'loader' });
    }
  }]);

  return Spinner;
}(React__default.Component);

Spinner.propTypes = {
  className: _propTypes2.default.string,
  config: _propTypes2.default.object.isRequired,
  loaded: _propTypes2.default.bool.isRequired,
  children: _propTypes2.default.node
};
Spinner.defaultProps = {
  config: {},
  loaded: false,
  className: 'loader'
};
exports.default = Spinner;
});

unwrapExports(dist);

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
_objectSpread({}, Login$1.defaultProps, {
  className: undefined,
  spinnerConfig: {},
  spinner: true
});

class EmbeddedPost extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      href,
      width,
      showText,
      children
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-post",
      "data-href": href,
      "data-width": width,
      "data-show-text": showText
    }, children);
  }

}

defineProperty(EmbeddedPost, "defaultProps", {
  width: undefined,
  showText: undefined,
  children: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(EmbeddedPost, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class EmbeddedVideo extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      href,
      width,
      showText,
      allowFullScreen,
      autoPlay,
      showCaptions,
      children
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-video",
      "data-href": href,
      "data-width": width,
      "data-show-text": showText,
      "data-show-captions": showCaptions,
      "data-autoplay": autoPlay,
      "data-allowfullscreen": allowFullScreen
    }, children);
  }

}

defineProperty(EmbeddedVideo, "defaultProps", {
  width: undefined,
  showText: undefined,
  allowFullScreen: undefined,
  autoPlay: undefined,
  showCaptions: undefined,
  children: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(EmbeddedVideo, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class Comments extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      colorScheme,
      href = getCurrentHref(),
      numPosts,
      orderBy,
      width,
      children,
      mobile
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-comments",
      "data-colorscheme": colorScheme,
      "data-numposts": numPosts,
      "data-href": href,
      "data-order-by": orderBy,
      "data-width": width,
      "data-skin": colorScheme,
      "data-mobile": mobile
    }, children);
  }

}

defineProperty(Comments, "defaultProps", {
  href: undefined,
  numPosts: undefined,
  orderBy: undefined,
  width: undefined,
  colorScheme: undefined,
  children: undefined,
  mobile: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(Comments, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class CommentsCount extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      href = getCurrentHref(),
      children
    } = this.props;
    return React__default.createElement("span", {
      className: "fb-comments-count",
      "data-href": href
    }, children);
  }

}

defineProperty(CommentsCount, "defaultProps", {
  href: undefined,
  children: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(CommentsCount, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class Feed extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "handleClick",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (evn) {
        evn.preventDefault();
        const {
          handleProcess
        } = _this.props;
        return handleProcess(
        /*#__PURE__*/
        function () {
          var _ref2 = asyncToGenerator(function* (api) {
            const {
              link = getCurrentHref(),
              display,
              appId = api.getAppId(),
              redirectURI,
              from,
              to,
              picture,
              source,
              name,
              caption,
              description,
              dataRef
            } = _this.props;
            return api.ui(clearUndefinedProperties({
              method: 'feed',
              link,
              display,
              app_id: appId,
              redirect_uri: redirectURI,
              from,
              to,
              picture,
              source,
              name,
              caption,
              description,
              ref: dataRef
            }));
          });

          return function (_x2) {
            return _ref2.apply(this, arguments);
          };
        }());
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());
  }

  render() {
    const {
      children,
      loading,
      error,
      data
    } = this.props;
    return children({
      loading,
      handleClick: this.handleClick,
      error,
      data
    });
  }

}

defineProperty(Feed, "defaultProps", {
  link: undefined,
  display: undefined,
  appId: undefined,
  redirectURI: undefined,
  from: undefined,
  to: undefined,
  source: undefined,
  picture: undefined,
  name: undefined,
  caption: undefined,
  description: undefined,
  dataRef: undefined
});

forwardRef((props, ref) => React__default.createElement(Process, null, ({
  loading,
  handleProcess,
  error,
  data
}) => React__default.createElement(Feed, _extends_1({}, props, {
  loading: loading,
  handleProcess: handleProcess,
  data: data,
  error: error,
  ref: ref
}))));

class Group extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      style,
      href = getCurrentHref(),
      width,
      showSocialContext,
      showMetaData,
      children,
      skin
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-group",
      style: style,
      "data-href": href,
      "data-width": width,
      "data-show-social-context": showSocialContext,
      "data-show-metadata": showMetaData,
      "data-skin": skin
    }, children);
  }

}

defineProperty(Group, "defaultProps", {
  showSocialContext: undefined,
  showMetaData: undefined,
  width: undefined,
  children: undefined,
  style: undefined,
  href: undefined,
  skin: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(Group, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class LoginStatus extends Component {
  constructor(..._args) {
    var _this;

    super(..._args);
    _this = this;

    defineProperty(this, "state", {});

    defineProperty(this, "handleReady",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (api) {
        const {
          event
        } = _this.props;

        _this.setState({
          api
        });

        yield api.subscribe(event, _this.handleChange);
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());

    defineProperty(this, "handleChange", (...args) => {
      const {
        onChange
      } = this.props;

      if (onChange) {
        onChange(...args);
      }
    });
  }

  componentWillUnmount() {
    const {
      state: {
        api
      },
      props: {
        event
      }
    } = this;

    if (api) {
      api.unsubscribe(event, this.handleChange);
    }
  }

  render() {
    const {
      children
    } = this.props;
    return React__default.createElement(Initialize$1, {
      onReady: this.handleReady
    }, children);
  }

}

defineProperty(LoginStatus, "defaultProps", {
  onChange: undefined
});

class Profile extends Component {
  constructor(...args) {
    var _this;

    super(...args);
    _this = this;

    defineProperty(this, "state", {
      loading: true
    });

    defineProperty(this, "handleReady",
    /*#__PURE__*/
    function () {
      var _ref = asyncToGenerator(function* (api) {
        _this.api = api;

        _this.updateProfile();
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    }());

    defineProperty(this, "handleStatusChange", () => {
      this.updateProfile();
    });
  }

  updateProfile() {
    var _this2 = this;

    return asyncToGenerator(function* () {
      const {
        api,
        props: {
          fields
        }
      } = _this2;

      if (!api) {
        return;
      }

      try {
        const response = yield api.getLoginStatus();

        if (response.status !== LoginStatus$1.CONNECTED) {
          _this2.setState({
            profile: undefined,
            loading: false,
            error: undefined
          });

          return;
        }

        const profile = yield api.getProfile({
          fields
        });

        _this2.setState({
          profile,
          loading: false,
          error: undefined
        });
      } catch (error) {
        _this2.setState({
          profile: undefined,
          loading: false,
          error
        });
      }
    })();
  }

  render() {
    const {
      children
    } = this.props;
    const {
      profile,
      loading,
      error
    } = this.state;
    return React__default.createElement(Initialize$1, {
      onReady: this.handleReady
    }, React__default.createElement(LoginStatus, {
      event: "auth.statusChange",
      onChange: this.handleStatusChange
    }, children({
      profile,
      loading,
      error
    })));
  }

}

defineProperty(Profile, "defaultProps", {
  fields: Fields
});

class CustomChat extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      children,
      pageId,
      themeColor,
      loggedInGreeting,
      loggedOutGreeting,
      dataRef,
      greetingDialogDisplay,
      greetingDialogDelay
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-customerchat",
      page_id: pageId,
      theme_color: themeColor,
      logged_in_greeting: loggedInGreeting,
      logged_out_greeting: loggedOutGreeting,
      greeting_dialog_display: greetingDialogDisplay,
      greeting_dialog_delay: greetingDialogDelay,
      "data-ref": dataRef
    }, children);
  }

}

defineProperty(CustomChat, "defaultProps", {
  children: undefined,
  themeColor: undefined,
  loggedInGreeting: undefined,
  loggedOutGreeting: undefined,
  dataRef: undefined,
  greetingDialogDisplay: undefined,
  greetingDialogDelay: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(CustomChat, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class MessageUs extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      color,
      messengerAppId,
      pageId,
      children,
      size
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-messengermessageus",
      messenger_app_id: messengerAppId,
      page_id: pageId,
      "data-color": color,
      "data-size": size
    }, children);
  }

}

defineProperty(MessageUs, "defaultProps", {
  color: undefined,
  size: undefined,
  children: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(MessageUs, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

class MessengerCheckbox extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      origin,
      prechecked,
      allowLogin,
      userRef,
      messengerAppId,
      pageId,
      children,
      size,
      centerAlign,
      skin
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-messenger-checkbox",
      messenger_app_id: messengerAppId,
      page_id: pageId,
      size: size,
      origin: origin,
      user_ref: userRef,
      prechecked: prechecked,
      allow_login: allowLogin,
      skin: skin,
      center_align: centerAlign
    }, children);
  }

}

defineProperty(MessengerCheckbox, "defaultProps", {
  size: undefined,
  allowLogin: undefined,
  prechecked: undefined,
  userRef: undefined,
  children: undefined,
  origin: undefined,
  skin: undefined,
  centerAlign: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(MessengerCheckbox, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

// import MessengerColor from './constants/MessengerColor';

class SendToMessenger extends PureComponent {
  componentDidUpdate() {
    const {
      handleParse
    } = this.props;
    handleParse();
  }

  render() {
    const {
      color,
      messengerAppId,
      pageId,
      children,
      dataRef,
      size
    } = this.props;
    return React__default.createElement("div", {
      className: "fb-send-to-messenger",
      messenger_app_id: messengerAppId,
      page_id: pageId,
      "data-color": color,
      "data-size": size,
      "data-ref": dataRef
    }, children);
  }

}

defineProperty(SendToMessenger, "defaultProps", {
  color: undefined,
  size: undefined,
  dataRef: undefined,
  children: undefined
});

forwardRef((props, ref) => React__default.createElement(Parser, null, ({
  handleParse
}) => React__default.createElement(SendToMessenger, _extends_1({}, props, {
  handleParse: handleParse,
  ref: ref
}))));

var ImageSlider = function ImageSlider(props) {
  var innerSlider = useRef(null);
  var tile = useRef(null);
  var viewableWindow = useRef(null);

  var _useState = useState(0),
      _useState2 = _slicedToArray(_useState, 2),
      tileSize = _useState2[0],
      setTileSize = _useState2[1];

  var _useState3 = useState(false),
      _useState4 = _slicedToArray(_useState3, 2),
      showScroller = _useState4[0],
      setShowScroller = _useState4[1];

  var _useState5 = useState(0),
      _useState6 = _slicedToArray(_useState5, 2),
      scrollPosition = _useState6[0],
      setScrollPosition = _useState6[1];

  var client = props.client;


  function scrollSlider(e, direction) {
    var slide = e.target.parentElement;
    var scrollOffset = scrollPosition;
    var viewableWidth = slide.clientWidth;
    //calculate viewable size / slide
    var numberOfSlidesToScroll = Math.floor(tile.current.clientWidth + 25); //width of the tile plus margin
    var scrollDirection = void 0;
    if (direction === 'next') {
      scrollDirection = scrollOffset + numberOfSlidesToScroll;
      if (scrollOffset + viewableWidth + 25 >= innerSlider.current.offsetWidth) {
        scrollDirection = 0;
      }
    }
    if (direction === 'prev') {
      scrollDirection = scrollOffset - numberOfSlidesToScroll;
      if (scrollOffset === 0) {
        if (window.innerWidth > 1399) {
          scrollDirection = innerSlider.current.offsetWidth - tileSize * 3 - 70;
        }
        if (window.innerWidth < 1399 && window.innerWidth > 592) {
          scrollDirection = innerSlider.current.offsetWidth - tileSize * 2 - 40;
        }
        if (window.innerWidth < 592) {
          scrollDirection = innerSlider.current.offsetWidth - tileSize * 1 - 24;
        }
      }
    }
    slide.scrollTo({
      left: scrollDirection,
      behavior: 'smooth'
    });
    setScrollPosition(scrollDirection);
  }
  var setThumbSize = function setThumbSize() {
    var thumbSize = void 0;
    var scrollerVisible = false;
    if (window.innerWidth > 1399) {
      if (props.data.slides && props.data.slides.length < 3) {
        thumbSize = Math.floor(viewableWindow.current.clientWidth / 2 - 40);
      } else {
        thumbSize = Math.floor(viewableWindow.current.clientWidth / 3 - 40);
      }
      if (props.data.slides.length > 3) {
        scrollerVisible = true;
      }
    }
    if (window.innerWidth < 1399 && window.innerWidth > 592) {
      thumbSize = Math.floor(viewableWindow.current.clientWidth / 2 - 48);
      if (props.data.slides.length > 2) {
        scrollerVisible = true;
      }
    }
    if (window.innerWidth < 592) {
      thumbSize = Math.floor(viewableWindow.current.clientWidth / 1 - 64);
      if (props.data.slides.length > 1) {
        scrollerVisible = true;
      }
    }
    if (thumbSize !== tileSize) {
      setTileSize(thumbSize);
      setScrollPosition(0);
      setShowScroller(scrollerVisible);
      var videoRows = document.querySelectorAll('#vid-slider .row');
      for (var i = 0; i < videoRows.length; i++) {
        videoRows[i].scrollTo({
          left: 0,
          behavior: 'smooth'
        });
      }
    }
  };
  useEffect(function () {
    //IE11 Polyfill
    smoothscroll.polyfill();
    setThumbSize();

    window.addEventListener('resize', setThumbSize);

    return function () {
      return window.removeEventListener('resize', setThumbSize);
    };
  }, []);

  var variant = 'black';
  return React__default.createElement(
    React__default.Fragment,
    null,
    React__default.createElement(
      'div',
      { ref: viewableWindow, id: 'vid-slider', className: 'col' },
      React__default.createElement(
        'div',
        { className: 'row' },
        showScroller && React__default.createElement(
          'div',
          { onClick: function onClick(e) {
              return scrollSlider(e, 'prev');
            }, className: 'tile__slider-prev', style: { color: variant } },
          React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
        ),
        showScroller && React__default.createElement(
          'div',
          { onClick: function onClick(e) {
              return scrollSlider(e, 'next');
            }, className: 'tile__slider-next', style: { color: variant } },
          React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
        ),
        React__default.createElement(
          'div',
          { ref: innerSlider, className: 'row__inner' },
          props.data.slides.map(function (img, index) {
            var thumbnail = urlFor({ client: client, source: img.slideshowImage, imageWidth: 250 });
            if (!img.slideshowImage.link) {
              return React__default.createElement(
                'div',
                { ref: tile, key: index, className: 'tile', style: { width: tileSize + 'px' } },
                React__default.createElement(
                  'div',
                  { className: 'tile__media' },
                  React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: img.slideshowImage.alt ? img.slideshowImage.alt : '', style: { width: tileSize + 'px', maxHeight: '160px' } })
                ),
                React__default.createElement('div', { style: { color: variant }, className: 'tile__info' })
              );
            } else {
              return React__default.createElement(
                'a',
                { ref: tile, key: index, href: img.slideshowImage.link, target: img.slideshowImage.blank ? '_target' : '_self', className: 'tile', style: { width: tileSize + 'px' } },
                React__default.createElement(
                  'div',
                  { className: 'tile__media' },
                  React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: img.slideshowImage.alt ? img.slideshowImage.alt : '', style: { width: tileSize + 'px', maxHeight: '160px' } })
                ),
                React__default.createElement('div', { style: { color: variant }, className: 'tile__info' })
              );
            }
          })
        )
      ),
      React__default.createElement(
        'style',
        { jsx: 'true' },
        '\n          #vid-slider * {\n            box-sizing: border-box;\n            -ms-overflow-style: none;\n          }\n          #vid-slider::-webkit-scrollbar-thumb {\n            display: none;\n          }\n          #vid-slider::-webkit-scrollbar {\n            display: none;\n          }\n          #vid-slider .row::-webkit-scrollbar {\n            display: none;\n          }\n          #vid-slider .row::-webkit-scrollbar-thumb {\n            display: none;\n          }\n          #vid-slider {\n            position: relative;\n            -ms-overflow-style: none;\n            padding: 0 1.5rem;\n            margin-bottom: 0 !important;\n          }\n          #vid-slider .now-playing {\n            position: absolute;\n            top: 0.5rem;\n            left: 1rem;\n            color: white;\n            background: rgba(0, 0, 0, 0.75);\n          }\n          #vid-slider h1,\n          #vid-slider p {\n            text-align: center;\n            width: 100%;\n            max-width: 500px;\n            margin: auto;\n          }\n          #vid-slider,\n          #vidHolder {\n            max-width: 775px;\n            margin: 0 auto;\n          }\n          #vid-slider a:link,\n          #vid-slider a:hover,\n          #vid-slider a:active,\n          #vid-slider a:visited {\n            transition: color 150ms;\n            color: #95a5a6;\n            text-decoration: none;\n          }\n          #vid-slider a:hover {\n            color: #7f8c8d;\n            text-decoration: underline;\n          }\n          #vid-slider .contain {\n            width: 100%;\n          }\n          #vid-slider .row {\n            overflow-x: scroll;\n            width: 100%;\n            -ms-overflow-style: none;\n            overflow-y: hidden !important;\n          }\n          #vid-slider .tile__info {\n            white-space: normal !important;\n            position: absolute;\n            text-align: center;\n            color: ' + (props.dark ? 'white' : '#383838') + ';\n            opacity: 1;\n            font-size: 0.9rem;\n            font-weight: bold;\n            transition: opacity 0.25s;\n          }\n          #vid-slider .row__inner {\n            transition: 450ms -webkit-transform;\n            transition: 450ms transform;\n            transition: 450ms transform, 450ms -webkit-transform;\n            font-size: 0;\n            white-space: nowrap;\n            margin: 25px 0 70px !important;\n            padding-bottom: 10px;\n            padding-left: 0;\n          }\n          #vid-slider .tile {\n            position: relative;\n            display: inline-block;\n            margin: 0 12px;\n            font-size: 20px;\n            transition: 450ms all;\n            -webkit-transform-origin: center left;\n            transform-origin: center left;\n          }\n  \n          #vid-slider .tile:first-child {\n            margin-left: 15px;\n          }\n          #vid-slider .tile__img {\n            height: auto;\n            -o-object-fit: contain;\n            object-fit: contain;\n            object-position: center;\n          }\n          #vid-slider .tile__details {\n            position: absolute;\n            bottom: 0;\n            left: 0;\n            right: 0;\n            top: 0;\n            font-size: 10px;\n            opacity: 0;\n            background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);\n            transition: 450ms opacity;\n          }\n          #vid-slider .tile__details:after,\n          #vid-slider .tile__details:before {\n            content: \'\';\n  \n            position: absolute;\n            top: 50%;\n            left: 50%;\n            display: #000;\n          }\n          #vid-slider .tile__details:after {\n            margin-top: -25px;\n            margin-left: -25px;\n            width: 50px;\n            height: 50px;\n            border: 3px solid #ecf0f1;\n            line-height: 50px;\n            text-align: center;\n            border-radius: 100%;\n            background: rgba(0, 0, 0, 0.5);\n            z-index: 1;\n          }\n          #vid-slider .tile__details:before {\n            content: \'\';\n            background: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 64 64\' width=\'64\' height=\'64\' fill=\'white\'><path d=\'M26 46 L46 32 L26 18 Z\'/></svg>")\n              no-repeat center center;\n            left: 0;\n            width: 100%;\n            height: 3rem;\n            font-size: 30px;\n            margin-right: 12px;\n            margin-top: -24px;\n            text-align: center;\n            z-index: 2;\n            color: white;\n          }\n  \n          #vid-slider .tile__title {\n            position: absolute;\n            bottom: 0;\n            padding: 10px;\n            max-width: 250px;\n          }\n          #vid-slider .tile__title_text {\n            position: relative;\n            left: 0;\n            white-space: normal;\n          }\n  \n          #vid-slider .tile__slider-prev,\n          #vid-slider .tile__slider-next {\n            width: 30px;\n            background: transparent;\n            border: none;\n            position: absolute;\n            top: 50%;\n            transform: translateY(-50%);\n            z-index: 99;\n            cursor: pointer;\n            color: ' + (props.dark ? 'white' : 'black') + ';\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            font-size: 2rem;\n          }\n          #vid-slider .tile__slider-prev {\n            left: -0.5rem;\n            padding: .5rem;\n          }\n          #vid-slider .tile__slider-next {\n            right: -0.5rem;\n            padding: .5rem;\n          }\n          #vid-slider,\n          #vid-slider .row {\n            margin: 0;\n          }\n  \n          #vid-slider .row::-webkit-scrollbar-thumb {\n            background-color: transparent !important;\n          }\n          #vid-slider i {\n            border: solid ' + (props.dark ? 'white' : 'black') + ';\n            border-width: 0 4px 4px 0;\n            display: inline-block;\n            padding: 4px;\n            pointer-events: none;\n          }\n          #vid-slider .right {\n            transform: rotate(-45deg);\n            -webkit-transform: rotate(-45deg);\n          }\n          #vid-slider .left {\n            transform: rotate(135deg);\n            -webkit-transform: rotate(135deg);\n          }\n          @media screen and (min-width: 1399px) {\n            .block-content #vid-slider .tile__img {\n              height: auto;\n            }\n            .block-content #vid-slider .tile {\n              height: auto;\n            }\n          }\n  \n          @media screen and (max-width: 1399px) {\n            #vid-slider,\n            #vidHolder {\n              max-width: 620px;\n            }\n          }\n          @media screen and (max-width: 1200px) {\n            #vid-slider,\n            #vidHolder {\n              max-width: 580px;\n            }\n          }\n          @media screen and (max-width: 967px) {\n            #vid-slider {\n              max-width: 100%;\n            }\n  \n            #vid-slider .row__inner {\n              margin: 60px 0 50px !important;\n            }\n          }\n  \n          @media screen and (max-width: 768px) {\n            #vidHolder {\n              position: unset;\n              width: 100%;\n            }\n          }\n          @media screen and (max-width: 568px) {\n            #vidHolder {\n              position: unset;\n              width: 100%;\n            }\n  \n            #vid-slider .row__inner {\n              margin: 30px 0 70px;\n            }\n          }\n        '
      )
    )
  );
};

export { Facebook as F, ImageSlider as I, Page$1 as P };
