@shopgate/engage/components/ConnectedReactPortal/index.js

Shopgate's ENGAGE library.

var _excluded=["children"];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;}import React from'react';import PropTypes from'prop-types';import{Provider,ReactReduxContext}from'react-redux';import Portal from'react-portal';/**
 * @typedef {import('@types/react-portal')} ReactPortal
 */ // eslint-disable-next-line valid-jsdoc
/**
 * ConnectedReactPortal is a wrapper around "react-portal" v3 that ensures
 * children rendered in the portal have access to the Redux store.
 *
 * This addresses the limitation introduced by the switch to the new Context API in react-redux v6,
 * where the Redux store is only accessible to components within the StoreProvider. Since the Portal
 * component renders its children outside the React component tree, this wrapper bridges the gap.
 *
 * @type {ReactPortal}
 */var ConnectedReactPortal=function ConnectedReactPortal(_ref){var children=_ref.children,props=_objectWithoutProperties(_ref,_excluded);return React.createElement(ReactReduxContext.Consumer,null,function(ctx){return React.createElement(Portal,props,React.createElement(Provider,{store:ctx.store},children));});};ConnectedReactPortal.defaultProps={children:null};export default ConnectedReactPortal;