Someone will probably want this.

react_controller.js

import { Controller } from "stimulus"
import ReactDOM from "react-dom"
import React from "react"

/* HTML
  <div controller="react"
    data-react-component="HelloWorld"
    data-react-props="{ \"name\": \"Daniel\" }"
  />
*/
export default class ReactController extends Controller {
  connect() {
    ReactDOM.render(
      React.createElement(this.reactComponent, this.reactProps),
      this.element
    )
  }

  disconnect() {
    ReactDOM.unmountComponentAtNode(this.element)
  }

  get reactComponent() {
    const component = window.eval(this.data.react.component)
    if (!component) {
      throw "Component not available on window"
    }
    return component
  }

  get reactProps() {
    return JSON.parse(this.data.react.props)
  }
}

stimulus_component.jsx

import ReactDOM from "react-dom"
import React from "react"
import PropTypes from "prop-types"

/* JSX
   <StimulusComponent controller="hello.name">
     <input data-target="hello.name" type="text" />
   </StimulusComponent>
*/
export default class StimlusComponent extends React.Component {
  static propTypes = {
    controller: PropTypes.string.isRequired,
  }

  render() {
    return (
      <div data-controller={this.props.controller}>
        {this.props.children}
      </div>
    )
  }
}