Update for Blocks public beta

Author: rvanasa

.eslintrc

@@ -4,8 +4,6 @@
     "standard",
     "standard-react",
     "plugin:prettier/recommended",
-    "prettier/standard",
-    "prettier/react",
     "plugin:@typescript-eslint/eslint-recommended"
   ],
   "env": {

.idea/watcherTasks.xml

@@ -10,31 +10,78 @@
 npm install --save react-blocks-editor
 ```
 
-## Usage
+## Quick Start
 
 ```tsx
 import React from 'react'
+import ReactDOM from 'react-dom'
 import BlocksEditor from 'react-blocks-editor'
 
-const MyEditor = () => {
-  const options = {
-    menu: 'hidden' // default: undefined
+ReactDOM.render(
+  <BlocksEditor />,
+  document.getElementById('root'),
+)
+```
+
+## Advanced Usage
+
+```tsx
+import React from 'react'
+import { BlocksEditor, EditorState } from 'react-blocks-editor'
+
+const App = () => {
+
+  // Called whenever the user changes (or manually saves) the editor state
+  const handleSave = (state: EditorState) => {
+    console.log('Editor state:', state)
   }
 
   return (
-    <BlocksEditor style={{ width: '100%', height: 400 }} options={options}>
+    <BlocksEditor
+      style={{ height: '100vh' }}
+      options={{
+        theme: 'dark',
+        menu: 'hidden',
+        tutorial: 'hello-world'
+      }}
+      onSave={handleSave}>
+
       {({ loadState }) => {
-        console.log('Loaded iframe.')
+        console.log('Loaded editor iframe.')
 
+        // Load a specific project state (.blocks JSON format).
         loadState({
           name: 'Project name',
           description: 'Project description',
-          nodes: [{...}]
+          nodes: {
+            // Text block
+            'message': {
+              type: 'LiteralText',
+              position: [0, 0],
+              data: {
+                value: 'Hello world!'
+              },
+              outputs: {
+                value: [{
+                  // Reference to 'motoko' node and 'value' input socket
+                  node: 'motoko',
+                  input: 'input'
+                }]
+              }
+            },
+            // Motoko compiler block
+            'motoko': {
+              type: 'CompileMotoko',
+              position: [250, 0]
+            }
+          }
         })
       }}
     </BlocksEditor>
   )
 }
+
+export default App
 ```
 
 ---

README.md

@@ -0,0 +1,5 @@
+This example was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+It is linked to the react-blocks-editor package in the parent directory for development purposes.
+
+You can run `npm install` and then `npm start` to test your package.