I have a custom made component called CoolButton.
If I involve the component in another component like below, I'd somehow like to trigger the onClick-event, just like if it was a normal button.

A second question (not as important), is if it's possible to access the *Press Me*-value which was passed down the the CoolButton-component, in the child/CoolButton-Component. I'd much rather want *Press Me* to be dislayed instead of *I'm button*

```
export default function Home() {
  [timesClicked, setTimesClicked] = useState(0)

  return (
      <div className="home">
          <h1>Click the button!</h1>
          <div>The CoolButton has been clicked {timesClicked} times!</div>
          <CoolButton onClick={() => setTimesClicked(timesClicked + 1)}>Press Me</CoolButton>    
      </div>
  ); 
}

export default function CoolButton() {
  return (
      <div className="cool_button">
        <button>I'm button</button>
      </div>
  ); 
}

```