feat: add support for repeating characters

Simlar to regex, add an asterisk after a mask character to mark it as optionally repeating (0 or more).

BREAKING CHANGE: The asterisk is now a special character, if you were using it before in your masks it
must be escaped or changed in your token definition.

Author: RonaldJerez

README.md

@@ -63,7 +63,8 @@ export default {
 + `A` = alpha characters, transformed to uppercase
 + `a` = alpha characters, transformed to lowercase
 + `\` = escape any of the above characters
-+ `?` = mark the preceding character as optional
++ `?` = mark the preceding character as optional [0 or 1]
++ `*` = mark the preceding character as optional & repeating [0 or more]
 
 See the [token source file](https://github.com/RonaldJerez/vue-input-facade/blob/master/src/tokens.js) for definition signature
 

src/masker.js

@@ -9,6 +9,7 @@ let tokenDefinitions = defaultTokens
  * @param {object} tokens the new token object
  */
 export function setTokens(tokens) {
+  /* istanbul ignore if */
   if (!tokens) return
   tokenDefinitions = tokens
 }
@@ -67,31 +68,38 @@ export function formatter(value, config) {
 
   let output = new FacadeValue()
   let escaped = false
-  let optional = false
 
   let valueIndex = 0
   let maskIndex = 0
   let accumulator = ''
 
+  // gets some information about the mask before formating
+  function getMetaData(masker) {
+    const nextMaskChar = mask[maskIndex + 1]
+    const nextMasker = tokens[nextMaskChar]
+
+    return {
+      escape: !!(masker && masker.escape),
+      optional: !!(nextMasker && nextMasker.optional),
+      repeat: !!(nextMasker && nextMasker.repeat)
+    }
+  }
+
   while (maskIndex < mask.length) {
     const maskChar = mask[maskIndex]
     const masker = tokens[maskChar]
-    const nextMaskChar = mask[maskIndex + 1]
-    const nextMasker = tokens[nextMaskChar]
     let char = value[valueIndex]
 
     if (masker && !escaped) {
+      const meta = getMetaData(masker)
+
       // when is escape char, do not mask, just continue
-      if (masker.escape) {
+      if (meta.escape) {
         escaped = true
         maskIndex++
         continue
       }
 
-      if (masker.optional || (nextMasker && nextMasker.optional)) {
-        optional = true
-      }
-
       // no more input characters and next character is a masked one
       if (!char) break
 
@@ -101,13 +109,12 @@ export function formatter(value, config) {
         output.masked += accumulator + char
 
         accumulator = ''
-        maskIndex++
-        optional = false
-      }
 
-      if (optional) {
-        optional = false
-        maskIndex++
+        if (!meta.repeat) {
+          maskIndex += meta.optional ? 2 : 1
+        }
+      } else if (meta.optional || meta.repeat) {
+        maskIndex += 2
         continue
       }
 
@@ -124,7 +131,6 @@ export function formatter(value, config) {
         }
       }
 
-      optional = false
       escaped = false
       maskIndex++
     }

src/tokens.js

@@ -5,5 +5,6 @@ export default {
   A: { pattern: /[a-z]/i, transform: (v) => v.toLocaleUpperCase() },
   a: { pattern: /[a-z]/i, transform: (v) => v.toLocaleLowerCase() },
   '\\': { escape: true },
-  '?': { optional: true }
+  '?': { optional: true },
+  '*': { repeat: true }
 }

tests/formatter.test.js

@@ -106,6 +106,27 @@ test('12.3456ac -> ##?#?.###.##?a?S', () => {
   })
 })
 
+test('123456 -> #*', () => {
+  expect(formatter('123456', { mask: '#*' })).toMatchObject({
+    masked: '123456',
+    unmasked: '123456'
+  })
+})
+
+test('1234HH -> #* AA', () => {
+  expect(formatter('1234HH', { mask: '#* AA' })).toMatchObject({
+    masked: '1234 HH',
+    unmasked: '1234HH'
+  })
+})
+
+test('abc1234xyz -> ##* AAA', () => {
+  expect(formatter('abc1234xyz', { mask: '##* AAA' })).toMatchObject({
+    masked: '1234 XYZ',
+    unmasked: '1234XYZ'
+  })
+})
+
 test('escaped -> \\+1 # 5', () => {
   expect(formatter('', { mask: '\\+1 # 5', prefill: true })).toMatchObject({ masked: '+1 ', unmasked: '' })
 })