Updates the documentation with the new options introduced in 4.7.0

Author: AlexandreBonneau

README.md

@@ -2,7 +2,7 @@
 
 The official documentation for [AutoNumeric](https://github.com/autoNumeric/autoNumeric/) is stored in this repository.
 
-This documentation is replacing the *huge* readme in the official [AutoNumeric repository](https://github.com/autoNumeric/autoNumeric/), and complete the website [http://autonumeric.org](http://autonumeric.org) where additional tools can be found.
+This documentation is replacing the previously *huge* readme in the official [AutoNumeric repository](https://github.com/autoNumeric/autoNumeric/), and complete the website [http://autonumeric.org](http://autonumeric.org) where additional tools can be found.
 
 ## Technology
 

docs/About/license.md

@@ -4,7 +4,7 @@ AutoNumeric is an [MIT](http://opensource.org/licenses/MIT)-licensed open source
 
 ## MIT License
 
-Copyright © 2016-2022 Alexandre Bonneau <[email protected]> and contributors<br>
+Copyright © 2016-2023 Alexandre Bonneau <[email protected]> and contributors<br>
 Copyright © 2009-2016 Robert J. Knothe <[email protected]> and contributors
 
 

docs/Changelog/CHANGELOG.md

@@ -2,6 +2,51 @@
 
 ### v4
 
+#### 4.7.0
++ Fixes #719 Feature request: Up and down arrow keys behavior matching standard number input
++ Adds 2 new options to control how the up and down arrow keys behave: `modifyValueOnUpDownArrow` and `upDownStep`
+
+#### 4.6.3
++ Fixes #721 AutoNumeric.set() breaks internal state when string-value has leading or trailing whitespace
++ Fixes all the remaining end-to-end tests with the latest Webdriver.io version
++ Removes the remnants of PhantomJS hacks (#384)
++ Updates the Travis CI configuration
++ Fixes the caret positioning in some specific cases
++ Fixes the lint issues in the wdio config file
++ Fixes the webpack production config to correctly generate gzipped dist files
+
+#### 4.6.2
++ Fixes issue #757 Converted scientific numbers returns NaN when using `formArrayNumericString()`
++ Fixes warning messages in the IDE
+
+#### 4.6.1
++ Updates all the dependencies
++ Removes the PhantomJS dependency in favor of Puppeteer
++ Fixes and cleans the Karma configuration files to support v6.4.1
++ Fixes and cleans the Webpack configuration files to support v5.75.0
++ Fixes the failing unit tests on the `validate()` function for the `allowDecimalPadding` option
++ Updates the Webdriverio configuration to v8
++ Updates the Webdriver end-to-end tests to v8, i.e. removing the `@wdio/sync` package in favor of using async/await everywhere, and updating all the `keys()` calls to use the Webdriver `Key` object, and arrays of individual characters
++ Adds unit tests for feature request #741
++ Completes the `validate()` function with additional tests for the new `allowDecimalPadding` option as a number
++ Fixes #761 Undo and redo actions are done twice, on Z and Control KeyUp events
++ Fixes missing variable update in #739 (`this.onGoingRedo`)
++ Fixes the warning message when a faulty `styleRules` callback is passed as a parameter
++ Fixes typos and grammar in comments
++ Fixes #734 Fire change event onBlur only if number is changed (#735)
++ Fixes #753 Correct invalid JS imports
++ Fixes #758 Adding missing predefined options to typescript interface file
++ Update the readme with the new documentation website
++ Fixes #739 Add CTRL+Y shortcut for redo
++ Fixes the currency symbol for Brazilian real
++ Fixes #697 Currency can be deleted (#725)
++ Updates the README related to PR #742
++ Fixes #741 + Ability to set a numeric allowDecimalPadding (#742)
++ Adds default export to modules (#747)
++ Fixes #737 Undo/redo not firing input event
++ Fixes #684 Caret always set far right when deleting or inserting numbers using $ (#716)
++ Fixes unit tests following the changes in `v4.6.0`
+
 #### 4.6.0
 + Adds a new option `invalidClass`, which default to `an-invalid`, that defines the CSS class name to use when a contenteditable-enabled element value is invalid
 + Adds a new option value `'invalid'` for the `overrideMinMaxLimits` option, that will allow users to enter out-of-bound numbers

docs/Documentation/configuration options.md

@@ -9,9 +9,9 @@ Want to know more? Check out the [examples](http://autonumeric.org/examples).
 
 Below are listed in alphabetical order the options that you can pass an AutoNumeric element, in order to make it change its behavior or formatting specifications.
 
-| Option           | Description | Default Value |
-| :---------------- | :-----------  | :-----------  |
-| `allowDecimalPadding` | Allow padding the decimal places with zeros. If set to `'floats'`, padding is only done when there are some decimals. If set to an integer, padding will use that number for adding the zeros. | `true` |
+| Option | Description | Default Value |
+| :---------------- | :----------- |:--------------------|
+| `allowDecimalPadding` | Allow padding the decimal places with zeros. If set to `'floats'`, padding is only done when there are some decimals (up to the number of decimal places from the `decimalPlaces` variable). If set to an integer, padding will use that number for adding the zeros. If set to `true` it will always pad the decimal places with zeroes, and never if set to `false`. | `true` |
 | `alwaysAllowDecimalCharacter` | Defines if the decimal character or decimal character alternative should be accepted when there is already a decimal character shown in the element. | `false` |
 | `caretPositionOnFocus` | Determine where should be positioned the caret on focus | `null` |
 | `createLocalList` | Determine if a local list of AutoNumeric objects must be kept when initializing the elements and others | `true` |
@@ -25,7 +25,7 @@ Below are listed in alphabetical order the options that you can pass an AutoNume
 | `decimalPlacesShownOnFocus` | The number of decimal places to show when *focused* | `null` |
 | `defaultValueOverride` | Helper option for the ASP.NET-specific postback issue | `null` |
 | `digitalGroupSpacing` | Digital grouping for the thousand separator | `'3'` |
-| `digitGroupSeparator` | Thousand separator character  | `','` |
+| `digitGroupSeparator` | Thousand separator character | `','` |
 | `divisorWhenUnfocused` | Defines the number that will divide the current value shown when unfocused | `null` |
 | `emptyInputBehavior` | Defines what to display when the input value is empty (possible options are `null`, `focus`, `press`, `always`, `min`, `max`, `zero`, number, or a string representing a number) | `'focus'` |
 | `eventBubbles` | Defines if the custom and native events triggered by AutoNumeric should bubble up or not | `true` |
@@ -38,6 +38,7 @@ Below are listed in alphabetical order the options that you can pass an AutoNume
 | `leadingZero` | Controls the leading zero behavior (possible options are `allow`, `deny` and `keep`) | `'deny'` |
 | `maximumValue` | The maximum value that can be entered (10 trillions by default) | `'10000000000000'` |
 | `minimumValue` | The minimum value that can be entered (-10 trillions by default) | `'-10000000000000'` |
+| `modifyValueOnUpDownArrow` | Determine if the element value can be incremented / decremented with the up and down arrow keys. The keys behavior is modified with the `upDownStep` option. | `true` |
 | `modifyValueOnWheel` | Determine if the element value can be incremented / decremented with the mouse wheel. The wheel behavior is modified with the `wheelStep` option. | `true` |
 | `negativeBracketsTypeOnBlur` | Adds brackets `[]`, parenthesis `()`, curly braces `{}`, chevrons `<>`, angle brackets `〈〉`, Japanese quotation marks `｢｣`, half brackets `⸤⸥`, white square brackets `⟦⟧`, quotation marks `‹›` or guillemets `«»` on negative values when unfocused. The value must be formatted like `'<leftBracket>,<rightBracket>'`. | `null` |
 | `negativePositiveSignPlacement` | Placement of negative/positive sign relative to the currency symbol (possible options are `l` (left), `r` (right), `p` (prefix) and `s` (suffix)) | `null` |
@@ -47,12 +48,12 @@ Below are listed in alphabetical order the options that you can pass an AutoNume
 | `outputFormat` | Defines the localized output format of the `getLocalized`, `form*`, `formArray*` and `formJson*` methods | `null` |
 | `overrideMinMaxLimits` | Override minimum and maximum limits (possible options are `ceiling`, `floor`, `ignore` and `invalid`) | `null` |
 | `positiveSignCharacter` | Defines the positive sign character to use (Note: It's only shown if `showPositiveSign` is set to `true`) | `'+'` |
-| `rawValueDivisor` | Define the number that will divide the formatted value into the raw value (ie. when displaying `'1.23%'`, the raw value kept is `0.0123` if `rawValueDivisor` is set to `100`) | `null` |
+| `rawValueDivisor` | Define the number that will divide the formatted value into the raw value (i.e. when displaying `'1.23%'`, the raw value kept is `0.0123` if `rawValueDivisor` is set to `100`) | `null` |
 | `readOnly` | Defines if the element (`<input>` or another allowed html tag) should be set as read-only on initialization | `false` |
 | `roundingMethod` | Method used for rounding. The possible options are:<br>`S` (Round-Half-Up Symmetric (default)),<br>`A` (Round-Half-Up Asymmetric),<br>`s` (Round-Half-Down Symmetric (lower case s)),<br>`a` (Round-Half-Down Asymmetric (lower case a)),<br>`B` (Round-Half-Even 'Bankers Rounding'),<br>`U` (Round Up 'Round-Away-From-Zero'),<br>`D` (Round Down 'Round-Toward-Zero' - same as truncate),<br>`C` (Round to Ceiling 'Toward Positive Infinity'),<br>`F` (Round to Floor 'Toward Negative Infinity'),<br>`N05` (Rounds to the nearest .05 (same as `'CHF'` used in v1.9.* and still valid)),<br>`U05` (Rounds up to next .05),<br>`D05` (Rounds down to next .05) | `'S'` |
 | `saveValueToSessionStorage` | Allow the `decimalPlacesShownOnFocus` value to be saved into session storage | `false` |
 | `selectNumberOnly` | Determine if the 'Select All' keyboard command will select the complete input text content (including the currency symbol and suffix text), or only the input numeric value | `false` |
-| `selectOnFocus` | Defines if the element value should be selected on focus. That selection is dependant on the `selectNumberOnly` option value. | `true` |
+| `selectOnFocus` | Defines if the element value should be selected on focus. That selection is dependent on the `selectNumberOnly` option value. | `true` |
 | `serializeSpaces` | Defines how the serialize functions should treat spaces when serializing (convert them to `'%20'` or `'+'`) | `'+'` |
 | `showOnlyNumbersOnFocus` | Remove the thousand separator, currency symbol and suffix on focus | `false` |
 | `showPositiveSign` | Allow the positive sign symbol `+` to be displayed for positive numbers | `false` |
@@ -62,7 +63,8 @@ Below are listed in alphabetical order the options that you can pass an AutoNume
 | `symbolWhenUnfocused` | Symbol placed as a suffix when unfocused. This is used in combination with the `divisorWhenUnfocused` option. | `null` |
 | `unformatOnHover` | Defines if the element value should be unformatted when the user hover his mouse over it while holding the `Alt` key | `true` |
 | `unformatOnSubmit` | Removes formatting on submit event | `false` |
+| `upDownStep` | Used in conjonction with the `modifyValueOnUpDownArrow` option, this allows to either define a *fixed* step (i.e. `1000`), or a *progressive* one that is calculated based on the size of the current value | `'1'` |
 | `valuesToStrings` | Provide a way for automatically and transparently replacing the formatted value with a pre-defined string, when the raw value is equal to a specific value.<br>For instance when using `{ 0: '-' }`, the hyphen `'-'` is displayed when the `rawValue` is equal to `0`. Multiple 'replacements' can be defined. | `null` |
 | `watchExternalChanges` | Defines if the AutoNumeric element should watch (and format) external changes made without using `.set()`. This is set to `false` by default to prevent infinite loops when used with third party frameworks that relies on the `'autoNumeric:rawValueModified'` events being sent. | `false` |
 | `wheelOn` | Used in conjonction with the `modifyValueOnWheel` option, defines when the wheel event will increment or decrement the element value, either when the element is focused, or hovered | `'focus'` |
-| `wheelStep` | Used in conjonction with the `modifyValueOnWheel` option, this allow to either define a *fixed* step (ie. `1000`), or a *progressive* one that is calculated based on the size of the current value | `'progressive'` |
+| `wheelStep` | Used in conjonction with the `modifyValueOnWheel` option, this allows to either define a *fixed* step (i.e. `1000`), or a *progressive* one that is calculated based on the size of the current value | `'progressive'` |

docs/Documentation/demo.md

@@ -1,3 +1,13 @@
+### Demo
+
 If you want to see AutoNumeric in action and try it yourself, you can either play with the field on the [AutoNumeric homepage](http://autonumeric.org), or check the [live demo](https://codepen.io/AnotherLinuxUser/pen/JyBGpz?editors=1010).
 
-Altenatively, you can also check the [vue-autonumeric demo](https://codepen.io/AnotherLinuxUser/pen/pWgOrZ).
+You can also take a look at the [predefined options examples](http://autonumeric.org/examples) (Predefined language options, Predefined common options, Predefined common monetary options, Predefined percentage options and Predefined style rules).
+
+### Tools
+
+Finally, you can use the [configuration generator tool](http://autonumeric.org/configurator) to generate your configuration options objects, while being able to see with a live preview the effect of each chosen options.
+
+### Related projects
+
+Alternatively, you can also check the [vue-autonumeric demo](https://codepen.io/AnotherLinuxUser/pen/pWgOrZ).

docs/index.md

@@ -62,30 +62,31 @@ The mobile Android Chrome browser is partially supported.
 - The settings can easily be changed at *any* time using the `update` method or via a callback
 - AutoNumeric supports `input` elements as well as most text elements with the `contenteditable` attribute, allowing you to place formatted numbers and currencies on just about any part of your pages
 - AutoNumeric elements *can be linked together* allowing you to perform one action on multiple elements at once
-- 8 pre-defined [currency options](Documentation/predefined options.md#predefined-language-options) as well as 33 [common options](Documentation/predefined options.md#predefined-common-options) allows you to directly use AutoNumeric by skipping the option configuration step
+- 8 [pre-defined currency options](Documentation/predefined options.md#predefined-language-options) as well as 33 [pre-defined common options](Documentation/predefined options.md#predefined-common-options) allows you to directly use AutoNumeric by skipping the option configuration step
 - 26 built-in [methods](Documentation/methods.md) gives you the flexibility needed to use AutoNumeric to its full potential
-- 22 [global methods](Documentation/instantiated methods.md#perform-actions-globally-on-a-shared-init-list-of-autonumeric-elements) that allows to control sets of AutoNumeric-managed elements at once
+- 22 [global methods](Documentation/instantiated methods.md#perform-actions-globally-on-a-shared-init-list-of-autonumeric-elements) that allows to control *sets* of AutoNumeric-managed elements at once
 - 21 additional [methods](Documentation/instantiated methods.md#form-functions) specialized for managing form management and submission
 - A [formula mode](Documentation/formula mode.md) that allows to quickly enter and evaluate math expressions inside the element
-- 17 [static functions](Documentation/static methods.md) provided by the `AutoNumeric` class
-- And more than 50 [options](Documentation/configuration options.md) allowing you to precisely customize your currency format and behavior
+- 17 [static functions](Documentation/static methods.md) provided by the `AutoNumeric` class, which can be used in Web Workers
+- And more than 50 [options](Documentation/configuration options.md) allowing you to precisely customize your number and currency format and behavior
 
 With that said, AutoNumeric supports most international numeric formats and currencies including those used in Europe, Asia, and North and South America.
 
 ## Try AutoNumeric!
 
-If you want to try AutoNumeric, please check the [demo](Documentation/demo.md) page.
+If you want to try AutoNumeric, please check the [demo](Documentation/demo.md) page.<br>
+There, you'll also have links to the additional AutoNumeric tools.
 
 ## Which version should I use?
 
-The latest stable branch is always on `master`. Currently this is version [4.2.*](https://github.com/autoNumeric/autoNumeric/tree/master).
+The latest stable branch is always on `master`. Currently this is version [4.6.*](https://github.com/autoNumeric/autoNumeric/tree/master).
 
-However most of the development in done on the `next` [branch](https://github.com/autoNumeric/autoNumeric/tree/next), with `master` being updated sparsely.
+However, most of the development in done on the `next` [branch](https://github.com/autoNumeric/autoNumeric/tree/next), with `master` being updated sparsely.
 
 If you want to try the new features, you can check out the latest development version in the `next` [branch](https://github.com/autoNumeric/autoNumeric/tree/next). That branch can see changes in the API (check the [semver](http://semver.org/)), however it's still very stable and bug-free (as far as we know) since it's always fully tested for regressions.
 
 !!! tip
-    `next` is the preferred branch to use in production. Use `master` only if you do not need fixes quickly.
+    `next` is the preferred branch to use in production. Use `master` only if you do not need fixes quickly and are prepared to wait a few years between releases.
 
 ### Older versions (v1.9 and v2)
 

mkdocs.yml

@@ -16,7 +16,7 @@ copyright: 'Made with ❤ in France'
 # Main navigation
 nav:
   - User documentation:
-    - AutoNumeric documentation: index.md
+    - AutoNumeric.js documentation: index.md
     - Try AutoNumeric: Documentation/demo.md
     - Getting Started:
       - Installation: Documentation/installation.md