import React from 'react';
import PropTypes from 'prop-types';
import { ref } from 'airbnb-prop-types';
import RootFinder from './RootFinder';
/* eslint react/forbid-prop-types: 0 */
const stringOrFunction = PropTypes.oneOfType([PropTypes.func, PropTypes.string]);
const makeValidElementType = (adapter) => {
if (!adapter) {
return stringOrFunction;
}
function validElementTypeRequired(props, propName, ...args) {
if (!adapter.isValidElementType) {
return stringOrFunction.isRequired(props, propName, ...args);
}
const propValue = props[propName]; // eslint-disable-line react/destructuring-assignment
if (adapter.isValidElementType(propValue)) {
return null;
}
return new TypeError(`${propName} must be a valid element type!`);
}
function validElementType(props, propName, ...args) {
const propValue = props[propName];
if (propValue == null) {
return null;
}
return validElementTypeRequired(props, propName, ...args);
}
validElementType.isRequired = validElementTypeRequired;
return validElementType;
};
/**
* This is a utility component to wrap around the nodes we are
* passing in to `mount()`. Theoretically, you could do everything
* we are doing without this, but this makes it easier since
* `renderIntoDocument()` doesn't really pass back a reference to
* the DOM node it rendered to, so we can't really "re-render" to
* pass new props in.
*/
export default function createMountWrapper(node, options = {}) {
const { adapter, wrappingComponent: WrappingComponent } = options;
class WrapperComponent extends React.Component {
constructor(...args) {
super(...args);
const { props, wrappingComponentProps, context } = this.props;
this.state = {
mount: true,
props,
wrappingComponentProps,
context,
};
}
setChildProps(newProps, newContext, callback = undefined) {
const { props: oldProps, context: oldContext } = this.state;
const props = { ...oldProps, ...newProps };
const context = { ...oldContext, ...newContext };
this.setState({ props, context }, callback);
}
setWrappingComponentProps(props, callback = undefined) {
this.setState({ wrappingComponentProps: props }, callback);
}
render() {
const { Component, refProp } = this.props;
const { mount, props, wrappingComponentProps } = this.state;
if (!mount) return null;
// eslint-disable-next-line react/jsx-props-no-spreading
const component = ;
if (WrappingComponent) {
return (
// eslint-disable-next-line react/jsx-props-no-spreading
{component}
);
}
return component;
}
}
WrapperComponent.propTypes = {
Component: makeValidElementType(adapter).isRequired,
refProp: PropTypes.oneOfType([PropTypes.string, ref()]),
props: PropTypes.object.isRequired,
wrappingComponentProps: PropTypes.object,
context: PropTypes.object,
};
WrapperComponent.defaultProps = {
refProp: null,
context: null,
wrappingComponentProps: null,
};
if (options.context && (node.type.contextTypes || options.childContextTypes)) {
// For full rendering, we are using this wrapper component to provide context if it is
// specified in both the options AND the child component defines `contextTypes` statically
// OR the merged context types for all children (the node component or deeper children) are
// specified in options parameter under childContextTypes.
// In that case, we define both a `getChildContext()` function and a `childContextTypes` prop.
const childContextTypes = {
...node.type.contextTypes,
...options.childContextTypes,
};
WrapperComponent.prototype.getChildContext = function getChildContext() {
return this.state.context;
};
WrapperComponent.childContextTypes = childContextTypes;
}
return WrapperComponent;
}