@opuscapita/react-confirmation-dialog v3.2.0

react-confirmation-dialog

Description

A modal popup dialog component with yes/no and an optional third, middle button.

Installation

npm install @opuscapita/react-confirmation-dialog

Demo

View the DEMO

Builds

UMD

The default build with compiled styles in the .js file. Also minified version available in the lib/umd directory.

CommonJS/ES Module

You need to configure your module loader to use cjs or es fields of the package.json to use these module types. Also you need to configure sass loader, since all the styles are in sass format.

• With webpack use resolve.mainFields to configure the module type.
• Add SASS loader to support importing of SASS styles.

API

Code example

import ConfirmDialog from '@opuscapita/react-confirmation-dialog';

class ConfirmDialogView extends React.Component {
  constructor() {
    this.state = {
      showConfirmationDialog: false;
    }
  }

  hideConfirmDialog = () => {
    this.setState({
      showConfirmationDialog: false
    });
  }

  showConfirmDialog = () => {
    this.setState({
      showConfirmationDialog: true
    });
  }

  render() {
    return (
        this.state.showConfirmationDialog &&
        <ConfirmDialog
          localizationTexts={{
            title: 'Confirmation',
            body: 'Are you sure you want to do this?',
          }}
          cancelCallback={this.hideConfirmDialog}
          confirmCallback={this.confirmAction}
        />
    );
  }
}