import {
createState,
extended,
statics,
defaultProps,
params,
lifecycle,
pure
} from 'react-envelope';
const createToggleState = (initialOn = false) => ({
const initial = {
on: initialOn,
};
const mutators = setState => ({
toggle: () => {
setState(({ on }) => ({ on: !on })),
}
});
// `createState` will create a component with a render prop that might be used with
// `parameters` hoc, too.
return createState(initial, mutators);
});
const ToggleState = createToggleState();
// These functions are not hoc's. They will pass through a `ComponentBag` that will be formed
// to a component inside the `extend` function.
const extensions = [
statics({
ComponentItem,
}),
defaultProps({
...
}),
// Declare additional function parameters, use any render prop component.
params(ToggleState, ThemeContext, DeviceMotion, ...),
// Use render prop components with lifecycles!
lifecycle((props, toggle, theme, motion, ...) => ({
componentDidMount() {
...
}
})),
pure(),
];
// Use declared parameters with Component
function Component(props, toggle, theme, motion, ...) {
...
}
export default extended(Component, extensions);
