integrate examples into gatsby (#207)

.flowconfig

@@ -1,6 +1,5 @@
 [ignore]
 <PROJECT_ROOT>/examples/.*
-<PROJECT_ROOT>/modules/svg/.*
 
 <PROJECT_ROOT>/node_modules/jsonlint-lines-primitives/.*
 <PROJECT_ROOT>/website/node_modules/.*

examples/overlays/example.js

@@ -1,7 +1,7 @@
 // @flow
 import window from 'global/window';
 import React, { Component } from 'react';
-import DeckGL from 'deck.gl';
+import DeckGL from '@deck.gl/react';
 import { StaticMap } from 'react-map-gl';
 
 import { HtmlOverlay, HtmlClusterOverlay, HtmlOverlayItem } from '@nebula.gl/overlays';

examples/react-editor-lite/README.md

@@ -4,7 +4,7 @@
 
 ## Example: react-editor-lite
 
-Demonstrates how to draw with `@nebula.gl/react-editor` 
+Demonstrates how to draw with `@nebula.gl/react-editor-lite` 
 
 ```
     npm install

website/gatsby-config.js

@@ -1,5 +1,7 @@
 const {getGatsbyConfig} = require('ocular-gatsby/api');
-
 const config = require('./ocular-config');
 
-module.exports = getGatsbyConfig(config);
+const gatsbyConfig = getGatsbyConfig(config);
+gatsbyConfig.plugins.push('gatsby-plugin-flow');
+
+module.exports = gatsbyConfig;

website/ocular-config.js

@@ -21,9 +21,11 @@ const ALIASES = {
 
   '@deck.gl/core': resolve(LIB_DIR, './node_modules/@deck.gl/core'),
   '@deck.gl/layers': resolve(LIB_DIR, './node_modules/@deck.gl/layers'),
+  '@deck.gl/react': resolve(LIB_DIR, './node_modules/@deck.gl/react'),
 
   // Use luma.gl specified by root package.json
-  'luma.gl': resolve(LIB_DIR, './node_modules/luma.gl'),
+  '@luma.gl/core': resolve(LIB_DIR, './node_modules/@luma.gl/core'),
+  '@luma.gl/webgl': resolve(LIB_DIR, './node_modules/@luma.gl/webgl'),
   // Important: ensure shared dependencies come from the main node_modules dir
   // Versions will be controlled by the deck.gl top level package.json
   'math.gl': resolve(LIB_DIR, './node_modules/math.gl'),
@@ -98,31 +100,16 @@ module.exports = {
   ADDITIONAL_LINKS: [],
 
   EXAMPLES: [
-    // {
-    //   title: 'Nebula-Deck',
-    //   componentUrl: resolve(__dirname, '../examples/deck/example.js'),
-    //   path: 'examples/deck'
-    // }
-    // {
-    //   title: 'ClusteringOverlayExample',
-    //   path: 'examples/core/cubemap/',
-    //   image: 'images/example-cubemap.jpg'
-    // },
-    // {
-    //   title: 'EditPointsExample',
-    //   path: 'examples/core/mandelbrot/',
-    //   image: 'images/example-mandelbrot.jpg'
-    // },
-    // {
-    //   title: 'EditPolygonsExample',
-    //   path: 'examples/core/quasicrystals/',
-    //   image: 'images/example-fragment.jpg'
-    // },
-    // {
-    //   title: 'WorldHeritageExample',
-    //   path: 'examples/core/persistence/',
-    //   image: 'images/example-persistence.jpg'
-    // }
+    {
+      title: 'EditableGeoJsonLayer',
+      componentUrl: resolve(__dirname, '../examples/deck/example.js'),
+      path: 'examples/editablegeojsonlayer'
+    },
+    {
+      title: 'Overlays',
+      componentUrl: resolve(__dirname, '../examples/overlays/example.js'),
+      path: 'examples/overlays'
+    }
   ],
 
   // Avoids duplicate conflicting inputs when importing from examples folders

website/package.json

@@ -25,11 +25,14 @@
     "@luma.gl/core": "^7.0.0",
     "@luma.gl/webgl": "^7.0.0",
     "@probe.gl/stats-widget": "^3.0.1",
+    "gl": "^4.2.2",
     "react": "^16.6.0",
-    "react-dom": "^16.6.0"
+    "react-dom": "^16.6.0",
+    "react-map-gl": "^4.1.2"
   },
   "devDependencies": {
     "gatsby": "^2.3.0",
+    "gatsby-plugin-flow": "^1.0.5",
     "gatsby-plugin-styletron": "^3.0.5",
     "gh-pages": "^2.0.1",
     "ocular-gatsby": "1.0.0-alpha.23",