## # Confirmation Dialog

### # Overview

Confirmation dialogs should be used to require user consent for a specific action. Dialogs should explain the reprecussions of performing a specific action, for example you can explain that a certain action that can not be undone and require user approval before proceeding.

Confirmations can be invoked anywhere in your component using `$confirm()` plugin or from your template using `v-confirm` directive (directive is not global, so you will need to inject it into your component). Confirmations use promises.

    this.$confirm({
        // Title of the dialog popup
        title: 'Dangerous Action',

        // Message of the dialog
        message: 'If you proceed, something really really bad my befall on you',

        // Type of the dialog popup
        // This can be used to style the popup further, by default all dialogs are styled as neutral
        type: 'neutral',

        // Dialog size
        size: 'medium',

        // Props to the pass to <n-button> used to render the confirm button
        confirmButton: {
            text: 'I am feeling lucky',
            color: 'danger',
        },

        // Props to pass to the <n-button> used to render the cancel button
        cancelButton: {
            text: 'Keep me safe',
            outlined: true,
        },
    }).then(() => {
        // User has granted their consent
    }).catch(() => {
        // User has cancelled the action
    })

#### # Shortcut invocation

    this.$confirm('You are about to do something bad', 'Danger')
        .then(() => {})
        .catch(() => {});

#### # Mounted Component

NConfirm

Confirm component is a Dialog wrapper used by `v-confirm` directive and `$confirm()` plugin This component is not intended to be used directly

Name | Type | Default | Description
--- | --- | --- | ---
type | String | -- |
title | String | -- |
message | String | -- |
confirm-button | Object | function() { return { text: 'Proceed' }; } |
cancel-button | Object | function() { return { text: 'Cancel', outlined: true, }; } |

### # `$confirm()` Plugin Example

### # `v-confirm` Directive Example