Add ReactScreen

[jdpigeon]

This PR introduces a new type of screen that can be used to integrate React components into lab.js.

Usage is very simple

const Hello: React.FC<{ toWhat: string }> = (props) => {
  return <div>Hello {props.toWhat}</div>;
};

const experiment = new lab.flow.Sequence({
  content: [
    new ReactScreen({
      component: Hello,
      props: { toWhat: "World" } 
    })
  ]
})

[FelixHenninger]

Hej Dano, thanks, this is fantastic! I think this is a great addition to the library, and something we should add for sure -- I don't see any blockers here.

I'm worried about a slightly auxiliary issue, and that's bundling react with the library -- with the PR, both the distribution and development version roughly double in size, which feels a lot to me. I wonder whether we can somehow provide react as an optional external dependency, rather than bundling it by default? My hunch is that larger applications using react are going to bundle the library themselves, so I'm not sure we need to ship it in the default bundle. So, I'm wondering whether it would be possible to add react as an optional dependency? As an alternative, we could also add a (third) library flavor that includes the react screen and the react library.

What do you think? Thanks a lot for all of your efforts, I truly appreciate it! Again, this is something we should absolutely include (as we have discussed before), I'd love to figure out the bundling.

Kind regards, and many thanks, -Felix

[jdpigeon]

Hej Dano, thanks, this is fantastic! I think this is a great addition to the library, and something we should add for sure -- I don't see any blockers here.

I'm worried about a slightly auxiliary issue, and that's bundling react with the library -- with the PR, both the distribution and development version roughly double in size, which feels a lot to me. I wonder whether we can somehow provide react as an optional external dependency, rather than bundling it by default? My hunch is that larger applications using react are going to bundle the library themselves, so I'm not sure we need to ship it in the default bundle. So, I'm wondering whether it would be possible to add react as an optional dependency? As an alternative, we could also add a (third) library flavor that includes the react screen and the react library.

What do you think? Thanks a lot for all of your efforts, I truly appreciate it! Again, this is something we should absolutely include (as we have discussed before), I'd love to figure out the bundling.

Kind regards, and many thanks, -Felix

Thanks for looking into the bundle issue a bit more. I agree that increasing the bundle size that much is not great. Let's continue with the original plan of creating a new lab.js-react package for this screen

[jdpigeon]

I also found it necessary in our library to provide another option, containerStyle, for allowing the parent div to be styled. Will include it.

[FelixHenninger]

Let's discuss the status on this -- IIRC we discussed moving it into a separate package, but maybe I'm mistaken. Otherwise I just rebased my local branch and things are looking great, would love to have this in main.