submit action - run with enter

packages/web/src/modals/ChangeDownloadUrlModal.js

@@ -12,10 +12,19 @@ export default function ChangeDownloadUrlModal({ modalState, url = '', onConfirm
   // React.useEffect(() => {
   //   if (textFieldRef.current) textFieldRef.current.focus();
   // }, [textFieldRef.current]);
-  const handleSubmit = async (values) => {
-    onConfirm(values.url);
-    modalState.close();
-  };
+
+  // const handleSubmit = () => async (values) => {
+  //   onConfirm(values.url);
+  //   modalState.close();
+  // };
+
+  const handleSubmit = React.useCallback(
+    async (values) => {
+      onConfirm(values.url);
+      modalState.close();
+    },
+    [modalState, onConfirm]
+  );
   return (
     <ModalBase modalState={modalState}>
       <ModalHeader modalState={modalState}>Download imported file from web</ModalHeader>

packages/web/src/modals/ConfirmModal.js

@@ -3,22 +3,26 @@ import ModalBase from './ModalBase';
 import FormStyledButton from '../widgets/FormStyledButton';
 import ModalFooter from './ModalFooter';
 import ModalContent from './ModalContent';
+import { FormSubmit } from '../utility/forms';
+import { FormProvider } from '../utility/FormProvider';
 
 export default function ConfirmModal({ message, modalState, onConfirm }) {
   return (
-    <ModalBase modalState={modalState}>
-      <ModalContent>{message}</ModalContent>
+    <FormProvider>
+      <ModalBase modalState={modalState}>
+        <ModalContent>{message}</ModalContent>
 
-      <ModalFooter>
-        <FormStyledButton
-          value="OK"
-          onClick={() => {
-            modalState.close();
-            onConfirm();
-          }}
-        />
-        <FormStyledButton type="button" value="Close" onClick={modalState.close} />
-      </ModalFooter>
-    </ModalBase>
+        <ModalFooter>
+          <FormSubmit
+            value="OK"
+            onClick={() => {
+              modalState.close();
+              onConfirm();
+            }}
+          />
+          <FormStyledButton type="button" value="Close" onClick={modalState.close} />
+        </ModalFooter>
+      </ModalBase>
+    </FormProvider>
   );
 }

packages/web/src/modals/ModalBase.js

@@ -70,6 +70,7 @@ export default function ModalBase({ modalState, children, isFlex = false, fullSc
       overlayClassName="RactModalOverlay"
       fullScreen={fullScreen}
       isFlex={isFlex}
+      ariaHideApp={false}
       // style={{
       //   overlay: {
       //     backgroundColor: '#000',