feat: formData setter

package.json

@@ -68,7 +68,8 @@
     "comments": false,
     "plugins": [
       "@babel/plugin-proposal-object-rest-spread",
-      "@babel/plugin-proposal-class-properties"
+      "@babel/plugin-proposal-class-properties",
+      "@babel/plugin-proposal-optional-chaining"
     ]
   },
   "scripts": {
@@ -92,6 +93,7 @@
     "@babel/node": "^7.2.2",
     "@babel/plugin-proposal-class-properties": "^7.4.0",
     "@babel/plugin-proposal-object-rest-spread": "^7.4.0",
+    "@babel/plugin-proposal-optional-chaining": "^7.9.0",
     "@babel/preset-env": "^7.4.2",
     "@commitlint/cli": "^7.5.2",
     "@commitlint/config-angular": "^7.5.0",

src/js/components/data.js

@@ -75,7 +75,7 @@ export default class Data {
   }
   getData = () => {
     return Object.entries(this.data).reduce((acc, [key, val]) => {
-      acc[key] = val.data ? val.getData() : val
+      acc[key] = val?.data ? val.getData() : val
       return acc
     }, {})
   }

src/js/components/fields/edit-panel-item.js

@@ -376,7 +376,7 @@ export default class EditPanelItem {
       return segmentTypes[key](val)
     }
 
-    console.error(`${key}: invalid confirguration`)
+    console.error(`${key}: invalid condition attribute`)
   }
 
   get itemControls() {

src/js/components/fields/field.js

@@ -253,7 +253,7 @@ export default class Field extends Component {
     const prevData = clone(this.data)
     prevData.id = `prev-${this.id}`
 
-    if (this.data.config.editableContent) {
+    if (this.data?.config.editableContent) {
       prevData.attrs = Object.assign({}, prevData.attrs, { contenteditable: true })
     }
 

src/js/components/index.js

@@ -40,7 +40,8 @@ export class Components extends Data {
     }
   }
 
-  load = (formData, opts = Object.create(null)) => {
+  load = (formData, opts = this.opts || Object.create(null)) => {
+    this.empty()
     if (typeof formData === 'string') {
       formData = JSON.parse(formData)
     }

src/js/editor.js

@@ -52,6 +52,9 @@ export class FormeoEditor {
   get formData() {
     return this.Components.formData
   }
+  set formData(data) {
+    return this.load(data, this.opts)
+  }
   get json() {
     return this.Components.json
   }

tools/webpack.config.js

@@ -85,7 +85,7 @@ const extractTextLoader = !IS_PRODUCTION
   ? {
       loader: 'style-loader',
       options: {
-        sourceMap: !IS_PRODUCTION,
+        sourceMap: true,
       },
     }
   : MiniCssExtractPlugin.loader
@@ -126,7 +126,7 @@ const webpackConfig = {
             options: {
               camelCase: true,
               minimize: true,
-              sourceMap: !IS_PRODUCTION,
+              sourceMap: true,
             },
           },
           {
@@ -137,13 +137,13 @@ const webpackConfig = {
                   browsers: ['> 1%'],
                 }),
               ],
-              sourceMap: !IS_PRODUCTION,
+              sourceMap: true,
             },
           },
           {
             loader: 'sass-loader',
             options: {
-              sourceMap: !IS_PRODUCTION,
+              sourceMap: true,
             },
           },
         ],
@@ -157,7 +157,7 @@ const webpackConfig = {
       new UglifyJsPlugin({
         cache: true,
         parallel: true,
-        sourceMap: !IS_PRODUCTION,
+        sourceMap: true,
       }),
       new OptimizeCSSAssetsPlugin(),
     ],