<demo>

### Four ways to trigger

Mouse to click, right click, focus and move in.

```jsx live
() => {
  const content = (
    <div>
      <div>This is the content</div>
      <div>This is the content</div>
    </div>
  );

  return (
    <>
      <Popover content={content} title="Title" trigger="hover">
        <Button>Hover me</Button>
      </Popover>
      <Popover content={content} title="Title" trigger="focus">
        <Button>Focus me</Button>
      </Popover>
      <Popover content={content} title="Title" trigger="click">
        <Button>Click me</Button>
      </Popover>
      <Popover content={content} title="Title" trigger="context-menu">
        <Button>Right Click me</Button>
      </Popover>
    </>
  );
}
```

</demo>
