/ember-frost-modal-input

A modal container for forms/input components

Primary LanguageJavaScriptMIT LicenseMIT

Travis Coveralls NPM

ember-frost-modal-input

Installation

ember install ember-frost-modal-input

API

Attribute Type Value Description
title string Optional custom title
subtitle string Optional custom subtitle
titleComponent string Optional title component to replace standard title/subtitle styles

Examples

Controller

Inject the modal-forms service into the parent controller

modalForms: Ember.inject.service('modal-forms'),
isModalActive: Ember.computed.readOnly('modalForms.isModalActive'),

Change the active state of the modal in your component

willInsertElement () {
  this.get('modalForms').setModalActive(true)
},

willDestroyElement () {
  this.get('modalForms').setModalActive(false)
}

Template

Custom classes are applied to the parent template, based on state of the modal

{{liquid-modal class=(if isModalActive 'form-container' '')}}

Default title component template

{{#frost-modal-input title='Test title' subtitle='Subtitle'}}
    // Custom modal content
{{/frost-modal-input}}

Custom title component template

{{#frost-modal-input titleComponent='myTitleComponent'}}
  // Custom modal content
{{/frost-modal-input}}

Development

Setup

git clone git@github.com:ciena-frost/ember-frost-modal-input.git
cd ember-frost-modal-input
npm install && bower install

Development Server

A dummy application for development is available under ember-frost-modal-input/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.