fix(form-builder): remove BoundaryElementProvider in dialogs

sanity-io · Apr 26, 2021 · 8d663a7 · 8d663a7
1 parent a0b17e1
commit 8d663a7
Showing 1 changed file with 20 additions and 30 deletions.
diff --git a/packages/@sanity/form-builder/src/inputs/arrays/ArrayOfObjectsInput/item/EditDialog.tsx b/packages/@sanity/form-builder/src/inputs/arrays/ArrayOfObjectsInput/item/EditDialog.tsx
@@ -1,6 +1,6 @@
 import {Marker, Path, SchemaType} from '@sanity/types'
-import React, {useMemo, useState} from 'react'
-import {BoundaryElementProvider, Box, Dialog, Layer} from '@sanity/ui'
+import React, {useMemo} from 'react'
+import {Box, Dialog, Layer} from '@sanity/ui'
 import {FormFieldPresence, PresenceOverlay} from '@sanity/base/presence'
 import {FormBuilderInput} from '../../../../FormBuilderInput'
 import {PopoverDialog} from '../../../../transitional/PopoverDialog'
@@ -50,36 +50,30 @@ export function EditDialog(props: Props) {
     presence,
   ])
 
-  const [boundaryElement, setBoundaryElement] = useState<HTMLDivElement | null>(null)
-
   const content = (
-    <BoundaryElementProvider element={boundaryElement}>
-      <FormBuilderInput
-        type={type}
-        level={0}
-        value={isEmpty(value) ? undefined : value}
-        onChange={onChange}
-        onFocus={onFocus}
-        onBlur={onBlur}
-        compareValue={compareValue}
-        focusPath={focusPath}
-        readOnly={readOnly || type.readOnly || false}
-        markers={childMarkers}
-        path={[{_key: value._key}]}
-        filterField={filterField}
-        presence={childPresence}
-      />
-    </BoundaryElementProvider>
+    <FormBuilderInput
+      type={type}
+      level={0}
+      value={isEmpty(value) ? undefined : value}
+      onChange={onChange}
+      onFocus={onFocus}
+      onBlur={onBlur}
+      compareValue={compareValue}
+      focusPath={focusPath}
+      readOnly={readOnly || type.readOnly || false}
+      markers={childMarkers}
+      path={[{_key: value._key}]}
+      filterField={filterField}
+      presence={childPresence}
+    />
   )
 
   if (dialogType === 'fullscreen') {
     return (
       <Layer>
         <Dialog width="auto" id={value._key} onClose={onClose} key={value._key} header={title}>
           <PresenceOverlay margins={[0, 0, 1, 0]}>
-            <Box padding={4} ref={setBoundaryElement}>
-              {content}
-            </Box>
+            <Box padding={4}>{content}</Box>
           </PresenceOverlay>
         </Dialog>
       </Layer>
@@ -98,19 +92,15 @@ export function EditDialog(props: Props) {
         placement="auto"
         title={title}
       >
-        <PresenceOverlay margins={[0, 0, 1, 0]}>
-          <Box ref={setBoundaryElement}>{content}</Box>
-        </PresenceOverlay>
+        <PresenceOverlay margins={[0, 0, 1, 0]}>{content}</PresenceOverlay>
       </PopoverDialog>
     )
   }
 
   return (
     <Dialog width={1} id={value._key} onClose={onClose} key={value._key} header={title}>
       <PresenceOverlay margins={[0, 0, 1, 0]}>
-        <Box padding={4} ref={setBoundaryElement}>
-          {content}
-        </Box>
+        <Box padding={4}>{content}</Box>
       </PresenceOverlay>
     </Dialog>
   )