Inline dialog

An inline dialog is a pop-up container for small amounts of information. It can also contain controls.

#Default

Use an inline dialog for a short explanation next to the control it belongs to.

import { Button, Popup } from '@wolf-rayet/react';

<Popup
  isOpen={open}
  onClose={() => setOpen(false)}
  isDialog
  label="How routing works"
  trigger={() => <Button isSelected={open} onClick={() => setOpen((v) => !v)}>How routing works</Button>}
  content={
    <p style={{ margin: 0 }}>
      New conversations go to the bot first. If it cannot answer in two replies, the conversation moves to the
      human queue.
    </p>
  }
/>