From d964f107bf4d5e4c3c2b588c1c5d0d892ac4ece9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Di=C3=A9ssica=20Gurskas?= <diessicode@gmail.com>
Date: Mon, 31 Oct 2016 02:15:35 -0200
Subject: [PATCH] Add instructions on connectToStores

---
 docs/utils/connectToStores.md | 61 +++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 docs/utils/connectToStores.md

diff --git a/docs/utils/connectToStores.md b/docs/utils/connectToStores.md
new file mode 100644
index 00000000..7091ac55
--- /dev/null
+++ b/docs/utils/connectToStores.md
@@ -0,0 +1,61 @@
+---
+layout: docs
+title: connectToStores
+description: Connecting components to Alt stores
+permalink: /docs/utils/connect-to-stores/
+---
+
+# Connecting components to Alt stores
+
+`connectToStores` wraps a React component and control its props with data coming from Alt stores.
+
+Expects the Component to have two static methods:
+- `getStores()`: Should return an array of stores.
+- `getPropsFromStores(props)`: Should return the props from the stores.
+
+## Usage Examples
+
+### ES6 Class Higher Order Component
+```js
+import React from 'react';
+import myStore from './stores/myStore';
+import connectToStores from 'alt-utils/lib/connectToStores';
+
+class MyComponent extends React.Component {
+  static getStores(props) {
+    return [myStore];
+  }
+  
+  static getPropsFromStores(props) {
+    return myStore.getState();
+  }
+  
+  render() {
+    // Use this.props like normal...
+  }
+}
+
+export default connectToStores(MyComponent);
+```
+
+### ES7 Decorator
+```js
+import React from 'react';
+import myStore from './stores/myStore';
+import connectToStores from 'alt-utils/lib/connectToStores';
+
+@connectToStores
+class MyComponent extends React.Component {
+  static getStores(props) {
+    return [myStore];
+  }
+  
+  static getPropsFromStores(props) {
+    return myStore.getState();
+  }
+  
+  render() {
+    // Use this.props like normal...
+  }
+}
+```