import React from 'react';
import { useRenderProps, wrap } from 'react-hooks-render-props';

const RandomNumber = ({ children }) => (
  <div>
    {children(Math.random())}
  </div>
);

const NumberWithRenderProps = () => (
  <RandomNumber>
    {value => <div>{value}</div>}
  </RandomNumber>
);

const NumberWithCustomHook = wrap(() => {
  const [value] = useRenderProps(RandomNumber);
  return (
    <div>{value}</div>
  );
});

const App = () => (
  <div>
    <NumberWithRenderProps />
    <NumberWIthCustomHook />
  </div>
);