Merge pull request #26 from releasy/v0.1.0

V0.1.0

.babelrc

@@ -1,7 +1,20 @@
 {
-  "presets": ["flow", "env", "react", "stage-0"],
+  "presets": [
+    "@babel/preset-react",
+    "@babel/preset-typescript",
+    [
+      "@babel/preset-env",
+      {
+        "targets": {
+          "browsers": ["last 2 versions"]
+        },
+        "modules": false
+      }
+    ]
+  ],
   "plugins": [
-    "transform-runtime",
-    ["relay", {"schema": "test/fixtures/graphql/schema.json"}]
+    "@babel/plugin-transform-modules-commonjs",
+    "@babel/plugin-proposal-class-properties",
+    "relay"
   ]
-}
+}

.gitignore

@@ -1,7 +1,12 @@
+.docz
 .DS_Store
-npm-debug.log
+.idea/
+.vscode/
+
 node_modules
-.idea
-coverage
-lib
+npm-debug.log
+
+__vcr__/
 __generated__/
+coverage/
+lib/

.npmignore

@@ -1,7 +1,14 @@
+.docz
 .DS_Store
-npm-debug.log
+.idea/
+.vscode/
+
 node_modules
-.idea
-coverage
-docs
+npm-debug.log
+
+doczrc.js
+
+__vcr__/
 __generated__/
+coverage/
+docs/

.travis.yml

@@ -4,9 +4,8 @@ install: true
 cache: yarn
 
 node_js:
-  - '6'
   - '8'
-  - '9'
+  - '10'
 
 install:
   - yarn install
@@ -16,4 +15,4 @@ script:
   - yarn test
 
 after_success:
-  - bash <(curl -s https://codecov.io/bash)
+  - bash <(curl -s https://codecov.io/bash)

README.md

@@ -12,7 +12,7 @@
   <a href="https://github.com/releasy/react-releasy/issues"><img src="https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat"></a>
 </p>
 
-## Installation
+## Installation 
 
 With Yarn:
 
@@ -30,7 +30,7 @@ npm install --save-dev relay-devtools
 
 ## Usage
 
-Using `Releasy` is quite simple, first we need to create an instance of our [Config](docs/classes/Config.md) class:
+Using `Releasy` is quite simple, first we need to create an instance of our [Config](/core/config) class:
 
 ```javascript
 import { Config, InMemoryCache, Link } from 'react-releasy';
@@ -47,7 +47,7 @@ const config = new Config({
 });
 ```
 
-Then we need to wrap the application with a [ReleasyProvider](docs/components/ReleasyProvider.md):
+Then we need to wrap the application with a [ReleasyProvider](/components/releasy-provider):
 
 ```javascript
 import { ReleasyProvider } from 'react-releasy';
@@ -62,77 +62,45 @@ ReactDOM.render(
 
 ## Examples
 
-Let's start making a simple [query](docs/hocs/query.md):
+Let's start making a simple [Query](/components/query):
 
 ```javascript
 import { graphql } from 'react-relay';
-import { query } from 'react-releasy';
-
-const MyComponent = ({ error, isFetching, me }) => {
-  if (error) {
-    return `Error: ${error.message}`;
-  }
-
-  if (isFetching) {
-    return 'Loading...';
-  }
-
-  return `My name is ${me.name}`;
-}
-
-export default query(
-  graphql`
-    query MyComponentMeQuery {
-      me {
-        name
-      }
-    }
-  `
-)(MyComponent);
-```
-
-If you want to implement your own abstraction of [Relay QueryRenderer](https://facebook.github.io/relay/docs/en/query-renderer.html) or even create some [mutations](https://facebook.github.io/relay/docs/en/mutations.html), we can use [withReleasy](docs/hocs/withReleasy.md) to get the `environment`:
-
-```javascript
-import React from 'react';
-import { QueryRenderer, graphql } from 'react-relay';
-import { withReleasy } from 'react-releasy';
-
-const MyComponent = ({ environment }) => (
-  <QueryRenderer
-    environment={environment}
-    query={graphql`
-      query MyComponentMeQuery {
-        me {
-          id
+import { Query } from 'react-releasy';
+
+const MyComponent = () => {
+  return (
+    <Query
+      query={graphql`
+        query MyComponentMeQuery {
+          me {
+            name
+          }
+        }
+      `}
+    >
+      {({ me, isFetching, error }) => {
+        if (error) {
+          return `Error: ${error.message}`;
         }
-      }
-    `}
-    render={({ error, props }) => {
-      if (error) {
-        return error.message;
-      }
-
-      if (props) {
-        return props.me.id;
-      }
 
-      return 'loading';
-    }}
-  />
-);
+        if (isFetching) {
+          return 'Loading...';
+        }
 
-export default withReleasy(MyComponent);
+        return `My name is ${me.name}`;
+      })}
+    </Query>
+  );
+}
 ```
 
-Also, we can get it directly using `getEnvironment`:
+Also, we can commit a mutation using `getEnvironment`:
 
 ```javascript
 import { graphql, commitMutation } from 'react-relay';
 import { getEnvironment } from 'react-releasy';
 
-const environment = getEnvironment();
-
 const mutation = graphql`
   mutation ChangeNameMutation($input: ChangeNameInput!) {
     ChangeName(input: $input) {
@@ -147,7 +115,7 @@ const mutation = graphql`
 let tempID = 0;
 
 const commit = (name) => {
-  return commitMutation(environment, {
+  return commitMutation(getEnvironment(), {
     mutation,
     variables: {
       input: {

docs/components/Query.mdx

@@ -0,0 +1,14 @@
+---
+name: Query
+menu: Components
+route: /components/query
+---
+
+import { PropsTable } from 'docz'
+import { Query } from '../../src'
+
+# Query
+
+## Properties
+
+<PropsTable of={Query} />