# ember-frost-modal-dialog

> [ci-img]: https://img.shields.io/travis/ciena-frost/ember-frost-modal-dialog.svg "Travis CI Build Status" [ci-url]: https://travis-ci.org/ciena-frost/ember-frost-modal-dialog

Latest version **2.5.4** (published 2016-08-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install ember-frost-modal-dialog
pnpm add ember-frost-modal-dialog
yarn add ember-frost-modal-dialog
bun add ember-frost-modal-dialog
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.5.4 |
| Published | 2016-08-16 |
| First published | 2016-04-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 5.0.0 |
| Dependencies | 5 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Maintainers | ciena |
| Keywords | ember-addon, frost |

## Links

- npm: https://www.npmjs.com/package/ember-frost-modal-dialog
- Repository: https://github.com/ciena-frost/ember-frost-modal-dialog
- Homepage: https://github.com/ciena-frost/ember-frost-modal-dialog#readme
- Issues: https://github.com/ciena-frost/ember-frost-modal-dialog/issues
- npm.io page: https://npm.io/package/ember-frost-modal-dialog

## Dependencies (5)

- [liquid-fire](https://npm.io/package/liquid-fire.md) ^0.24.1
- [ember-cli-sass](https://npm.io/package/ember-cli-sass.md) ^5.2.0
- [ember-cli-babel](https://npm.io/package/ember-cli-babel.md) ^5.1.6
- [ember-cli-htmlbars](https://npm.io/package/ember-cli-htmlbars.md) ^1.0.1
- [ember-computed-decorators](https://npm.io/package/ember-computed-decorators.md) ^0.2.2

## Recent versions

- 2.5.4 (latest) — 2016-08-16
- 2.5.3 — 2016-06-21
- 2.5.2 — 2016-06-21
- 2.5.1 — 2016-06-21
- 2.5.0 — 2016-06-17
- 2.4.0 — 2016-06-14
- 2.3.0 — 2016-06-08
- 2.2.1 — 2016-06-03
- 2.2.0 — 2016-06-02
- 2.1.1 — 2016-06-02
- 2.1.0 — 2016-06-01
- 2.0.0 — 2016-05-31
- 1.0.0 — 2016-04-08

## README

[ci-img]: https://img.shields.io/travis/ciena-frost/ember-frost-modal-dialog.svg "Travis CI Build Status"
[ci-url]: https://travis-ci.org/ciena-frost/ember-frost-modal-dialog

[cov-img]: https://img.shields.io/coveralls/ciena-frost/ember-frost-modal-dialog.svg "Coveralls Code Coverage"
[cov-url]: https://coveralls.io/github/ciena-frost/ember-frost-modal-dialog

[npm-img]: https://img.shields.io/npm/v/ember-frost-modal-dialog.svg "NPM Version"
[npm-url]: https://www.npmjs.com/package/ember-frost-modal-dialog

[![Travis][ci-img]][ci-url] [![Coveralls][cov-img]][cov-url] [![NPM][npm-img]][npm-url]

# ember-frost-modal-dialog
A modal dialog for messages requiring some user feedback. This is a wrapper around [ember-frost-modal](https://github.com/ciena-frost/ember-frost-modal) that provides the base styles and block structure

 * [Installation](#installation)
 * [API](#api)
 * [Examples](#examples)
 * [Development](#development)

## Installation
```
ember install ember-frost-modal-dialog
```

## API

| Attribute | Type | Value | Description |
| --------- | ---- | ----- | ----------- |
| `modalName` | `string` | `<name>` | Mandatory unique name for the modal, accessible via ember-remodal service |
| `type` | `string` | `confirmation` | will display a confirmation dialog |
| | | `information` | will display an information dialog |
| | | `warning` | will display a warning dialog |
| | | `error` | will display an error dialog |
| `title` | `string` | `<title>` | Optional title for your dialog |
| `confirmAlias` | `string` | `<alias>` | Optional string alias for the primary action button in a modal |
| `onClose` | `Function` | `<action-name>` | Optional callback for when modal is closed |
| `onConfirmHandler` | `Function` | `<action-name>` | If confirmAlias is present, callback for when the confirm button is clicked |
| `onOpen` | `Function` | `<action-name>` | Optional callback for when modal is opened |

## Examples

### Template
Block-slot `target` yields the component used to launch the modal, e.g. a button
Optional Block-slot `header` yields a custom title template if `title` attr was not provided
Block-slot `body` yields the dialog content
A Cancel button is always rendered to allow the modal to be closed.

```handlebars
{{#frost-modal-dialog
  modalName='my-dialog'
  title='confirmation'
  type='confirmation'
  confirmAlias='Confirm'
  onConfirmHandler=(action 'confirmHandler')}}
  {{#block-slot slot 'target'}}
    {{frost-button
      priority="primary"
      size="medium"
      text='Confirmation dialog'
    }}
  {{/block-slot}}
  {{#block-slot slot 'body'}}
    Test
  {{/block-slot}}
{{/frost-modal-dialog}}
```
### Controller
```javascript
actions: {
  confirmHandler: function () {

  }
}
```

## Development
### Setup
```
git clone git@github.com:ciena-frost/ember-frost-modal-dialog.git
cd ember-frost-modal-dialog
npm install && bower install
```

### Development Server
A dummy application for development is available under `ember-frost-modal-dialog/tests/dummy`.
To run the server run `ember server` (or `npm start`) from the root of the repository and
visit the app at http://localhost:4200.

### Testing
Run `npm test` from the root of the project to run linting checks as well as execute the test suite
and output code coverage.

---
_Source: https://npm.io/package/ember-frost-modal-dialog · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._