import * as React from 'react';

import {useState} from 'react';

export default function Toggle() {

  const [show, setShow] = useState(false);

  return (

    <>

      <h2>Toggle</h2>

      <div>

        <>

          <button onClick={() => setShow(s => !s)}>Show child</button>

          {show && ' '}

          {show && <Greeting>Hello</Greeting>}

        </>

      </div>

    </>

  );

}

function Greeting({children}) {

  return <p>{children}</p>;

}