Render our field components with React.createElement

Without this, we get some bad behaviors:
* Cannot use React.memo'd components
* Cannot switch between UseField components (causes a "change in the
  order of hooks" error from React)

src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_field.tsx

@@ -49,7 +49,7 @@ function UseFieldComp<T = unknown>(props: Props<T>) {
   } = props;
 
   const form = useFormContext();
-  const componentToRender = component ?? 'input';
+  const ComponentToRender = component ?? 'input';
   // For backward compatibility we merge the "componentProps" prop into the "rest"
   const propsToForward =
     componentProps !== undefined ? { ...componentProps, ...rest } : { ...rest };
@@ -91,9 +91,9 @@ function UseFieldComp<T = unknown>(props: Props<T>) {
     return children!(field);
   }
 
-  if (componentToRender === 'input') {
+  if (ComponentToRender === 'input') {
     return (
-      <input
+      <ComponentToRender
         type={field.type}
         onChange={field.onChange}
         value={(field.value as unknown) as string}
@@ -102,7 +102,7 @@ function UseFieldComp<T = unknown>(props: Props<T>) {
     );
   }
 
-  return componentToRender({ field, ...propsToForward });
+  return <ComponentToRender {...{ field, ...propsToForward }} />;
 }
 
 export const UseField = React.memo(UseFieldComp) as typeof UseFieldComp;