subspaced.md

subspaced(mapState, [namespace])

A higher-order React component that wraps a component in a SubspaceProvider.

Arguments

1. mapState (Function|string): A selector to derive the state of the subspace. The selector is provided the parent state as the first parameter and the root state as the second parameter. If passed as a string, a selector is created for that key on the provided state.
2. namespace (string): An optional namespace to scope actions with.
3. options (Object): An optional object to supply the following options:
   • context (React.Context|Object): Override the React Context used for accessing the store. An object can be passed with separate parent and child contexts if required.

If mapState is passed as a string and no namespace is provided, the provided string is used for both. To prevent this, pass null as the second parameter.

Returns

(Function): A function that takes a React Component and returns it wrapped in a SubspaceProvider.

Examples

import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const SubspacedComponent = subspaced(state => state.subApp)(AComponent)

import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const SubspacedComponent = subspaced((state, rootState) => ({
  ...state.subApp,
  root: rootState
}))(AComponent)

import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const SubspacedComponent = subspaced(state => state.subApp, "subApp")(
  AComponent
)

import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const SubspacedComponent = subspaced("subApp", "subAppNamespace")(AComponent)

import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const SubspacedComponent = subspaced("subApp")(AComponent)

import React from "react"
import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const CustomReduxContext = React.createContext()

const SubspacedComponent = subspaced(state => state.subApp, "subApp", {
  context: CustomReduxContext
})(AComponent)

import React from "react"
import { subspaced } from "react-redux-subspace"
import AComponent from "somewhere"

const CustomParentContext = React.createContext()
const CustomChildContext = React.createContext()

const SubspacedComponent = subspaced(state => state.subApp, "subApp", {
  context: { parent: CustomParentContext, child: CustomChildContext }
})(AComponent)