Skip to content
A library to easily display alerts and confirmations using React and Bootstrap
JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github/workflows
demo
src
.babelrc
.editorconfig
.eslintrc.js
.gitignore
CONTRIBUTING.md
LICENSE.md
README.md
jest.config.js
package-lock.json
package.json
rollup.config.js

README.md

react-bootstrap-confirmation

npm version

A library to easily display alerts and confirmations using React and Bootstrap. With react-bootstrap-confirmation displaying an alert or a confirmation dialog is just as easy as calling a function:

import {alert} from 'react-bootstrap-confirmation';

alert('Something very wrong happened!');

See the demo here.

Installation

npm install --save react-bootstrap-confirmation

Usage

alert(message[, options])

An asynchronous function that will return once the alert has been dismissed.

Example

import React, {useState} from 'react';
import {alert} from 'react-bootstrap-confirmation';

const AlertButton = () => {
  const display = async () => {
    await alert('Something very wrong is happening!');
    console.log('The alert has finished displaying');
  };
  return (
    <button type="button" className="btn btn-primary" onClick={display}>
      Display alert
    </button>
  );
};

Options

Parameter name Type Description Default
title string A facultative title to use for the modal. undefined
okText string The text of the "OK" button "OK"
okButtonStyle string The style of the "OK" button. Must correspond to one of the 6 button styles of Bootstrap. "primary"

confirm(message[, options])

An asynchronous function that will return true if the user clicks the "OK" button and false in the other cases.

Example

import React, {useState} from 'react';
import {confirm} from 'react-bootstrap-confirmation';

const ConfirmButton = () => {
  const display = async () => {
    const result = await alert('Are you really sure?');
    console.log('True if confirmed, false otherwise:', result);
  };
  return (
    <button type="button" className="btn btn-primary" onClick={display}>
      Display alert
    </button>
  );
};

Options

Parameter name Type Description Default
title string A facultative title to use for the modal. undefined
okText string The text of the "OK" button "OK"
okButtonStyle string The style of the "OK" button. Must correspond to one of the 6 button styles of Bootstrap. "primary"
cancelText string The text of the "Cancel" button "Cancel"
cancelButtonStyle string The style of the "Cancel" button. Must correspond to one of the 6 button styles of Bootstrap. "secondary"
You can’t perform that action at this time.