React Base Fiddle (JSX)
Starting point for creating JSFiddles with React.
HTML
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<div id="container">
<!-- This element's contents will be replaced with your component. -->
</div>
Babel + JSX
const withDoubled = Comp => props => (
<Comp {...props} value={props.value * 2} />
);
const SomeInput = ({ onChange, value, disabled }) => (
<input value={value} disabled={disabled} onChange={e => onChange(e.target.value)}/>
);
const Doubled = withDoubled(SomeInput);
const MyCal = () => {
const [val, setVal] = React.useState(0);
return (
<React.Fragment>
<SomeInput value={val} onChange={setVal} />
<Doubled value={val} disabled />
</React.Fragment>
);
}
ReactDOM.render(
<MyCal />,
document.getElementById('container')
);