Skip to content

sinankeskin/ember-inputmask

Repository files navigation

ember-inputmask5

ember-inputmask5 workflow Ember Observer Score

Ember addon for Inputmask input mask library.

Compatibility

  • Ember.js v3.24 or above
  • Ember CLI v3.24 or above
  • Node.js v12 or above

Installation

ember install ember-inputmask5

Usage

You can change all global configuration settings via config/environment.js file.

Please check Inputmask site for more defaults details.

ENV['ember-inputmask5'] = {
  defaults: {
    // ...
  },
  definitions: {
    // ...
  },
  aliases: {
    // ...
  },
};

Example as a component

<Inputmask @mask="999 999 99 99" />

Please check Inputmask site for more configuration details.

<Inputmask @mask="999 999 99 99" @placeholder="_" @clearIncomplete={{true}} />

Example as a modifer

<Input {{inputmask mask="999 999 99 99" placeholder="_" clearIncomplete=true}} />
<input type="text" {{inputmask mask="999 999 99 99" placeholder="_" clearIncomplete=true}} />

If you would like access to the inputmask instance in order to call some methods directly, for example to hide or show programmatically, pass an action to registerAPI

<Input {{inputmask registerAPI=this.saveApi mask="999 999 99 99" placeholder="_" clearIncomplete=true}} />
// save the inputmask instance to use later
@action
saveApi(inputmask) {
  this.inputmask = inputmask;
}

// programmatically show unmasked value
@action
openFocusOut() {
  console.log(this.inputmask.unmaskedvalue());
}

Datetime (datetime extension)

<Input {{inputmask alias="datetime" inputFormat="dd/mm/yyyy" outputFormat="yyyy-mm-dd"}}/>

Currency (numeric extension)

<Input {{inputmask alias="currency" unmaskAsNumber="true" min="0" max="1000000" groupSeparator=" "}}/>

Contributing

See the Contributing guide for details. I'm sorry that i don't have time to write tests. Please report if you find any issue.

Thanks.

License

This project is licensed under the MIT License.