feat!: react upgrade

.babelrc

@@ -1,13 +1,20 @@
 {
   "presets": [
-    "@babel/preset-env",
+    ["@babel/preset-env", {
+      "targets": {
+        "node": "current"
+      },
+      "modules": false
+    }],
     "@babel/preset-react"
   ],
   "plugins": [
     "@babel/plugin-proposal-class-properties",
     "@babel/plugin-proposal-json-strings",
     "@babel/plugin-syntax-dynamic-import",
     "@babel/plugin-syntax-import-meta",
-    "@babel/plugin-transform-runtime"
+    "@babel/plugin-transform-runtime",
+    "@babel/plugin-proposal-optional-chaining",
+    "@babel/plugin-proposal-nullish-coalescing-operator"
   ]
 }

app.js

@@ -11,110 +11,16 @@ require('./scss/application.scss');
 const url = '/api/formdata';
 const saveUrl = '/api/formdata';
 
-const TestComponent = () => <h2>Hello</h2>;
-
-// const MyInput = React.forwardRef((props, ref) => {
-//   const { name, defaultValue, disabled } = props;
-//   return (
-//     <>
-//       <label style={{ marginRight: '1rem' }}><b>{ props.data.label }</b></label>
-//       <input ref={ref} name={name} defaultValue={defaultValue} disabled={disabled} />;
-//     </>
-//   );
-// });
-
-// Registry.register('MyInput', MyInput);
-// Registry.register('TestComponent', TestComponent);
-
-// const items = [{
-//     key: 'Header',
-//   }, {
-//     key: 'TextInput',
-//   }, {
-//     key: 'TextArea',
-//   }, {
-//     key: 'RadioButtons',
-//   }, {
-//     key: 'Checkboxes',
-//   }, {
-//     key: 'Image',
-//   },
-//   {
-//     key: 'FieldSet',
-//     label:"Field Set",
-//     name:"Field Set",
-
-//   },
-//   {
-//     group_name: 'Multi Column Row',
-//     key: 'TwoColumnRow'
-//   },
-//   {
-//     group_name: 'Multi Column Row',
-//     key: 'ThreeColumnRow'
-//   },
-//   {
-//     group_name: 'Multi Column Row',
-//     key: 'FourColumnRow',
-//     element: 'MultiColumnRow',
-//   },
-//   {
-//     group_name: 'Multi Column Row',
-//     key: 'FiveColumnRow',
-//     element: 'MultiColumnRow',
-//   },  
-//   {
-//     group_name: 'Multi Column Row',
-//     key: 'SixColumnRow',
-//     element: 'MultiColumnRow',
-//   },
-//   {
-//     group_name: 'Custom Element',
-//     key: 'TestComponent',
-//     element: 'CustomElement',
-//     component: TestComponent,
-//     type: 'custom',
-//     field_name: 'test_component',
-//     name: 'Something You Want',
-//     icon: 'fa fa-cog',
-//     static: true,
-//     props: { test: 'test_comp' },
-//     label: 'Label Test',
-//   },
-//   {
-//     group_name: 'Custom Element',
-//     key: 'MyInput',
-//     element: 'CustomElement',
-//     component: MyInput,
-//     type: 'custom',
-//     forwardRef: true,
-//     bare: true,
-//     field_name: 'my_input_',
-//     name: 'My Input',
-//     icon: 'fa fa-cog',
-//     props: { test: 'test_input' },
-//     label: 'Label Input',
-//   },
-// ];
-
-
 const App = () => (
   <FormBuilder.ReactFormBuilder
     variables={variables}
     url={url}
     saveUrl={saveUrl}
     locale='en'
     saveAlways={false}
-    // toolbarItems={items}
-
   />);
 
 ReactDOM.render(
   <App />,
   document.getElementById('form-builder'),
 );
-
-ReactDOM.render(
-  <DemoBar variables={variables} />,
-  document.getElementById('demo-bar'),
-);

jquery-stub.js

@@ -1 +1 @@
-module.exports = null;
+export default null