fix: removed react-dom

package.json

@@ -105,7 +105,6 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^2.0.4",
     "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-scripts": "^3.4.1",
     "semantic-release": "^22.0.7",
     "size-limit": "^4.10.2"

src/fields/array/index.js

@@ -4,7 +4,7 @@ import render from './render'
 import ErrorMessage from './errorMessage'
 import LabelRenderer from '../chunks/label'
 
-import PlatformContainer from '../../platform/container'
+import PlatformContainer from '../../platform/container/index.native.js'
 
 export default (props) => {
   const {
@@ -44,13 +44,13 @@ export default (props) => {
           component="div"
           className={"error-message"} /> : null}
     </PlatformContainer>
-    <style jsx>{`      
+    <style jsx>{`
       .error-message {
-        padding-top: 0.5rem; 
+        padding-top: 0.5rem;
         font-size: 0.875rem;
-        line-height: 1.25rem; 
+        line-height: 1.25rem;
         color: #DC2626;
       }
     `}</style>
   </React.Fragment>
-}
+}

src/fields/array/render/chunks/add.js

@@ -1,5 +1,6 @@
-import PlatformButton from '../../../../platform/button'
-import PlatformContainer from '../../../../platform/container'
+import PlatformButton from '../../../../platform/button/index.native.js'
+import PlatformContainer from '../../../../platform/container/index.native.js'
+import React from 'react'
 
 export default ({ onAdd, title, disabled }) => <PlatformContainer
   style={{ "display": "flex", "marginTop": "2.5rem", "marginBottom": "2.5rem", "justifyContent": "center" }}>

src/fields/array/render/index.dnd.todo.js

@@ -5,6 +5,7 @@ import Add from './chunks/add'
 import * as ReactDOM from 'react-dom'
 import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"
 
+import React from 'react'
 
 export default (props) => {
   const {
@@ -104,7 +105,7 @@ export default (props) => {
               ref={provided.innerRef}
               // style={getListStyle(snapshot.isDraggingOver)}
               className={`
-                p-2 
+                p-2
                 bg-red-100
                 transition-all
                 ease-in-out
@@ -345,4 +346,4 @@ const getItemStyle = (isDragging, draggableStyle) => ({
 
   // styles we need to apply on draggables
   ...draggableStyle
-})
+})

src/fields/array/render/index.js

@@ -3,7 +3,7 @@ import { Field, FastField, ErrorMessage as BaseErrorMesssage, } from 'formik'
 import componentResolver from '../../componentResolver'
 import AddButton from './chunks/add'
 import * as ReactDOM from 'react-dom'
-import PlatformContainer from '../../../platform/container'
+import PlatformContainer from '../../../platform/container/index.native.js'
 import React from 'react'
 
 export default (props) => {
@@ -340,16 +340,16 @@ export default (props) => {
         })()
       }
     </PlatformContainer>
-    <style jsx>{`      
-      
+    <style jsx>{`
+
       .renderer {
-        padding: 0.5rem; 
+        padding: 0.5rem;
       }
       .error-message {
         /* text-sm text-red-600 pt-2 */
-        padding-top: 0.5rem; 
+        padding-top: 0.5rem;
         font-size: 0.875rem;
-        line-height: 1.25rem; 
+        line-height: 1.25rem;
         color: #DC2626;
       }
     `}</style>

src/fields/chunks/label/index.js

@@ -1,20 +1,20 @@
 import React from 'react'
 import PlatformText from '../../../platform/text'
-import PlatformContainer from '../../../platform/container'
+import PlatformContainer from '../../../platform/container/index.native.js'
 
 export default (props) => {
-    const { label, hideLabel } = props.item
-    if (hideLabel || !label) {
-        return null
-    }
+  const { label, hideLabel } = props.item
+  if (hideLabel || !label) {
+    return null
+  }
 
-    return <React.Fragment>
-        <PlatformContainer
-            style={{
-                marginBottom: "0.5rem",
-            }}
-        >
-            <PlatformText>{label}</PlatformText>
-        </PlatformContainer>
-    </React.Fragment>
-}
+  return <React.Fragment>
+    <PlatformContainer
+      style={{
+        marginBottom: "0.5rem",
+      }}
+    >
+      <PlatformText>{label}</PlatformText>
+    </PlatformContainer>
+  </React.Fragment>
+}

src/fields/index.js

@@ -2,7 +2,7 @@ import React from 'react'
 import { Form } from 'formik'
 import ArrayField from './array'
 import SingleField from './single'
-import * as ReactDOM from 'react-dom'
+// import * as ReactDOM from 'react-dom'
 
 
 export default (props) => {

src/fields/single/index.js

@@ -3,7 +3,7 @@ import { Field, ErrorMessage, FastField } from 'formik'
 import componentResolver from '../componentResolver'
 import { nanoid } from 'nanoid'
 import LabelRenderer from '../chunks/label'
-import PlatformContainer from '../../platform/container'
+import PlatformContainer from '../../platform/container/index.native.js'
 
 export default (props) => {
   const { item: {
@@ -88,12 +88,12 @@ export default (props) => {
         }}
       </Renderer>
     </PlatformContainer>
-    <style jsx>{`   
+    <style jsx>{`
       .error-message {
         margin-top: 1.5rem;
         text-align: center;
         color: #DC2626;
       }
     `}</style>
   </React.Fragment>
-}
+}