React-sharestate-hoc NPM

react-sharestate-hoc

A React higher-order component for share state using a Pub/Sub pattern

Installation

$ npm install react-sharestate-hoc --save

Description

A React higher-order components, HOC, is a function that receive a React Component and return a enhance version.

With this module state of 1 component cam be share with n components. A 1 to n relationship. This is useful when a component state depends on state of another and there is not a parent relationship between them. This is usually done with Flux pattern but this time is solved with a minimal implementation of the Pub/Sub pattern using higher order React components.

Module contains two HOC, shareState and sharedState:

shareState is the component that share his state. Only can be one instance of it.
sharedState are subscribers of shareState components and can be many of them.

API

shareState

Share state of React component C, store is a empty object use for save the singleton instance of C and internal data

shareState(C, store)`

passed `props`

_setShareState is a callback function for set shared state
_shareStore is the store object

`shareStateBind` function

This is a helper function for "good looking" declaration of shareState components using ES.Next Function Bind Syntax

shareStateBind(C)

On this Example, declared share component function is use like a store too:

import { shareStateBind as shareState } from 'react-sharestate-hoc';

...
const SampleComponent = props => SampleComponent::shareState(<OneComponent {...props}/>);
...

sharedState

Subscribe to a component that share his state, many can subscribe to same. C is the component to be wrapped. prop is a custom prop string name used for pass share state singleton store object, this prop connect a shareState component with sharedState components.