frontend/src/ReactComponent.js

import React from "react";
import { Streamlit } from "streamlit-component-lib";
const ReactComponent = ({ code }) => {
const Component = React.useMemo(() => {
try {
return new Function("React", return ${code})(React);
} catch (error) {
console.error("Error creating component:", error);
return () => <div>Error creating component: {error.message}</div>;
}
}, [code]);
React.useEffect(() => {
Streamlit.setFrameHeight();
}, [Component]);
return <Component />;
};
export default ReactComponent;
</antArtifact>