Drawer

Live demo

Code

import { Modal } from '@shieldpay/bumblebee/modal';

<Modal
  closeDialogText="close"
  open={modalOpen}
  onClose={() => setModalOpen(false)}
  dismissable
>
  <Modal.Title>Modal with two buttons</Modal.Title>
  <Text paragraph size="small">
    Modal dialog body text describing what the user needs to do next and why
    they need to do it.
  </Text>
  <Modal.Actions>
    <Button onClick={() => setModalOpen(false)}>Primary</Button>
    <Button onClick={() => setModalOpen(false)} variant="outline">
      Secondary
    </Button>
  </Modal.Actions>
</Modal>;

Drawer

Contents

Live demo

Drawer title

Drawer title

Code