@mutt/widget-financial

Mutt Forms Widget - Financial number Input

Usage no npm install needed!

<script type="module">
  import muttWidgetFinancial from 'https://cdn.skypack.dev/@mutt/widget-financial';
</script>

README

Mutt Forms Widget - Financial

Mutt Forms Vue widget for entering a currency value

Field Options

The financial widget accepts the following options:

option type description default
min String The minimum number allowed '0'
max String The maximum number allowed null
step String The default increment when using the up/down keys '1'
currencySymbol String HTML encoded currency symbol '&pound;'
currencyStart Boolean When true the currency symbol is placed to the left of the input field. When false it is placed to the right true

Complete Example

The following example sets the min and max to 0 and 2500 respectively, the step to 10, the currency symbol to the Euro, and the currency position to the right of the input.

value: {
  label: null,
  max: '2500',
  min: '0',
  step: '10',
  natural: {
    allowZero: true,
    prefix: 'I paid €',
    suffix: '.',
    title: 'How much did you pay?',
    trigger: '',
  },
  currencySymbol: '&euro;',
  currencyStart: false,
  widget: 'naturalfinancial',
},