Confirmation component allows user to confirm or cancel action
npm install @paprika/confirmationConfirmation component allows user to confirm or cancel action
```
yarn add @paprika/confirmation
or with npm:
``
npm install @paprika/confirmation
| Prop | Type | required | default | Description |
| ----------------- | ----------------------------------------------------------------------------------------------- | -------- | ----------------------------------- | ---------------------------------------------------------------------------- |
| body | node | false | null | Content of the popover confirmation |
| buttonSize | [ Confirmation.types.size.SMALL, Confirmation.types.size.MEDIUM, Confirmation.types.size.LARGE] | false | Confirmation.types.size.MEDIUM | Size of the button |
| children | node | false | null | |
| confirmButtonType | [ Confirmation.types.kind.PRIMARY, Confirmation.types.kind.DESTRUCTIVE] | false | Confirmation.types.kind.DESTRUCTIVE | Determine the styling of the confirm button |
| confirmLabel | string | true | - | Label for the confirm button |
| customCancelLabel | string | false | null | Custom label for the cancel button |
| defaultIsOpen | bool | false | false | If the popover is open by default |
| heading | string | false | null | Heading for the popover confirmation |
| isPending | bool | false | false | If the confirm button should render in a pending state (with a spinner icon) |
| onClose | func | false | () => {} | Callback when cancel button is clicked |
| onConfirm | func | true | - | Callback when confirm button is clicked |
`js
import Confirmation from "@paprika/confirmation";
body="Lorem ipsum dolor amet vexillologist tacos selvage narwhal butcher twee ethical hot chicken"
onConfirm={handleCloseConfirm => handleConfirm(handleCloseConfirm)}
onClose={handleClose}
heading="Delete filter?">
;
or
body="Lorem ipsum dolor amet vexillologist tacos selvage narwhal butcher twee ethical hot chicken"
defaultIsOpen
onConfirm={handleCloseConfirm => handleConfirm(handleCloseConfirm)}
heading="Delete filter?"
/>;
``
You can use the following components to compose the Confirmation:
- Storybook Showcase
- GitHub source code
- Create GitHub issue
- CHANGELOG