0.11.2 • Published 5 years ago
@braces/reconfirm v0.11.2
React Confirm
Install
1 Install react confirm as dependency
# Using yarn package manager
$ yarn add @braces/reconfirm
# Using npm package manager
$ npm install --save @braces/reconfirm2 Import React confirm module
// ES6
import Confirm from "@braces/reconfirm"
// ES5
var Confirm = require("@braces/reconfirm");Example
CodeSandbox Example Link
import React from "react";
import ReactDOM from "react-dom";
import Confirm from "@braces/reconfirm";
function Component(props) {
return (
<div className="App">
<button
onClick={() =>
props.confirm("Dialog Message", "Dialog Title", "Some Data", data => {
alert(data + " Confirmed");
})
}
>
Show Confirm
</button>
</div>
);
}
function Dialog(props) {
return (
<div className="App">
<h1>{props.title}</h1>
<h2>{props.message}</h2>
<button onClick={props.onConfirm}>Confirm</button>
<button onClick={props.onCancel}>Cancel</button>
</div>
);
}
const App = Confirm(Dialog)(Component);
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);Properties
Component Props
| Name | Type | Description |
|---|---|---|
| confirm | (message?: string, title?: string, data?: any, onConfirmAction?: Function) => void | This is the function to invoke confirm dialog, onConfirmAction is callback function that will trigger with data as parameter when confirmed |
| confirmed | boolean | Here we can access confirm dialog status, whether confirmed or not |
| confirmData | any | Here we can access confirm data provided in onConfirmAction |
Confirm Dialog Props
| Name | Type | Description |
|---|---|---|
| onConfirm | Function | Have to invoke onConfirm when the confirm button is pressed / clicked. |
| onCancel | Function | Have to invoke onCancel when the cancel button is pressed / clicked. |
| title | string | Here we can access title provided in onConfirmAction |
| message | string | Here we can access message provided in onConfirmAction |
| data | any | Here we can access data provided in onConfirmAction |
Contributing!
All contributions are super welcome!
License
React Confirm is MIT licensed.