dynamic-text-mask

Helps manage with the desired string format. You can easily create your own format.

Notice

• Typescript.
• Easy. (maybe?)
• Simple. (um... maybe?)
• Scalability.

use

To install dynamic-text-mask, use yarn

$ yarn add @irony0901/dynamic-text-mask

Index

• ExampleEmailMask
• ExampleDomainMask
• ExampleTelMask (detailed description, Deepening)

ExampleEmailMask

import { createDynamicTextMask, emailMask } from '@irony0901/dynamic-text-mask';
// const emailMask = createDynamicTextMask([
//   { mask: /\w|\-|\./ },  // Result (Property Path: variables[0])
//   '@',                   // Separator
//   { mask: /\w|\-|\./ }   // Result (Property Path: variables[1])
// ])

console.log( emailMask.parse('[email protected]').variables )
// [ 'irony0901', 'github.com' ]

console.log( emailMask.parse('@github.com').variables )
// [ '', 'github.com' ]

console.log( emailMask.parse('irony0901').variables )
// [ 'irony0901', '' ]

ExampleDomainMask

import { createDynamicTextMask, maskMaybe, domainMask } from '@irony0901/dynamic-text-mask';
// const domainMask = createDynamicTextMask([
//   { mask: /[a-z]/i },
//   '://',
//   { mask: /\w|\-|\./ },
//   maskMaybe(
//     ({remaining}) => remaining[0] === '/',
//     [
//       '/',
//       {
//         mask: /\/|\w|\-/,
//         exit: ( _, {remaining}) => remaining[0] === '?'
//       }
//     ]
//   ),
//   '?',
//   { mask: /./ }
// ])

console.log( domainMask.parse('https://github.com').variables )
// [ 'https', 'github.com', '', '' ]

console.log( domainMask.parse('https://github.com/irony1090/dynamic-text-mask?foo=bar&wow=amazing').variables )
// [ 'https', 'github.com', 'irony1090/dynamic-text-mask', 'foo=bar&wow=amazing' ]

console.log( domainMask.parse('https://github.com?foo=bar&wow=amazing').variables )
// [ 'https', 'github.com', '', 'foo=bar&wow=amazing' ]

ExampleTelMask

import { createDynamicTextMask, maskMaybe, telMask } from '@irony0901/dynamic-text-mask'

// const telMask = createDynamicTextMask([
//   maskMaybe(                                    // International number part (May not be)
//     ({origin}) => origin.startsWith('+'),       // If '+' exists, read the following parts
//     [
//       '+',                                      // Separator
//       {                                         // Result (Property Path: variables[0])
//         mask: /\d/,                             // Only number
//         exit: (variable) => variable.length > 2 // Up to 3 characters
//       },
//       ' '                                       // Separator
//     ]
//   ),

//   {                                         // Result (Property Path: variables[1])
//     mask: /\d/,                             // Only number
//     exit: (variable) => variable.length > 2 // Up to 3 characters
//   },
//   '-',                                      // Separator
//   {                                         // Result (Property Path: variables[2])
//     mask: /\d/,                             // Only number
//     exit: (variable) => variable.length > 3 // Up to 4 characters
//   },
//   '-',                                      // Separator
//   {                                         // Result (Property Path: variables[3])
//     mask: /\d/,                             // Only number
//     exit: (variable) => variable.length > 3 // Up to 4 characters
//   }
// ])
const result = telMask.parse('010-123-5678');
const [ international, first, second, third ] = result.variables;

console.log('international is blank?', international === '')
// 'international is blank? true'  Because it didn't start with '+'

console.log('first:', first) 
// 'first: 010'

console.log('second:', second) 
// 'second: 123'

console.log('third:', third) 
// 'third: 5678'

console.log(result.frames)
// [ '010', '-', '123', '-', '5678' ]

const fullResult = telMask.parse('+82 010-1234-5678');
console.log('international:', fullResult.variables[0])
// 'international: 82'

console.log('first:', fullResult.variables[1]) 
// 'first: 010'

console.log('second:', fullResult.variables[2]) 
// 'second: 1234'

console.log('third:', fullResult.variables[3]) 
// 'third: 5678'

console.log('third:', fullResult.frames) 
// [ '+', '82', ' ', '010', '-', '1234', '-', '5678' ]

const notSeparatorResult = telMask.parse('0101234567890');
console.log( notSeparatorResult.variables )
// [ '', '010', '1234', '5678' ]

console.log( notSeparatorResult.frames )
// [ '010', '-', '1234', '-', '5678' ]

const strangeResult = telMask.parse('01-23-4567890');
console.log( strangeResult.variiables )
// [ '', '01', '01', '2345' ]