@shopgate/pwa-common/components/Portal/index.js

Common library for the Shopgate Connect PWA.

var _excluded=["props"];function _typeof(obj){if(typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"){_typeof=function _typeof(obj){return typeof obj;};}else{_typeof=function _typeof(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj;};}return _typeof(obj);}function _extends(){_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);}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;}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;}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a 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);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);return Constructor;}function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=_getPrototypeOf(derived);return _possibleConstructorReturn(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],_getPrototypeOf(_this).constructor):derived.apply(_this,args));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf||function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}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;}import React,{PureComponent,Suspense}from'react';import PropTypes from'prop-types';import{logger}from'@shopgate/pwa-core/helpers';import Loading from"../Loading";import portalCollection from"../../helpers/portals/portalCollection";import{componentsConfig}from"../../helpers/config";/**
 * The Portal component.
 */var Portal=/*#__PURE__*/function(_PureComponent){/**
   * Constructor.
   * @param {Object} props The component props.
   */function Portal(_props){var _this2;_classCallCheck(this,Portal);_this2=_callSuper(this,Portal,[_props]);/**
   * Returns the portal components.
   * @param {Object} props - The props to pass to the component.
   * @return {Array}
   */_defineProperty(_this2,"getRenderedComponents",function(props){var propsFromProps=props.props,reducedProps=_objectWithoutProperties(props,_excluded);var componentProps=_extends({},propsFromProps,{},reducedProps);return _this2.components.map(function(_ref){var PortalComponent=_ref.PortalComponent,key=_ref.key;return React.createElement(Suspense,{fallback:React.createElement(Loading,null),key:key},React.createElement(PortalComponent,componentProps));});});/**
   * Returns the portal components.
   * @param {string} name Name of the portal position
   * @return {Array}
   */_defineProperty(_this2,"getPortalComponents",function(name){var components=[];var portals=portalCollection.getPortals();if(!portals){return components;}var config=portalCollection.getConfig();if(!config){config=componentsConfig.portals;}// Loop over the portal keys.
Object.keys(config).forEach(function(key,index){var sourceTarget=config[key].target;var portalTarget=Array.isArray(sourceTarget)?sourceTarget:[sourceTarget];if(portalTarget.length===0){return;}portalTarget.forEach(function(target){// Stop if there is no key that matches the given name (prop).
if(target!==name){return;}var PortalComponent=portals[key];// Check that the component is valid.
if(PortalComponent){var componentKey="".concat(key,"-").concat(index);components.push({key:componentKey,PortalComponent:PortalComponent});}});});return components;});_this2.state={hasError:false};_this2.components=_this2.getPortalComponents(_props.name);return _this2;}/**
   * Catches errors.
   * @param {Error} error The caught error.
   * @param {Object} info The stacktrace info.
   */_inherits(Portal,_PureComponent);return _createClass(Portal,[{key:"componentDidCatch",value:function componentDidCatch(error,info){this.setState({hasError:true});logger.error(error,info);}},{key:"render",value:/**
   * Renders the component.
   * @return {JSX}
   */function render(){var children=this.props.children;var hasError=this.state.hasError;var renderedComponents=this.getRenderedComponents(this.props);var hasComponents=renderedComponents.length>0;/**
     * Render nothing if there are no children, matching components
     * via name or an error occurred.
     */if(hasError||!(hasComponents||children)){return null;}/**
     * If there is a child component then we treat the match as an override
     * and we render the last match only.
     */if(hasComponents){/**
       * If there is a child component then we treat the match as an override
       * and we render the last match only.
       */if(children){return renderedComponents[renderedComponents.length-1];}return renderedComponents;}return children;}}]);}(PureComponent);_defineProperty(Portal,"defaultProps",{children:null,props:null});export default Portal;