docs(website): add docs for new custom connectors

Author: christianalfoni

packages/overmind-website/examples/guide/usingovermindwithangular/connect_custom.ts

@@ -0,0 +1,20 @@
+export default () => [
+  {
+    fileName: 'components/admin.component.ts',
+    code: `
+import { Component } from '@angular/core'
+import { connect } from '../overmind'
+
+@Component({
+  selector: 'admin-root',
+  templateUrl: './admin.component.html',
+  styleUrls: ['./admin.component.css']
+})
+@connect(({ state, actions, effects }) => ({
+  state: state.admin,
+  actions: actions.admin
+}))
+export class AdminComponent {}
+`,
+  },
+]

packages/overmind-website/examples/guide/usingovermindwithvue/connect_custom.ts

@@ -0,0 +1,21 @@
+export default () => [
+  {
+    fileName: 'components/SomeComponent.vue (template)',
+    code: `
+<div v-on:click="actions.someAdminAction">
+  {{state.someAdminState}}
+</div>
+`,
+  },
+  {
+    fileName: 'components/SomeComponent.vue (script)',
+    code: `
+import { connect } from '../overmind'
+
+export default connect(({ state, actions, effects }) => ({
+  state: state.admin,
+  actions: actions.admin
+}), {})
+`,
+  },
+]

packages/overmind-website/guides/beginner/07_usingovermindwithangular.md

@@ -6,6 +6,13 @@ Using Overmind with Angular is straight forward. You create a **connect** decora
 h(Example, { name: "guide/usingovermindwithangular/connect" })
 ```
 
+You can also expose parts of the configuration on custom properties of the component:
+
+```marksy
+h(Example, { name: "guide/usingovermindwithangular/connect_custom" })
+```
+
+You can now access the **admin** state and actions directly with **state** and **actions**.
 
 ## Rendering
 
@@ -27,7 +34,7 @@ If you pass a state object or array as a property to a child component you will
 h(Example, { name: "guide/usingovermindwithangular/passprop" })
 ```
 
-## OvermindProvider
+## State effects
 
 To run effects in components based on changes to state you use the **addMutationListener** function in the lifecycle hooks of Angular.
 

packages/overmind-website/guides/beginner/08_usingovermindwithvue.md

@@ -6,6 +6,15 @@ You can connect any Vue component to your Overmind instance.
 h(Example, { name: "guide/usingovermindwithvue/connect" })
 ```
 
+You can also expose parts of the configuration on custom properties of the component:
+
+```marksy
+h(Example, { name: "guide/usingovermindwithvue/connect_custom" })
+```
+
+You can now access the **admin** state and actions directly with **state** and **actions**.
+
+
 ## Rendering
 Any state accessed in the component will cause the component to render when a mutation occurs on that state. Overmind actually uses the same approach to change detection as Vue itself.