Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ember-animated-status-label

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ember-animated-status-label

Simple component to animate a label based on Promise state

  • 1.1.1
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
0
decreased by-100%
Maintainers
1
Weekly downloads
 
Created
Source

Ember Animated Status Label

The ember-animated-status-label addon provides a component that will show different labels that correspond to the pending recently-settled promise states. This component also provides a subtle animated transition between each state. If the promise has settled the component will yield.

At a high level, this component will produce the following markup for the aforementioned states:

alt text

Demo

alt text

Including in an application

Here is the simplest way to get started with ember-animated-status-label:

ember install ember-animated-status-label
ember install ember-cli-sass
ember install ember-cli-font-awesome

Note: Ember CLI versions < 0.2.3 should use ember install:addon instead of ember install

app.sass

@import animated-status-label

application.hbs

{{# animated-status-label
      promise=promise
      pendingText='operation pending'
      confirmationText='opeartion has completed' }}
  <p>This text displays when the promise has settled.</p>
{{/ animated-status-label }}

Configurable Properties

animated-status-label

The animated-status-label component supports the following properties:

PropertyPurpose
promiseA Promises/A+ compliant implementation.
pendingTextText that will display while the promise is in a pending state.
confirmationTextText that will display immediately after the promise enters a settled state.
pendingClassNameCSS class name(s) to append to container span during pending state.
confirmationClassNameCSS class name(s) to append to container span immediately after the promise enters a settled state.
confirmationAnimationFinishedAn action to be called after the confirmation animation has completed.
confirmationIconNameFontAwesome icon name to use for the confirmation icon.

Running

Running Tests

  • npm test (Runs ember try:testall to test your addon against multiple Ember versions)
  • ember test
  • ember test --server

Building

  • ember build

For more information on using ember-cli, visit http://www.ember-cli.com/.

Contributing

Find an issue? Let us know! Contributions from anyone and everyone are welcome. Please see our guidelines for contributing.

Licensing

Copyright 2015 Esri

Licensed under The MIT License(MIT); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://opensource.org/licenses/MIT

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

A copy of the license is available in the repository's LICENSE.md file.

Credits

Contributions from @timmorey and @jrowlingson.

Keywords

FAQs

Package last updated on 17 Feb 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc