# modal

### Basic Usage

This show the most basic usage a modal. By default, it doesn't really do anything...

<modal> Some modal content goes here. </modal>

### Modal w/Title

Show the modal with a title.

Some modal content goes here.

### Override Footer and Header

Show the modal with a title.

<modal> Some modal title Some modal content goes here. Cancel Ok

### Modal Types

The modal component provides a few helpers to make adding buttons easier based on the type of modal you want to display. There are 3 types of modal presets, "alert", "confirm", "prompt".

The alert modal comes with one button to accept the notification.
The confirm modal comes with two buttons, one to confirm the notification, and one to cancel.
The prompt modal comes with the same two buttons as confirm.

### Targets

Most of the time you want to use a modal, its triggered to show by doing something. You can bind the modal to open/close with any element event. The default trigger is a `click`.

Click to show modal The alert modal comes with one button to accept the notification.

### Triggers

You can change the event trigger used open the modals. This example will use the focus/blur events to toggle the modal.

Focus on me The alert modal comes with one button to accept the notification.