Skip to content

Instantly share code, notes, and snippets.

@trungtin
Created June 22, 2016 04:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save trungtin/fed7519df8d2c395a417f5665651789c to your computer and use it in GitHub Desktop.
Save trungtin/fed7519df8d2c395a417f5665651789c to your computer and use it in GitHub Desktop.
import React, { PropTypes, Component } from 'react';
export default ({
/* value props name */
valueProp = 'value',
initialValue,
/* handle value change props name */
handleValueChangeProp = 'onChange',
/* function using when update new value state */
getValue = (curValue, value) => value,
/* options props name */
optionsProp,
initialOptions,
/* handle options change props name */
handleOptionsChangeProp,
/* function using when update new options */
modifyOptions,
/* other props need access to update value state and options state,
signature: (valueStateReducer(item, currentValueState): nextValueState,
(optionsStateReducer(item, currentOptionsState): nextOptionsState)) */
mergeProps = () => {},
...restProps
} = {}) => Wrapped => class extends Component {
static propTypes = {
}
constructor(props) {
super(props);
this.state = {
value: initialValue,
options: initialOptions
};
this.handleValueChange = (...rest) => {
this.setState({ value: getValue(this.state.value, ...rest) })
}
this.handleOptionsChange = (...rest) => {
this.setState({ options: modifyOptions(this.state.options, ...rest) })
}
this.valueStateReducer = (changeFunc) => item => {
this.setState({ value: changeFunc(item, this.state.value) })
}
this.optionsStateReducer = (changeFunc) => item => {
this.setState({ options: changeFunc(item, this.state.options) })
}
this.mergeProps = mergeProps(this.valueStateReducer, this.optionsStateReducer);
}
render() {
const props = {
...restProps,
...this.mergeProps,
[valueProp]: this.state.value,
[handleValueChangeProp]: this.handleValueChange,
[optionsProp]: this.state.options,
[handleOptionsChangeProp]: this.handleOptionsChange,
...this.props
}
return (
<Wrapped {...props} />
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment