Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Next: Plan future API

See original GitHub issue

Perfect-world-wishful-thinking-optimal-API:

// Live is the default export and should render
// a nice output with minimal props

<Live
  code=""
  scope={{ SomeComponent }}
  renderEditor={Live.Editor}
  {...defaultProps}

  /* defaultProps: */
  transform={bubleTransform}
  transformOutput={bubleOutput}
  transformError={bubleErrors}
/>

//////////////

<LiveProvider code="">
  <Live.DefaultLayout>
    <Live.Editor />
    <Live.Preview />
    <Live.Error />
  </Live.DefaultLayout>
</LiveProvider>

// LiveProvider is an export and all "broken out"
// bits of react-live are exported

// Live.Editor is context wrapped
// but import { Editor } is also present

//////////////////

// The normal editor doesn't come with any defaults?
<Editor code="" language="jsx" Prism={...} theme={...} padding={...} />

Issue Analytics

State:
Created 5 years ago
Comments:6

Top GitHub Comments

2reactions

satya164commented, Aug 30, 2018

One feedback regarding the API, renderEditor={Live.Editor} should probably be editor={Live.Editor} or editorComponent={Live.Editor} to distinguish it from a render callback, or renderEditor={props => <Live.Editor {...props} />}

2reactions

jimthedevcommented, Aug 29, 2018

Regarding Bable/Babel. If Buble isn’t swapped out then it probably makes sense to contribute back to it on a few key tickets that follow some pretty commonly used features in the react/babel community that don’t currently work in react-live:

https://github.com/Rich-Harris/buble/issues/123 https://github.com/Rich-Harris/buble/pull/125