restricted-input - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

CHANGELOG.md

 # Restricted Input - Release Notes
 
+## 1.0.4 (2016-11-04)
+
+* Fix Safari autocomplete issue
+
 ## 1.0.3 (2016-09-28)
@@ -4,0 +8,0 @@

lib/strategies/base.js

@@ -56,2 +56,6 @@ 'use strict';
   self.inputElement.addEventListener('input', function (event) {
+    // Safari AutoFill fires CustomEvents -- mark the input as unformatted without actually unformatting the current value
+    if (event instanceof CustomEvent) {
+      self.isFormatted = false;
+    }
     self._reformatInput(event);
@@ -58,0 +62,0 @@ });

package.json

 {
   "name": "restricted-input",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Restrict inputs to certain valid characters (e.g. formatting phone or card numbers)",
@@ -29,4 +29,5 @@ "author": "Braintree <[e-mail]> (https://www.braintreepayments.com/)",
     "lint": "eslint lib test",
-    "test": "npm run lint && karma start config/karma.js --single-run",
+    "test": "npm run lint && npm run test:unit",
     "test:watch": "karma start config/karma.js",
+    "test:unit": "karma start config/karma.js --single-run",
     "test:integration": ". ./.env && bundle exec rake sauce:spec test_files=spec",
@@ -33,0 +34,0 @@ "test:all": "npm run test && npm run test:integration"

README.md

@@ -48,2 +48,35 @@ Restricted Input
 
+## Patterns
+
+Patterns are a mixture of [`Placeholder`](#placeholder)s and [`PermaChar`](#permachar)s.
+
+### Placeholder
+
+A `Placeholder` is the part of the pattern that accepts user input based on some restrictions. A placeholder is defined in the pattern using two open curly brackets, the placeholder, followed by two closing curly brackets e.g. `{{Abc123}}`.
+
+The patterns a `Placeholder` can be are:
+ - a single alpha character that matches the alpha regex `/[A-Za-z]/`. e.g. `{{C}}` will match one alpha character.
+ - a single digit that matches the digit regex `/[0-9]/`. e.g. `{{3}}` will match one digit.
+ - a `*` character that matches `/./`. e.g. `{{*}}` will match the next character.
+
+### PermaChar
+
+A `PermaChar` is the part of the pattern that is automatically inserted. `PermaChar`s are defined in the pattern as any characters other than `Placeholder`s.
+
+### Example patterns
+
+Some example patterns with behavior are listed:
+ - `12{{3}}`
+   - Inserts `12`.
+   - Waits for a single digit from the user.
+ - `{{A}}BC`
+   - Waits for a single alpha from the user.
+   - Inserts `BC`.
+ - `${{*2L}}E`
+   - Inserts `$`.
+   - Waits for any single character input from the user.
+   - Waits for a single digit from the user.
+   - Waits for a single alpha from the user.
+   - Inserts `E`.
+
 ## API
@@ -56,3 +89,3 @@
 | element | `HTMLInputElement` or `HTMLTextAreaElement` | A valid reference to an `input` or `textarea` DOM node |
-| pattern | `RegExp` | A [regular expression](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) describing the allowed character set you wish for entry into corresponding field. |
+| pattern | `String` | Pattern describing the allowed character set you wish for entry into corresponding field. See [Patterns](#Patterns).|
 
@@ -59,0 +92,0 @@ ## Browser Support

No alert changes

Improved metrics

Total package byte prevSize

26399

increased by6.07%

Lines of code

595

increased by0.68%

Number of lines in readme file

105

increased by45.83%

No dependency changes