Use React components inside Svelte apps.
This repo is the mirror of RichHarris/react-svelte with some bonus given we also add MaterialUI to the mix here.
<script>
import Button from "@material-ui/core/Button";
import { ReactAdapter } from "svelte-react-kit";
</script>
<ReactAdapter
el={Button}
class="mui-btn"
children="Hello"
variant="contained"
color="primary"
onClick={() => alert("hello world!")}
/>
<style>
/**
* Styling a React Component from within a Svelte Component.
*/
:global(.mui-btn) {
margin: 20px;
}
</style>
Check the live demo here, and don't forget to see the BlogPost: Using React Within Svelte Apps.
npm i svelte-react-kit
You can also check a sample app here.