Skip to content
Sancho UI
Toggle dark mode
Getting started
Built with ☕ by
Ben McMahen

AlertDialog

Use an AlertDialog to confirm a potentially destructive action taken by the user. AlertDialog composes the Dialog component.

Basic usage

Delete
<Component initialState={{ isOpen: false }}>
  {({ state, setState }) => (
    <React.Fragment>
      <Button intent="danger" onPress={() => setState({ isOpen: true })}>
        Delete
      </Button>

      <AlertDialog
        isOpen={state.isOpen}
        confirmLabel="Delete"
        subtitle="This action cannot be undone. Proceed with caution."
        title={"Do you really want to delete your account?"}
        onConfirm={() => {
          window.alert("Yup. I did it.");
        }}
        onClose={() => {
          setState({ isOpen: false });
        }}
      />
    </React.Fragment>
  )}
</Component>

API

AlertDialog
isOpen*boolean
onConfirm*() => void
onCancel() => void
onClose*() => void
title*string
subtitlestring
confirmLabelstring
intentButtonIntent