Render React Component to HTML String with Type-Safe Prop Validation

render.tsx

import { renderToStaticMarkup } from 'react-dom/server';
import { type ComponentType } from 'react';

/**
 * Converts a specified React component to its HTML string representation.
 * @param Component A React component to be rendered, for instance, `AccountSignInEmail`.
 * @param props An object containing the props to be passed to the Component. Type safety is enforced.
 * @returns The HTML string representation of the rendered component.
 */
export const render = <P extends object>(Component: ComponentType<P>, props: P): string =>
  renderToStaticMarkup(<Component {...props} />);