ember-paper-input
An animated floating label addon for Ember.
Install
ember install ember-paper-input
or add the addon in your package.json file
"ember-paper-input": "git+https://github.com/boseca/ember-paper-input.git"
Usage
Example with required input.
{{#ember-paper-input}} {{input id="txt-firstname" type="text" required=true placeholder='John'}} <label for="txt-firstname">First name</label>{{/ember-paper-input}}
Example with non-required input.
{{#ember-paper-input selected=model.address}} {{input value=model.address type="text" placeholder="123 Lawrence"}} <label>Address</label>{{/ember-paper-input}}
Example with 3rd party controls (in this case power-select
control).
The addon will observe the value of selected
and when it's changed it will animate the label.
{{#ember-paper-input selected=selectedCountry}} {{#power-select selected=selectedCountry options=countryList searchField="country" placeholder="Country" onchange=(action (mut selectedCountry)) as |country|}} {{country.country}} {{/power-select}} <label>Country</label>{{/ember-paper-input}}