1.7.0-beta4

Added JSON linting back into <SourceTypeEditor/>

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "maputnik",
-  "version": "1.7.0-beta3",
+  "version": "1.7.0-beta4",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "maputnik",
-  "version": "1.7.0-beta3",
+  "version": "1.7.0-beta4",
   "description": "A MapboxGL visual style editor",
   "main": "''",
   "scripts": {

src/components/sources/SourceTypeEditor.jsx

@@ -214,6 +214,11 @@ class GeoJSONSourceJSONEditor extends React.Component {
       <JSONEditor
         layer={this.props.source.data}
         maxHeight={200}
+        mode={{
+          name: "javascript",
+          json: true
+        }}
+        lint={true}
         onChange={data => {
           this.props.onChange({
             ...this.props.source,

src/components/util/codemirror-mgl.js

@@ -12,6 +12,30 @@ CodeMirror.defineMode("mgl", function(config, parserConfig) {
   );
 });
 
+CodeMirror.registerHelper("lint", "json", function(text) {
+  const found = [];
+
+  // NOTE: This was modified from the original to remove the global, also the
+  // old jsonlint API was 'jsonlint.parseError' its now
+  // 'jsonlint.parser.parseError'
+  jsonlint.parser.parseError = function(str, hash) {
+    const loc = hash.loc;
+    found.push({
+      from:    CodeMirror.Pos(loc.first_line - 1, loc.first_column),
+      to:      CodeMirror.Pos(loc.last_line  - 1, loc.last_column),
+      message: str
+    });
+  };
+
+  try {
+    jsonlint.parse(text);
+  }
+  catch(e) {
+    // Do nothing we catch the error above
+  }
+  return found;
+});
+
 CodeMirror.registerHelper("lint", "mgl", function(text, opts, doc) {
   const found = [];
   const {parser} = jsonlint;

src/styles/_toolbar.scss

@@ -16,8 +16,8 @@
 .maputnik-toolbar-logo {
   text-decoration: none;
   display: block;
-  flex: 0 0 180px;
-  width: 180px;
+  flex: 0 0 190px;
+  width: 190px;
   text-align: left;
   background-color: $color-black;
   padding: $margin-2;