Using 'react-responsive-modal' with 'react-confirm'

Call.tsx

        dialogConfirm('Are you sure you would like to delete this item?', {
          title: 'Delete item',
          confirmText: 'Delete',
          red: true,
        }).then(
          () => {
            // delete item
            console.log('delete item')
          },
          () => {
            console.log('cancelled')
          }
        )

Dialog.tsx

import * as React from 'react'
import { confirmable, ReactConfirmProps, createConfirmation } from 'react-confirm'
import Modal from 'react-responsive-modal'
import styled from 'styled-components'
import Button from '../Button'

const Confirmation = styled.div`
  margin-bottom: 35px;
`

const ButtonsContainer = styled.div`
  display: flex;
  width: 100%;
  justify-content: flex-end;
`

export interface DialogOptions {
  title?: string
  confirmText?: string
  red?: boolean
}

export interface DialogProps extends ReactConfirmProps {
  text?: string
  confirm?: boolean
  options?: DialogOptions
}

const Dialog = ({ show, proceed, dismiss, cancel, confirmation, options = {} }: DialogProps) => (
  <Modal open={show} onClose={dismiss} showCloseIcon={false}>
    <div>
      <Confirmation>{confirmation}</Confirmation>
      <ButtonsContainer>
        {/* tslint:disable-next-line:jsx-no-lambda */}
        <Button gray transparent onClick={() => cancel()}>
          Cancel
        </Button>
        {/* tslint:disable-next-line:jsx-no-lambda */}
        <Button red={options.red} coloredBorder onClick={() => proceed()}>
          {options.confirmText || 'Confirm'}
        </Button>
      </ButtonsContainer>
    </div>
  </Modal>
)

const ConfirmableDialog = confirmable(Dialog)

// create confirm function
const confirm = createConfirmation(ConfirmableDialog)

// This is optional. But I recommend to define your confirm function easy to call.
export const dialogConfirm = (confirmation: any, options: DialogOptions = {}) => {
  // You can pass whatever you want to the component. These arguments will be your Component's props
  return confirm({ confirmation, options })
}