ember-frost-info-bar

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

Usage no npm install needed!

<script type="module">
  import emberFrostInfoBar from 'https://cdn.skypack.dev/ember-frost-info-bar';
</script>

README

ember-frost-info-bar

Dependencies

Ember NPM

Health

Travis Coveralls

Security

bitHound

Ember Observer score

EmberObserver

Installation

ember install ember-frost-info-bar

Examples

Template

{{frost-info-bar
  hook='info-bar'
  icon=(component 'frost-icon'
    hook='baconIcon'
    isVisible=isIconVisible
    icon='bacon'
    pack='dummy'
  )
  title=(component 'text-box'
    isVisible=isTitleVisible
    text='&lt;placeholder: title&gt;'
  )
  summary=(component 'text-box'
    isVisible=isSummaryVisible
    text='&lt;placeholder: summary&gt;'
  )
  scope=(component 'text-box'
    isVisible=isScopeVisible
    text='&lt;placeholder: controls&gt;'
  )
  controls=(array
    (component 'frost-button'
      isVisible=isControlsVisible
      icon='add'
      text='Click me!'
      onClick=(action 'triggerAction')
    )
  )
}}

Testing with ember-hook

The info-bar component is accessible using ember-hook with the top level hook name or you can access the internal components as well -

  • Default top level hook - $hook('info-bar')
  • Icon slot hook - $hook('<hook-name>-icon')
  • Title slot hook - $hook('<hook-name>-title')
  • Summary slot hook - $hook('<hook-name>-summary')'
  • Controls slot hook - $hook('<hook-name>-controls')'
  • Controls slot item hook - $hook('<hook-name>-controls-<index>')'
  • Actions slot - $hook('<hook-name>-action')'

Development

Setup

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

Development Server

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