core/hoc

Constructs a higher-order component (HOC) using an optional set of default configuration parameters and a factory method that accepts instance configuration parameters and a component to wrap. The returned function can accept:

• an instance config and a component constructor to wrap and return a renderable component, or

• an instance config only and return a decorator function expecting a component constructor (like the next bullet), or

• a component constructor and return a renderable component

Example:

const Countable = hoc({prop: 'data-count'}, (config, Wrapped) => {
	return class extends React.Component {
		constructor (props) {
			super(props);
			this.state = {
				count: 0
			};
		},
		inc = () => this.setState({count: this.state.count + 1}),
		render () {
			const props = Object.assign({}, this.props, {
				[config.prop]: this.state.count,
				onClick: this.inc
			});
			return <Wrapped {...props} />
		}
	}
});

const CountableAsDataNumber({prop: 'data-number'});
const CountableDiv('div');
const CountableDivAsDataNumber = CountableAsDataNumber('div');