Merge pull request #11 from crimx/concurrent-mode

React concurrent mode safe

README.md

@@ -1,7 +1,6 @@
 # [observable-hooks](https://github.com/crimx/observable-hooks)
 
 [![npm-version](https://img.shields.io/npm/v/observable-hooks.svg)](https://www.npmjs.com/package/observable-hooks)
-[![npm bundle size](https://img.shields.io/bundlephobia/minzip/observable-hooks)](https://bundlephobia.com/result?p=observable-hooks)
 [![Build Status](https://img.shields.io/travis/com/crimx/observable-hooks/master)](https://travis-ci.com/crimx/observable-hooks)
 [![Coverage Status](https://img.shields.io/coveralls/github/crimx/observable-hooks/master)](https://coveralls.io/github/crimx/observable-hooks?branch=master)
 
@@ -12,18 +11,35 @@
 
 ![logo](https://github.com/crimx/observable-hooks/blob/master/logo.jpg?raw=true)
 
-React hooks for RxJS Observables. Simple, flexible, testable and performant.
+Concurrent mode safe React hooks for RxJS Observables. Simple, flexible, testable and performant.
 
 - Seamless integration of React and RxJS.
   - Props and states to Observables.
   - Observables to states and props events.
   - Conditional rendering with stream of React Components.
+  - **Concurrent mode safe**.
   - Render-as-You-Fetch with React Suspense.
   - No `tap` hack needed. With Epic-like signature Observable operation is pure and testable.
 - Full-powered RxJS. Do whatever you want with Observables. No limitation nor compromise.
 - Fully tested. We believe in stability first. This project will always maintain a 100% coverage.
 - Tiny and fast. A lot of efforts had been put into improving integration. This library should have zero visible impact on performance.
 
+## Installation
+
+The concurrent mode safe version is in alpha. [Docs][docs] is also up-to-date. Looking forward to your feedback!
+
+yarn
+
+```bash
+yarn add observable-hooks@alpha
+```
+
+npm
+
+```bash
+npm install --save observable-hooks@alpha
+```
+
 ## Why?
 
 React added hooks for [reusing stateful logic](https://reactjs.org/docs/hooks-intro.html#its-hard-to-reuse-stateful-logic-between-components).
@@ -75,32 +91,16 @@ function transformTypingStatus(event$) {
 }
 ```
 
-## Installation
-
-yarn
-
-```bash
-yarn add observable-hooks
-```
-
-npm
-
-```bash
-npm install --save observable-hooks
-```
-
 ## Usage
 
 Read the docs at <https://observable-hooks.js.org>.
 
-Here is how I designed the API. Might give you a perspective on when use what.
-
-![mindmap](https://github.com/crimx/observable-hooks/blob/master/observable-hooks.png?raw=true)
-
 Examples are in [here](https://github.com/crimx/observable-hooks/tree/master/examples). Play on CodeSandbox:
 
 - [Pomodoro Timer Example](https://codesandbox.io/s/github/crimx/observable-hooks/tree/master/examples/pomodoro-timer)
 - [Typeahead Example](https://codesandbox.io/s/github/crimx/observable-hooks/tree/master/examples/typeahead)
 - [Render-as-You-Fetch using Suspense](https://codesandbox.io/s/github/crimx/observable-hooks/tree/master/examples/suspense)
 
 Note that there are also some useful [utilities](https://observable-hooks.js.org/api/helpers.html) for common use cases to reduce garbage collection.
+
+[docs]: https://observable-hooks.js.org

docs/.vuepress/config.js

@@ -51,7 +51,7 @@ module.exports = {
               title: 'Guide', // required
               collapsable: false, // optional, defaults to true
               sidebarDepth: 2, // optional, defaults to 1
-              children: ['/guide/', '/guide/motivation', '/guide/core-concepts']
+              children: ['/guide/core-concepts', '/guide/motivation', '/guide/']
             },
             {
               title: 'Advanced', // required

docs/README.md

@@ -4,10 +4,10 @@ heroImage: /logo.png
 heroText:
 tagline: React hooks for RxJS Observables.
 actionText: Get Started →
-actionLink: /guide/
+actionLink: /guide/core-concepts.html
 features:
 - title: 💫Seamless Integration
-  details: Props, states and Observables can be nicely converted to each other with pure function. No `tap` hack needed. Supports Render-as-You-Fetch pattern with React Suspense.
+  details: Concurrent mode safe. Props, states and Observables can be nicely converted to each other with pure function. No `tap` hack needed. Supports Render-as-You-Fetch pattern with React Suspense.
 - title: ☯️Full-powered RxJS
   details: Do whatever you want with Observables. No limitation nor compromise.
 - title: 🛡Fully tested