vue-formatted-number-input

Public repository maintained by SurrealityCheck.org

Example project (my stand in for real documentation)

Created with help from "Program With Erik's" excellent demostrations.

Version History...

| Version | Project State | | :---: | --- | | 0.0._ | Efforts to learn how to deploy a plugin | | 0.1.0 | M.V.P. works as a plug-in! | | 0.1.3 | Plug-in v-model binding fixed. Props no longer an interface. | | 0.1._ | Document current state & refactor goals | | 0.1.8 | Begin major refactor | | 0.1.9 | Test major refactor in the wild | | 0.1.9_ | Iron out bugs (work in progress) | | ~~0.2.0~~ | ~~Add test suite~~ (not yet begun) |

Usage...

Note: As of 0.1.8, some items in the proposed refactor goals are being incorporated.

Current Usage...

| Prop | Type | Default | Note | | ---- | ---- | ------- | ---- | | initialNumber | Number | undefined | Initial value of new input| | placeholder | String | undefined | Text displayed when there is no value. Compatible with Prime Face's floating labels. | | prefix | String | undefined | Useful for currency symbols, such as $ or ¥ | | max | Number | 999,999.00 | Upper limit allowed. Inputs exceed this will be rounded down. | | allowedDecimalPlaces | Number | 0 | Allows decimals, and maintains set decimal places on blur. | | allowEmpty | Boolean | true | If false, empty input will default to 0 on blur | | diagnosticMode | Boolean | false | Exposes realtime model data in the UI and dev console. |

Intended Expansion of Functionality (the to-do list)...

| Prop | Type | Default | Note | | ---- | ---- | ------- | ---- | | initialNumber | [Number || Ref] | v-model | If there is no pre-existing model value, use this to initiate one. If there is a model value, but you'd rather not show it until the user interacts, assign initialNumber="null" | | defaultTo (was allowEmpty) | Number (was Boolean) | null | If a parameter exists, an empty field will default to this value on blur. | | | allowNegative | Boolean | false | Allow minus symbol (-) for negative number evaluation | | min | Number | -999,999.00 | Lowest limit allowed (presently, no negative number is permitted) | | disabled | Boolean | false | Input disabled attribute. | | allowFraction | Boolean | false | Allow slash sign (/) for factional evaluation. | | enableUnicode | Boolean | false | Evaluate prefix and suffix as Unicode (bug fix). | | suffix | String | '' | Useful for clarification in-line, such as "__ days since this village wrongfully accused someone of being a werewolf. or "__ per customer" | | allowCalculation | Boolean | false | Allow leading equal sign (=) to trigger formula evaluation. |

Bug notes...

• ~~Model B is displaying 0 when empty, despite :allowEmpty = "true".~~
• ~~Inputs are allowing spacebar to enter an empty char after a decimal.~~
• ~~Entering only a . does not return 0.~~
• Unicode prefixes are being displayed as suffix.