@kigi/components 1.62.5 → 1.62.7-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kigi/components",
-  "version": "1.62.5",
+  "version": "1.62.7-beta.1",
   "description": "@kigi/components",
   "main": "src/components/index.ts",
   "scripts": {

package/src/components/mbg-input-cpfcnpj/index.ts

@@ -1,9 +1,10 @@
 import * as angular from 'angular'
-import { mbgInputCpfCnpj } from './mbg-input-cpfcnpj'
+import { mbgInputCpfCnpj, mbgAlphanumericCnpjMask } from './mbg-input-cpfcnpj'
 
 const mbgInputCpfCnpjModule = angular
     .module('mbg.components.mbgInputCpfCnpj', [])
     .component('mbgInputCpfCnpj', mbgInputCpfCnpj)
+    .directive('mbgAlphanumericCnpjMask', mbgAlphanumericCnpjMask)
     .name
 
 export { mbgInputCpfCnpjModule }

package/src/components/mbg-input-cpfcnpj/mbg-input-cpfcnpj.html

@@ -1,16 +1,32 @@
 <div class="mbg-input-wrapper mb-input-cpfcnpj-wrapper"
      ng-if="$ctrl.props"
      mbg-autocomplete-off>
-    <input type="text"
-           ng-model="$ctrl.ngModel"
-           ng-change="$ctrl.onChange()"
-           placeholder="{{ $ctrl.props.placeholder }}"
-           ng-required="$ctrl.ngRequired"
-           ng-disabled="$ctrl.ngDisabled"
-           ng-blur="$ctrl.ngBlur({ $event })"
-           ng-focus="$ctrl.ngFocus({ $event })"
-           ng-keyup="$ctrl.ngKeyup({ $event })"
-           ng-keypress="$ctrl.ngKeypress({ $event })"
-           ng-keydown="$ctrl.ngKeydown({ $event })"
-           ui-br-cpfcnpj-mask />
-</div>
+     <input type="text"
+            ng-if="$ctrl.allowAlphanumeric"
+            ng-model="$ctrl.ngModel"
+            name="{{$ctrl.name}}"
+            ng-change="$ctrl.onChange()"
+            placeholder="{{ $ctrl.props.placeholder }}"
+            ng-required="$ctrl.ngRequired"
+            ng-disabled="$ctrl.ngDisabled"
+            ng-blur="$ctrl.ngBlur({ $event })"
+            ng-focus="$ctrl.ngFocus({ $event })"
+            ng-keyup="$ctrl.ngKeyup({ $event })"
+            ng-keypress="$ctrl.ngKeypress({ $event })"
+            ng-keydown="$ctrl.ngKeydown({ $event })"
+            mbg-alphanumeric-cnpj-mask />
+     <input type="text"
+            ng-if="!$ctrl.allowAlphanumeric"
+            ng-model="$ctrl.ngModel"
+            name="{{$ctrl.name}}"
+            ng-change="$ctrl.onChange()"
+            placeholder="{{ $ctrl.props.placeholder }}"
+            ng-required="$ctrl.ngRequired"
+            ng-disabled="$ctrl.ngDisabled"
+            ng-blur="$ctrl.ngBlur({ $event })"
+            ng-focus="$ctrl.ngFocus({ $event })"
+            ng-keyup="$ctrl.ngKeyup({ $event })"
+            ng-keypress="$ctrl.ngKeypress({ $event })"
+            ng-keydown="$ctrl.ngKeydown({ $event })"
+            ui-br-cpfcnpj-mask />
+</div>

package/src/components/mbg-input-cpfcnpj/mbg-input-cpfcnpj.ts

@@ -1,99 +1,307 @@
 import './mbg-input-cpfcnpj.scss'
 import template from './mbg-input-cpfcnpj.html'
 
-class MbgInputCpfCnpjController {
-    private ngChange
-    private ngModel
-    private ngRequired
-    private ngDisabled
-    private props
-    public valid
-
-    constructor(public $scope, public $element, public $attrs) {
-        if ($attrs.ngRequired === '') { this.ngRequired = true }
-        if ($attrs.ngDisabled === '') { this.ngDisabled = true }
-        this.props = {
-            placeholder: $attrs.placeholder || '',
-        }
+// ---------------------------------------------------------------------------
+// Mask formatting helpers
+// ---------------------------------------------------------------------------
+
+const CPF_MASK = '###.###.###-##'
+const CNPJ_MASK = '##.###.###/####-##'
+
+function cleanValue(value: string): string {
+  return (value || '').replace(/[^A-Za-z0-9]/g, '').toUpperCase()
+}
+
+function hasLetters(value: string): boolean {
+  return /[A-Za-z]/.test(value)
+}
+
+function formatCpf(clean: string): string {
+  const digits = clean.replace(/[^0-9]/g, '').substring(0, 11)
+  const result: string[] = []
+  let digitIdx = 0
+
+  for (let i = 0; i < CPF_MASK.length && digitIdx < digits.length; i++) {
+    if (CPF_MASK[i] === '#') {
+      result.push(digits[digitIdx])
+      digitIdx++
+    } else {
+      result.push(CPF_MASK[i])
     }
+  }
 
-    ngBlur(evt) {
-        this.valid = evt.$event.target.value
-        this.valid = this.valid.toString()
-        this.valid = this.valid.replace(/[^0-9]/g, '')
-        if (this.valid.length === 11) {
-            this.validCpf(this.valid)
+  return result.join('')
+}
+
+function formatCnpj(clean: string): string {
+  const safe = clean.substring(0, 14)
+  const result: string[] = []
+  let cleanIndex = 0
+
+  for (let i = 0; i < CNPJ_MASK.length && cleanIndex < safe.length; i++) {
+    const maskChar = CNPJ_MASK[i]
+
+    if (maskChar === '#') {
+      const char = safe[cleanIndex]
+      const isCheckDigitPosition = cleanIndex >= 12
+
+      if (isCheckDigitPosition) {
+        if (/[0-9]/.test(char)) {
+          result.push(char)
         }
-        if (this.valid.length === 14) {
-            this.validCnpj(this.valid)
-        } else {
-            return false
+        cleanIndex++
+      } else {
+        if (/[A-Z0-9]/.test(char)) {
+          result.push(char)
         }
+        cleanIndex++
+      }
+    } else {
+      result.push(maskChar)
     }
+  }
 
-    CalcDigits(digits, positions = 10, sumDigits = 0) {
-        digits = digits.toString()
-        for (let i = 0; i < digits.length; i++) {
-            sumDigits = sumDigits + (digits[i] * positions)
-            positions--
-            if (positions < 2) {
-                positions = 9
-            }
-        }
-        sumDigits = sumDigits % 11
-        if (sumDigits < 2) {
-            sumDigits = 0
-        } else {
-            sumDigits = 11 - sumDigits
-        }
-        let cnpj = digits + sumDigits
-        return cnpj
+  return result.join('')
+}
+
+function smartFormat(value: string): string {
+  const clean = normalizeForModel(value)
+  if (clean.length === 0) return ''
+  if (hasLetters(clean)) return formatCnpj(clean)
+  if (clean.length <= 11) return formatCpf(clean)
+  return formatCnpj(clean)
+}
+
+function normalizeForModel(value: string): string {
+  const clean = cleanValue(value)
+  if (!clean) return ''
+  if (hasLetters(clean)) return clean.substring(0, 14)
+  if (clean.length <= 11) return clean
+  return clean.substring(0, 14)
+}
+
+function isRepeatedNumeric(value: string): boolean {
+  return /^(\d)\1+$/.test(value)
+}
+
+function getDigitValue(char: string): number {
+  return char.charCodeAt(0) - 48
+}
+
+function calculateCpfDigit(base: string, startWeight: number): number {
+  let sum = 0
+
+  for (let i = 0; i < base.length; i++) {
+    sum += Number(base[i]) * (startWeight - i)
+  }
+
+  const remainder = sum % 11
+  return remainder < 2 ? 0 : 11 - remainder
+}
+
+function isValidCpf(value: string): boolean {
+  if (!/^\d{11}$/.test(value) || isRepeatedNumeric(value)) return false
+
+  const firstDigit = calculateCpfDigit(value.slice(0, 9), 10)
+  const secondDigit = calculateCpfDigit(`${value.slice(0, 9)}${firstDigit}`, 11)
+  return value === `${value.slice(0, 9)}${firstDigit}${secondDigit}`
+}
+
+function calculateCnpjDigit(base: string, weights: number[]): number {
+  let sum = 0
+
+  for (let i = 0; i < base.length; i++) {
+    sum += getDigitValue(base[i]) * weights[i]
+  }
+
+  const remainder = sum % 11
+  return remainder < 2 ? 0 : 11 - remainder
+}
+
+function isValidCnpj(value: string): boolean {
+  if (!/^[A-Z0-9]{12}[0-9]{2}$/.test(value)) return false
+  if (/^\d{14}$/.test(value) && isRepeatedNumeric(value)) return false
+
+  const base = value.slice(0, 12)
+  const firstDigit = calculateCnpjDigit(base, [5, 4, 3, 2, 9, 8, 7, 6, 5, 4, 3, 2])
+  const secondDigit = calculateCnpjDigit(
+    `${base}${firstDigit}`,
+    [6, 5, 4, 3, 2, 9, 8, 7, 6, 5, 4, 3, 2],
+  )
+
+  return value.slice(12) === `${firstDigit}${secondDigit}`
+}
+
+function isCpfCandidate(value: string): boolean {
+  return /^\d*$/.test(value) && value.length <= 11
+}
+
+function isCnpjCandidate(value: string): boolean {
+  return value.length > 11 || hasLetters(value)
+}
+
+function isDocumentValid(value: string): boolean {
+  if (!value) return true
+  if (isCpfCandidate(value)) {
+    if (value.length < 11) return true
+    return isValidCpf(value)
+  }
+  if (isCnpjCandidate(value)) {
+    if (value.length < 14) return true
+    if (value.length > 14) return false
+    return isValidCnpj(value)
+  }
+  return false
+}
+
+// ---------------------------------------------------------------------------
+// Directive: mbg-alphanumeric-cnpj-mask
+// ---------------------------------------------------------------------------
+
+class MbgAlphanumericCnpjMaskDirective {
+  static $inject = []
+
+  require = 'ngModel'
+  restrict = 'A'
+
+  link = (_scope, _element, _attrs, ngModel) => {
+    ngModel.$parsers.push((viewValue: string) => {
+      const clean = normalizeForModel(viewValue || '')
+      const formatted = smartFormat(clean)
+
+      if ((viewValue || '') !== formatted) {
+        ngModel.$setViewValue(formatted)
+        ngModel.$render()
+      }
+
+      return clean
+    })
+
+    ngModel.$formatters.push((modelValue: string) => {
+      return smartFormat(modelValue || '')
+    })
+
+    ngModel.$validators.cpf = (modelValue: string) => {
+      const clean = normalizeForModel(modelValue || '')
+      if (!clean || !isCpfCandidate(clean)) return true
+      if (clean.length < 11) return true
+      return isValidCpf(clean)
     }
 
-    validCpf(value) {
-        let digits = value.substr(0, 9)
-        let firstCalc = this.CalcDigits(digits)
-        let newCpf = this.CalcDigits(firstCalc, 11)
-        if (newCpf === value) {
-            return true
-        } else {
-            return false
-        }
+    ngModel.$validators.cnpj = (modelValue: string) => {
+      const clean = normalizeForModel(modelValue || '')
+      if (!clean || !isCnpjCandidate(clean)) return true
+      if (clean.length < 14) return true
+      if (clean.length > 14) return false
+      return isValidCnpj(clean)
     }
 
-    validCnpj(value) {
-        let original = value
-        let firstNumbers = value.substr(0, 12)
-        let firstCalc = this.CalcDigits(firstNumbers, 5)
-        let secondCalc = this.CalcDigits(firstCalc, 6)
-        if (secondCalc === original) {
-            return true
-        }
-        return false
+    ngModel.$validators.cpfcnpj = (modelValue: string) => {
+      const clean = normalizeForModel(modelValue || '')
+      return isDocumentValid(clean)
     }
+  }
+}
 
-    onChange() {
-        if (this.ngChange) {
-            this.ngChange({})
-        }
+const mbgAlphanumericCnpjMask = () => new MbgAlphanumericCnpjMaskDirective()
+
+// ---------------------------------------------------------------------------
+// Component: mbg-input-cpfcnpj
+// ---------------------------------------------------------------------------
+
+class MbgInputCpfCnpjController {
+  private ngChange
+  private ngModel
+  private ngRequired
+  private ngDisabled
+  private allowAlphanumeric: boolean
+  private name
+  private props
+  public valid
+
+  constructor(
+    public $scope,
+    public $element,
+    public $attrs,
+  ) {
+    if ($attrs.ngRequired === '') {
+      this.ngRequired = true
+    }
+    if ($attrs.ngDisabled === '') {
+      this.ngDisabled = true
+    }
+    this.props = {
+      placeholder: $attrs.placeholder || '',
+    }
+  }
+
+  $onInit() {
+    this.allowAlphanumeric = this.allowAlphanumeric === true
+  }
+
+  ngBlur(evt) {
+    this.valid = evt.$event.target.value
+    this.valid = this.valid.toString()
+    this.valid = this.valid.replace(/[^0-9]/g, '')
+    if (this.valid.length === 11) {
+      this.validCpf(this.valid)
+    }
+    if (this.valid.length === 14) {
+      this.validCnpj(this.valid)
+    } else {
+      return false
     }
+  }
+
+  CalcDigits(digits, positions = 10, sumDigits = 0) {
+    digits = digits.toString()
+    for (let i = 0; i < digits.length; i++) {
+      sumDigits += digits[i] * positions
+      positions--
+      if (positions < 2) positions = 9
+    }
+    sumDigits = sumDigits % 11
+    if (sumDigits < 2) sumDigits = 0
+    else sumDigits = 11 - sumDigits
+    return digits + sumDigits
+  }
+
+  validCpf(value) {
+    const digits = value.substr(0, 9)
+    const firstCalc = this.CalcDigits(digits)
+    const newCpf = this.CalcDigits(firstCalc, 11)
+    return newCpf === value
+  }
+
+  validCnpj(value) {
+    const firstNumbers = value.substr(0, 12)
+    const firstCalc = this.CalcDigits(firstNumbers, 5)
+    const secondCalc = this.CalcDigits(firstCalc, 6)
+    return secondCalc === value
+  }
+
+  onChange() {
+    if (this.ngChange) this.ngChange({})
+  }
 }
 MbgInputCpfCnpjController.$inject = ['$scope', '$element', '$attrs']
 
 const mbgInputCpfCnpj = {
-    bindings: {
-        ngModel: '=',
-        ngChange: '&?',
-        ngRequired: '=?',
-        ngDisabled: '=?',
-        ngBlur: '&?',
-        ngFocus: '&?',
-        ngKeyup: '&?',
-        ngKeypress: '&?',
-        ngKeydown: '&?',
-    },
-    template,
-    controller: MbgInputCpfCnpjController,
-}
-
-export { mbgInputCpfCnpj }
+  bindings: {
+    ngModel: '=',
+    ngChange: '&?',
+    ngRequired: '=?',
+    ngDisabled: '=?',
+    ngBlur: '&?',
+    ngFocus: '&?',
+    ngKeyup: '&?',
+    ngKeypress: '&?',
+    ngKeydown: '&?',
+    allowAlphanumeric: '<?',
+    name: '@?',
+  },
+  template,
+  controller: MbgInputCpfCnpjController,
+}
+
+export { mbgInputCpfCnpj, mbgAlphanumericCnpjMask }