sys.net.webrtc: UI.<Connect>

Design Goal: Network connection UI setup (data and/or video) with only a "single line of code™️" setup.

Components:

sys.ui.webrtc.ui.PeerInput
sys.ui.webrtc.ui.Connect
sys.ui.webrtc.ui.GroupVideo

Usage:

const self = await Connect.peer();  // ← NB: optional, explicitly secifying the peer.
<Connect.Stateful self={self} onChange={(e) => state.change((d) => {/**/})} />

Single line entry:

<Connect.Stateful self={self} onChange={ /* ... */ }} />

Within DevHarness spec:

e.it('ui:header', async (e) => {
  const dev = Dev.tools<T>(e, initial);
  const state = await dev.state();

  dev.header.border(-0.1).render((e) => {
    return (
      <Connect.Stateful
        margin={[0, 0, 20, 0]}
        onChange={(e) =>
          state.change((d) => {
            d.props.selected = e.selected;
            d.props.client = e.client;
          })
        }
      />
    );
  });
});

Single line entry:

<Connect.Stateful onChange={ /* ... */ }} />

cellplatform / platform-0.2.0

sys.net.webrtc: UI.<Connect> #144