Merge pull request #37 from mpeyper/master

Added compatability package for redux-observable

README.md

@@ -20,10 +20,12 @@ npm install --save redux-subspace
 * [Examples](/docs/Examples.md)
 * [API Reference](/docs/api/README.md)
 
-## Sub-Packages
+## Packages
 
+* [`redux-subspace`](/packages/redux-subspace): The core package for Redux Subspace
 * [`react-redux-subspace`](/packages/react-redux-subspace): React bindings compatible with `react-redux`
 * [`redux-subspace-saga`](/packages/redux-subspace-saga): Utilities for integrating with `redux-saga`
+* [`redux-subspace-observable`](/packages/redux-subspace-observable): Utilities for integrating with `redux-observable`
 * [`redux-subspace-wormhole`](/packages/redux-subspace-wormhole): Middleware for exposing additional state to subspaces
 
 ## Upgrading From Version 1 to Version 2

docs/README.md

@@ -12,9 +12,10 @@
   * [Global State](/docs/advanced/GlobalState.md)
   * [Scoping Actions](/docs/advanced/ScopingActions.md)
   * [Middleware](/docs/advanced/middleware/README.md)
-    * [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
-    * [redux-saga](/docs/advanced/middleware/redux-saga.md)
+    * [redux-observable](/docs/advanced/middleware/redux-observable.md)
     * [redux-promise](/docs/advanced/middleware/redux-promise.md)
+    * [redux-saga](/docs/advanced/middleware/redux-saga.md)
+    * [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
     * [Custom Middleware](/docs/advanced/middleware/CustomMiddleware.md)
 * [Examples](/docs/Examples.md)
 * [API Reference](/docs/api/README.md)

docs/advanced/README.md

@@ -4,7 +4,8 @@
 * [Global State](/docs/advanced/GlobalState.md)
 * [Scoping Actions](/docs/advanced/ScopingActions.md)
 * [Middleware](/docs/advanced/middleware/README.md)
-  * [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
-  * [redux-saga](/docs/advanced/middleware/redux-saga.md)
+  * [redux-observable](/docs/advanced/middleware/redux-observable.md)
   * [redux-promise](/docs/advanced/middleware/redux-promise.md)
+  * [redux-saga](/docs/advanced/middleware/redux-saga.md)
+  * [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
   * [Custom Middleware](/docs/advanced/middleware/CustomMiddleware.md)

docs/advanced/middleware/README.md

@@ -60,9 +60,10 @@ const store = createStore(reducer, applyMiddleware(applyToChildren(someMiddlewar
 
 As previously stated, many Redux middlewares will just work with Redux Subspace, but the following list are actively supported:
 
-* [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
-* [redux-saga](/docs/advanced/middleware/redux-saga.md)
+* [redux-observable](/docs/advanced/middleware/redux-observable.md)
 * [redux-promise](/docs/advanced/middleware/redux-promise.md)
+* [redux-saga](/docs/advanced/middleware/redux-saga.md)
+* [redux-thunk](/docs/advanced/middleware/redux-thunk.md)
 
 ## Writing Custom Middleware
 

docs/advanced/middleware/redux-observable.md

@@ -0,0 +1,5 @@
+# redux-observable
+
+Using Redux Subspace with [`redux-observable`](https://redux-observable.js.org/) is pretty similar to using it with Redux itself, except rather than subspacing the store, you need to subspace the epics. The [`redux-subspace-observable` package](/packages/redux-subspace-observable) provides many useful functions to facilite this.
+
+For more details, refer to the [`redux-subspace-observable` documentation](/packages/redux-subspace-observable/docs).

packages/react-redux-subspace/test/setup.js

@@ -8,12 +8,7 @@
 
 import babelRegister from 'babel-register'
 
-babelRegister(
-    {
-        babelrc: false,
-        presets: ['es2015', 'stage-0', 'react']
-    }
-)
+babelRegister()
 
 global.expect = require('chai').expect
 global.sinon = require('sinon')

packages/redux-subspace-observable/.babelrc

@@ -0,0 +1,4 @@
+{
+  "presets": ["es2015", "react", "stage-0"],
+  "plugins": ["transform-function-bind"]
+}

packages/redux-subspace-observable/.npmignore

@@ -0,0 +1,10 @@
+.git/
+node_modules
+npm-debug.log
+test/
+docs/
+examples/
+.nyc_output
+coverage
+.vscode
+.idea

packages/redux-subspace-observable/README.md

@@ -0,0 +1,18 @@
+# redux-subspace-observable
+
+[![npm version](https://img.shields.io/npm/v/redux-subspace-observable.svg?style=flat-square)](https://www.npmjs.com/package/redux-subspace-observable)
+[![npm downloads](https://img.shields.io/npm/dm/redux-subspace-observable.svg?style=flat-square)](https://www.npmjs.com/package/redux-subspace-observable)
+[![License: MIT](https://img.shields.io/npm/l/redux-subspace-observable.svg?style=flat-square)](LICENSE.md)
+
+This is a library to create subspaces for epics. It's designed to work with [redux-observable](https://redux-observable.js.org/) middleware.
+
+## Installation
+
+```sh
+npm install --save redux-subspace-observable
+```
+
+## Documentation
+
+* [Usage](/packages/redux-subspace-observable/docs/Usage.md)
+* [API Reference](/packages/redux-subspace-observable/docs/api/README.md)

packages/redux-subspace-observable/docs/README.md

@@ -0,0 +1,7 @@
+# Table of Contents
+
+* [Read Me](/packages/redux-subspace-observable/README.md)
+* [Usage](/packages/redux-subspace-observable/docs/Usage.md)
+* [API Reference](/packages/redux-subspace-observable/docs/api/README.md)
+  * [createEpicMiddleware](/packages/redux-subspace-observable/docs/api/createEpicMiddleware.md)
+  * [subspaced](/packages/redux-subspace-observable/docs/api/subspaced.md)

packages/redux-subspace-observable/docs/Usage.md

@@ -0,0 +1,37 @@
+# Usage
+
+Using Redux Subspace with [`redux-observable`](https://redux-observable.js.org/) is pretty similar to [using it with Redux](/docs/basics/CreatingSubspaces.md) itself, except rather than subspacing the store, you need to subspace the epics.
+
+## Epic Middleware
+
+In order for `redux-observable` middleware to work, it must only be applied to the root store and not to every subspace.  You can use the [`applyToRoot` utility](/docs/advanced/middleware/README.md#applyToRoot) yourself, but `redux-subspace-observable` provides a middleware that does that for you:
+
+```javascript
+import { createStore } from 'redux'
+import { applyMiddleware } from 'redux-subspace'
+import { createEpicMiddleware } from 'redux-subspace-observable'
+import { reducer, epic } from 'some-dependency'
+
+const epicMiddleware = createEpicMiddleware(epic)
+
+const store = createStore(reducer, applyMiddleware(epicMiddleware))
+```
+
+## Subspacing an Epic
+
+The `subspaced` higher-order epic is used to subspace epics:
+
+```javascript
+import { subspaced } from 'react-redux-observable'
+import epic from 'some-dependency'
+
+const subspacedEpic = subspaced((state) => state.subApp, 'subApp')(epic)
+```
+
+Now the epic will only recieve actions that match the subspace's namespace and any actions it emits will be automatically namespaced as well.
+
+The [`store` parameter](https://redux-observable.js.org/docs/basics/Epics.html#accessing-the-stores-state) will also be a subspace created by the provided selector and namespace.
+
+### Nesting Subspaced Epics
+
+You can nest subspaces epics by [combining them together](https://redux-observable.js.org/docs/basics/Epics.html#combining-epics) like regular epics. By doing this, the [standard nesting behavior](/docs/advanced/NestingSubspaces.md) of subspaces will still occur.

packages/redux-subspace-observable/docs/api/README.md

@@ -0,0 +1,4 @@
+# API Reference
+
+* [createEpicMiddleware](/packages/redux-subspace-observable/docs/api/createEpicMiddleware.md)
+* [subspaced](/packages/redux-subspace-observable/docs/api/subspaced.md)

packages/redux-subspace-observable/docs/api/createEpicMiddleware.md

@@ -0,0 +1,25 @@
+# `createEpicMiddleware(rootEpic, [options])`
+
+A function that creates the redux-observable middleware as a Redux Subspace middleware.
+
+## Arguments
+
+1. `rootEpic` (_Function_): The root [Epic](https://redux-observable.js.org/docs/basics/Epics.html).
+1. `options` (_Object_): A list of options to pass to the middleware. These are simply passed through to the underlying `redux-observable` `createEpicMiddleware` function, so refer to [their documentation for supported options](https://redux-observable.js.org/docs/api/createEpicMiddleware.html#arguments).
+
+## Returns
+
+(_Function_): The middleware.
+
+## Examples
+
+```javascript
+import { createStore } from 'redux'
+import { applyMiddleware } from 'redux-subspace'
+import { createEpicMiddleware } from 'redux-subspace-observable'
+import { reducer, epic } from 'somewhere'
+
+const epicMiddleware = createEpicMiddleware(epic)
+
+const store = createStore(reducer, applyMiddleware(epicMiddleware))
+```

packages/redux-subspace-observable/docs/api/subspaced.md

@@ -0,0 +1,51 @@
+# `subspaced(mapState, [namespace])`
+
+A higher-order epic that runs the epic in a subspace.
+
+## Arguments
+
+1. `mapState` (_Function|string_): A [selector to derive the state](/docs/basics/CreatingSubspaces.md) 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](/docs/basics/Namespacing.md) with.
+
+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 accepts an [epic](https://redux-observable.js.org/docs/basics/Epics.html) and returns a new epic that runs the original epic within the context of a subspace.
+
+## Examples
+
+```javascript
+import { subspaced } from 'redux-subspace-observable'
+import epic from 'somewhere'
+
+const subspacedEpic = subspaced((state) => state.subApp)(epic)
+```
+
+```javascript
+import { subspaced } from 'redux-subspace-observable'
+import epic from 'somewhere'
+
+const subspacedEpic = subspaced((state, rootState) => ({ ...state.subApp, root: rootState }))(epic)
+```
+
+```javascript
+import { subspaced } from 'redux-subspace-observable'
+import epic from 'somewhere'
+
+const subspacedEpic = subspaced((state) => state.subApp, 'subApp')(epic)
+```
+
+```javascript
+import { subspaced } from 'redux-subspace-observable'
+import epic from 'somewhere'
+
+const subspacedEpic = subspaced('subApp', 'subAppNamespace')(epic)
+```
+
+```javascript
+import { subspaced } from 'redux-subspace-observable'
+import epic from 'somewhere'
+
+const subspacedEpic = subspaced('subApp')(epic)
+```