## Modal

Modal is a custom component to display a popup

Size

- Testing 1
- Testing 2
- Testing 3

### Import

    import {{'{'}}FuiModalModule{{'}'}} from 'fuel-ui'; //module
    import {{'{'}}Modal{{'}'}} from 'fuel-ui'; //class

### Getting Started

Modal is a custom element to create a popup

### Usage

<tabset>

    <button class="btn btn-primary" (click)="modal.showModal(true)">Toggle Modal</button>
    <modal #modal
        modalTitle="Modal Title"
        [closeButton]="true"
        [closeOnUnfocus]="true"
        size="lg"
        (close)="onClose()"
        (open)="onOpen()">
        <div class="modal-body">
            <ul>
                <li>Any</li>
                <li>Html</li>
                <li>Here</li>
            </ul>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-primary" (click)="modal.closeModal()">
                <i class="fa fa-chevron-left"></i> Go Back
            </button>
        </div>
    </modal>

    export class ModalExample {{'{'}}
        onClose(){{'{'}}
            console.log("Modal has been closed!");
        {{'}'}}
        onOpen(){{'{'}}
            console.log("Modal has been opened!");
        {{'}'}}
    {{'}'}}

</tabset>

### Attributes

Loading table...

### Events

Loading table...