appuniversum / ember-appuniversum

Ember addon wrapping the appuniversum components.
https://appuniversum.github.io/ember-appuniversum
MIT License
14 stars 10 forks source link

Add a `{{au-inputmask}}` modifier #428

Closed Windvis closed 1 year ago

Windvis commented 1 year ago

This is a simple wrapper around the inputmask library. This can be used to replace the masking functionality in the AuInput component, so we can now deprecate it and make the component simpler.

Separating it has the advantage that it won't be shipped under Embroider if it's not used anywhere.

This doesn't include docs yet since the AuInput component needs some changes first.

Usage

<input {{au-inputmask options=(hash mask="9.9.9")}} {{on "change" this.handleChange}} />
export default class SomeComponent extends Component {
  handleChange = (event) => {
    console.log(event.target.inputmask.unmaskedvalue());
  }
}

options are simply passed into the Inputmask instance, which are documented here: https://robinherbots.github.io/Inputmask/#/documentation#options

Inputmask attaches itself to the element on the inputmask property, so any regular event handlers can be used to read out the data.