From 5439bda3901fbb69e1b18673b50594ba3c2ffc52 Mon Sep 17 00:00:00 2001
From: Stanislav Permiakov <Stanislav.Permiakov@primark.onmicrosoft.com>
Date: Fri, 20 Jan 2023 13:16:50 +0300
Subject: [PATCH] #2108 - Input fields in some modals lose focus when typing

---
 .../src/script/ui/component/form/input.tsx           | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/ketcher-react/src/script/ui/component/form/input.tsx b/packages/ketcher-react/src/script/ui/component/form/input.tsx
index 8630c11e06..0a2e65ec87 100644
--- a/packages/ketcher-react/src/script/ui/component/form/input.tsx
+++ b/packages/ketcher-react/src/script/ui/component/form/input.tsx
@@ -331,6 +331,10 @@ function componentMap(props: Props) {
   return type === 'radio' ? FieldSet : Select
 }
 
+const AnyComponentWithRef = React.forwardRef(
+  ({ Component, ...props }: any, ref) => <Component {...props} innerRef={ref} />
+)
+
 class Input extends PureComponent<
   Props & { innerRef: React.Ref<HTMLInputElement> }
 > {
@@ -351,14 +355,10 @@ class Input extends PureComponent<
 
   render() {
     const { children, onChange, ...restProps } = this.props
-    const Component = this.component
-
-    const ComponentWithRef = React.forwardRef((props, ref) => (
-      <Component {...props} innerRef={ref} />
-    ))
 
     return (
-      <ComponentWithRef
+      <AnyComponentWithRef
+        Component={this.component}
         ref={this.props.innerRef}
         {...this.ctrl}
         {...restProps}