babel-plugin-jsx-adopt
This plugin transforms
adopt
calls to render props. Idea based on this gist. ⚠️ Experimental: Code you are likely to write should be transformed just fine, convoluted/edge cases might not be covered yet.
Example
Input
const Example = { const theme = const counter = const toggle = return <div style= color: theme === 'light' ? '#000' : '#fff' > <span>`Count: `</span> <button onClick=toggle>'Toggle'</button> </div> }
Output
const Example = { return <Theme> <Counter> <Toggle> <div style= color: theme === 'light' ? '#000' : '#fff' > <span>`Count: `</span> <button onClick=toggle>'Toggle'</button> </div> </Toggle> </Counter> </Theme> }
Installation
npm install --save-dev babel-plugin-jsx-adopt
If you want to use it with babel@7, you should also install babel-core@^7.0.0-0
(just to prevent peer dep warnings).
Usage
.babelrc
(Recommended)
Via .babelrc
Via CLI
babel --plugins babel-plugin-jsx-adopt script.js
Via Node API