@tecsinapse/react-core 1.12.10 → 1.14.2

package/src/index.ts

@@ -31,16 +31,13 @@ export {
   InputElement,
   InputElementProps,
   InputVariantType,
-  Masks,
   PressableInputContainer,
   PressableInputContainerProps,
   StyledBorderKeeper,
-  useCurrencyMask,
   useInputFocus,
-  useMask,
+  useNumberMask,
+  useStringMask,
   disabledInputStyles,
-  IMask,
-  IMaskValue,
 } from './components/atoms/Input';
 export { Paper, PaperProps } from './components/atoms/Paper';
 export {
@@ -57,7 +54,7 @@ export {
   CalendarProps,
   DateRange,
   SelectionType,
-  Value
+  Value,
 } from './components/molecules/Calendar';
 export { DatePicker, DatePickerProps } from './components/molecules/DatePicker';
 export {

package/src/utils/formatWithMask.ts

@@ -0,0 +1,25 @@
+import {
+  MaskType,
+  CurrencyOptions,
+  getMask,
+  mergeMask,
+  getInternalNumberAndMask,
+} from '../components/atoms/Input';
+import currency from 'currency.js';
+
+export const formatWithMask = (
+  mask: (MaskType[] | ((value: string) => MaskType[])) | CurrencyOptions,
+  value: string | number
+): string | number => {
+  if (Array.isArray(mask) || typeof mask === 'function') {
+    const selectedMask = getMask(mask, String(value));
+    const { formatted } = mergeMask(String(value), selectedMask);
+    return formatted || '';
+  } else {
+    const { internalNumber, mergedOptions } = getInternalNumberAndMask(
+      value,
+      mask
+    );
+    return currency(internalNumber).format(mergedOptions);
+  }
+};

package/src/utils/index.ts

@@ -3,5 +3,7 @@ export {
   extractNumbersFromString,
   extractDigitsFromString,
 } from './extractNumbersFromString';
-export * from './IPhoneXHelper'
-export * from './ResponsiveFontSize'
+export * from './IPhoneXHelper';
+export * from './ResponsiveFontSize';
+export * from './masks';
+export * from './formatWithMask';

package/src/utils/masks.ts

@@ -0,0 +1,15 @@
+// NOTE: Add here all individually utils, then you can use it on input components everywhere.
+export const Masks = {
+  CPF: ['999.999.999-99'],
+  CNPJ: ['99.999.999/9999-99'],
+  DATE: ['99/99/9999'],
+  MONTH_YEAR: ['99/9999'],
+  CEP: ['99999-999'],
+  PHONE: ['(99) 9999-9999'],
+  PHONE_EXTENDED: ['(99) 99999-9999'],
+  COMBINED_PHONE: (value: string) =>
+    // Value in formatted mode
+    value?.length <= 14 ? Masks.PHONE : Masks.PHONE_EXTENDED,
+  COMBINED_CPF_CNPJ: (value: string) =>
+    value?.length <= 14 ? Masks.CPF : Masks.CNPJ,
+};

package/dist/components/atoms/Input/hooks/useCurrencyMask.d.ts

@@ -1,3 +0,0 @@
-import currency from 'currency.js';
-import { IMask } from './useMask';
-export declare const useCurrencyMask: (options?: currency.Options | undefined, defaultValue?: string | undefined) => [IMask, (value: string) => void];

package/dist/components/atoms/Input/hooks/useCurrencyMask.js

@@ -1,69 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCurrencyMask = void 0;
-
-var _currency = _interopRequireDefault(require("currency.js"));
-
-var _react = require("react");
-
-var _utils = require("../../../../utils");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const DEFAULT_OPTIONS = {
-  symbol: 'R$ ',
-  separator: '.',
-  decimal: ',',
-  precision: 2
-};
-
-const useCurrencyMask = (options, defaultValue) => {
-  const getRegex = (0, _react.useCallback)(precision => new RegExp(`\\B(?=(\\d{${precision}})(?!\\d))`, 'g'), [options]);
-  const applyMask = (0, _react.useCallback)((value = '') => {
-    const mergedOptions = { ...DEFAULT_OPTIONS,
-      ...options
-    };
-    const {
-      precision = -1
-    } = mergedOptions;
-    const onlyNumbers = String((0, _utils.extractNumbersFromString)(value));
-    const padZeros = String(onlyNumbers).padStart(precision + 1, '0');
-    let internalNumber = Number(padZeros.replace(getRegex(precision), '.'));
-
-    if (internalNumber > Number.MAX_SAFE_INTEGER) {
-      internalNumber = Number.MAX_SAFE_INTEGER;
-    }
-
-    if (internalNumber < Number.MIN_SAFE_INTEGER) {
-      internalNumber = Number.MIN_SAFE_INTEGER;
-    }
-
-    return {
-      raw: internalNumber,
-      formatted: (0, _currency.default)(internalNumber).format(mergedOptions)
-    };
-  }, [options, getRegex]);
-  const [value, setValue] = (0, _react.useState)({
-    converter: applyMask,
-    maskValue: applyMask(defaultValue)
-  });
-  const handleChangeValue = (0, _react.useCallback)(formattedValue => {
-    const {
-      raw,
-      formatted
-    } = applyMask(formattedValue);
-    setValue(oldValue => ({ ...oldValue,
-      maskValue: {
-        raw,
-        formatted
-      }
-    }));
-  }, [applyMask, setValue]);
-  return [value, handleChangeValue];
-};
-
-exports.useCurrencyMask = useCurrencyMask;
-//# sourceMappingURL=useCurrencyMask.js.map

package/dist/components/atoms/Input/hooks/useCurrencyMask.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../../src/components/atoms/Input/hooks/useCurrencyMask.ts"],"names":["DEFAULT_OPTIONS","symbol","separator","decimal","precision","useCurrencyMask","options","defaultValue","getRegex","RegExp","applyMask","value","mergedOptions","onlyNumbers","String","padZeros","padStart","internalNumber","Number","replace","MAX_SAFE_INTEGER","MIN_SAFE_INTEGER","raw","formatted","format","setValue","converter","maskValue","handleChangeValue","formattedValue","oldValue"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAKA,MAAMA,eAAgC,GAAG;AACvCC,EAAAA,MAAM,EAAE,KAD+B;AAEvCC,EAAAA,SAAS,EAAE,GAF4B;AAGvCC,EAAAA,OAAO,EAAE,GAH8B;AAIvCC,EAAAA,SAAS,EAAE;AAJ4B,CAAzC;;AAaO,MAAMC,eAAe,GAAG,CAC7BC,OAD6B,EAE7BC,YAF6B,KAGQ;AACrC,QAAMC,QAAQ,GAAG,wBACdJ,SAAD,IAAuB,IAAIK,MAAJ,CAAY,cAAaL,SAAU,YAAnC,EAAgD,GAAhD,CADR,EAEf,CAACE,OAAD,CAFe,CAAjB;AAKA,QAAMI,SAAS,GAAG,wBAChB,CAACC,KAAK,GAAG,EAAT,KAA4B;AAC1B,UAAMC,aAAa,GAAG,EAAE,GAAGZ,eAAL;AAAsB,SAAGM;AAAzB,KAAtB;AACA,UAAM;AAAEF,MAAAA,SAAS,GAAG,CAAC;AAAf,QAAqBQ,aAA3B;AACA,UAAMC,WAAW,GAAGC,MAAM,CAAC,qCAAyBH,KAAzB,CAAD,CAA1B;AACA,UAAMI,QAAQ,GAAGD,MAAM,CAACD,WAAD,CAAN,CAAoBG,QAApB,CAA6BZ,SAAS,GAAG,CAAzC,EAA4C,GAA5C,CAAjB;AACA,QAAIa,cAAc,GAAGC,MAAM,CAACH,QAAQ,CAACI,OAAT,CAAiBX,QAAQ,CAACJ,SAAD,CAAzB,EAAsC,GAAtC,CAAD,CAA3B;;AAEA,QAAIa,cAAc,GAAGC,MAAM,CAACE,gBAA5B,EAA8C;AAC5CH,MAAAA,cAAc,GAAGC,MAAM,CAACE,gBAAxB;AACD;;AAED,QAAIH,cAAc,GAAGC,MAAM,CAACG,gBAA5B,EAA8C;AAC5CJ,MAAAA,cAAc,GAAGC,MAAM,CAACG,gBAAxB;AACD;;AAED,WAAO;AACLC,MAAAA,GAAG,EAAEL,cADA;AAELM,MAAAA,SAAS,EAAE,uBAASN,cAAT,EAAyBO,MAAzB,CAAgCZ,aAAhC;AAFN,KAAP;AAID,GApBe,EAqBhB,CAACN,OAAD,EAAUE,QAAV,CArBgB,CAAlB;AAwBA,QAAM,CAACG,KAAD,EAAQc,QAAR,IAAoB,qBAAgB;AACxCC,IAAAA,SAAS,EAAEhB,SAD6B;AAExCiB,IAAAA,SAAS,EAAEjB,SAAS,CAACH,YAAD;AAFoB,GAAhB,CAA1B;AAKA,QAAMqB,iBAAiB,GAAG,wBACvBC,cAAD,IAA4B;AAC1B,UAAM;AAAEP,MAAAA,GAAF;AAAOC,MAAAA;AAAP,QAAqBb,SAAS,CAACmB,cAAD,CAApC;AACAJ,IAAAA,QAAQ,CAACK,QAAQ,KAAK,EACpB,GAAGA,QADiB;AAEpBH,MAAAA,SAAS,EAAE;AACTL,QAAAA,GADS;AAETC,QAAAA;AAFS;AAFS,KAAL,CAAT,CAAR;AAOD,GAVuB,EAWxB,CAACb,SAAD,EAAYe,QAAZ,CAXwB,CAA1B;AAcA,SAAO,CAACd,KAAD,EAAQiB,iBAAR,CAAP;AACD,CArDM","sourcesContent":["import currency from 'currency.js';\nimport { useCallback, useState } from 'react';\nimport { extractNumbersFromString } from '../../../../utils';\nimport { IMask, IMaskValue } from './useMask';\n\ntype CurrencyOptions = currency.Options;\n\nconst DEFAULT_OPTIONS: CurrencyOptions = {\n  symbol: 'R$ ',\n  separator: '.',\n  decimal: ',',\n  precision: 2,\n};\n\n/**\n * TODO:\n * @param options\n * @param defaultValue\n * @returns\n */\nexport const useCurrencyMask = (\n  options?: CurrencyOptions,\n  defaultValue?: string\n): [IMask, (value: string) => void] => {\n  const getRegex = useCallback(\n    (precision: number) => new RegExp(`\\\\B(?=(\\\\d{${precision}})(?!\\\\d))`, 'g'),\n    [options]\n  );\n\n  const applyMask = useCallback(\n    (value = ''): IMaskValue => {\n      const mergedOptions = { ...DEFAULT_OPTIONS, ...options };\n      const { precision = -1 } = mergedOptions;\n      const onlyNumbers = String(extractNumbersFromString(value));\n      const padZeros = String(onlyNumbers).padStart(precision + 1, '0');\n      let internalNumber = Number(padZeros.replace(getRegex(precision), '.'));\n\n      if (internalNumber > Number.MAX_SAFE_INTEGER) {\n        internalNumber = Number.MAX_SAFE_INTEGER;\n      }\n\n      if (internalNumber < Number.MIN_SAFE_INTEGER) {\n        internalNumber = Number.MIN_SAFE_INTEGER;\n      }\n\n      return {\n        raw: internalNumber,\n        formatted: currency(internalNumber).format(mergedOptions),\n      };\n    },\n    [options, getRegex]\n  );\n\n  const [value, setValue] = useState<IMask>({\n    converter: applyMask,\n    maskValue: applyMask(defaultValue),\n  });\n\n  const handleChangeValue = useCallback(\n    (formattedValue: string) => {\n      const { raw, formatted } = applyMask(formattedValue);\n      setValue(oldValue => ({\n        ...oldValue,\n        maskValue: {\n          raw,\n          formatted,\n        },\n      }));\n    },\n    [applyMask, setValue]\n  );\n\n  return [value, handleChangeValue];\n};\n"],"file":"useCurrencyMask.js"}

package/dist/components/atoms/Input/hooks/useMask.d.ts

@@ -1,9 +0,0 @@
-export interface IMaskValue {
-    formatted?: string;
-    raw?: any;
-}
-export interface IMask {
-    converter?: (raw?: string) => IMaskValue;
-    maskValue?: IMaskValue;
-}
-export declare const useMask: (mask: string | ((raw: any) => string), defaultValue?: string | undefined) => [IMask, (text: string) => void];

package/dist/components/atoms/Input/hooks/useMask.js

@@ -1,61 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useMask = void 0;
-
-var _react = require("react");
-
-var _utils = require("../../../../utils");
-
-const mergeMask = (value = '', mask) => {
-  const chars = '' + value;
-  let formattedValue = '';
-
-  for (let iMask = 0, iChars = 0; iMask < mask.length && iChars < chars.length; iMask++) {
-    formattedValue += mask.charAt(iMask) === '9' ? chars.charAt(iChars++) : mask.charAt(iMask);
-  }
-
-  return formattedValue;
-};
-
-const getMask = (value = '', mask) => {
-  if (typeof mask === 'function') {
-    return mask(value);
-  }
-
-  return mask;
-};
-
-const useMask = (mask, defaultValue) => {
-  const applyMask = (0, _react.useCallback)((value = '') => {
-    const onlyNumbers = value ? (0, _utils.extractDigitsFromString)(value) : value;
-    const selectedMask = getMask(onlyNumbers, mask);
-    const formattedValue = mergeMask(onlyNumbers, selectedMask);
-    return {
-      raw: onlyNumbers,
-      formatted: formattedValue
-    };
-  }, [mask]);
-  const [value, setValue] = (0, _react.useState)({
-    converter: applyMask,
-    maskValue: applyMask(defaultValue)
-  });
-  const handleChangeValue = (0, _react.useCallback)(value => {
-    const {
-      raw,
-      formatted
-    } = applyMask(value);
-    setValue(oldValue => ({ ...oldValue,
-      maskValue: {
-        raw,
-        formatted
-      }
-    }));
-  }, [applyMask, setValue]);
-  return [value, handleChangeValue];
-};
-
-exports.useMask = useMask;
-//# sourceMappingURL=useMask.js.map

package/dist/components/atoms/Input/hooks/useMask.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../../src/components/atoms/Input/hooks/useMask.ts"],"names":["mergeMask","value","mask","chars","formattedValue","iMask","iChars","length","charAt","getMask","useMask","defaultValue","applyMask","onlyNumbers","selectedMask","raw","formatted","setValue","converter","maskValue","handleChangeValue","oldValue"],"mappings":";;;;;;;AAAA;;AACA;;AAkBA,MAAMA,SAAS,GAAG,CAACC,KAAK,GAAG,EAAT,EAAaC,IAAb,KAA8B;AAC9C,QAAMC,KAAK,GAAG,KAAKF,KAAnB;AACA,MAAIG,cAAc,GAAG,EAArB;;AAEA,OACE,IAAIC,KAAK,GAAG,CAAZ,EAAeC,MAAM,GAAG,CAD1B,EAEED,KAAK,GAAGH,IAAI,CAACK,MAAb,IAAuBD,MAAM,GAAGH,KAAK,CAACI,MAFxC,EAGEF,KAAK,EAHP,EAIE;AACAD,IAAAA,cAAc,IACZF,IAAI,CAACM,MAAL,CAAYH,KAAZ,MAAuB,GAAvB,GAA6BF,KAAK,CAACK,MAAN,CAAaF,MAAM,EAAnB,CAA7B,GAAsDJ,IAAI,CAACM,MAAL,CAAYH,KAAZ,CADxD;AAED;;AACD,SAAOD,cAAP;AACD,CAbD;;AAqBA,MAAMK,OAAO,GAAG,CAACR,KAAK,GAAG,EAAT,EAAaC,IAAb,KAA+D;AAC7E,MAAI,OAAOA,IAAP,KAAgB,UAApB,EAAgC;AAC9B,WAAOA,IAAI,CAACD,KAAD,CAAX;AACD;;AACD,SAAOC,IAAP;AACD,CALD;;AAaO,MAAMQ,OAAO,GAAG,CACrBR,IADqB,EAErBS,YAFqB,KAGe;AACpC,QAAMC,SAAS,GAAG,wBAChB,CAACX,KAAK,GAAG,EAAT,KAA4B;AAC1B,UAAMY,WAAW,GAAGZ,KAAK,GAAG,oCAAwBA,KAAxB,CAAH,GAAoCA,KAA7D;AACA,UAAMa,YAAY,GAAGL,OAAO,CAACI,WAAD,EAAcX,IAAd,CAA5B;AACA,UAAME,cAAc,GAAGJ,SAAS,CAACa,WAAD,EAAcC,YAAd,CAAhC;AAEA,WAAO;AACLC,MAAAA,GAAG,EAAEF,WADA;AAELG,MAAAA,SAAS,EAAEZ;AAFN,KAAP;AAID,GAVe,EAWhB,CAACF,IAAD,CAXgB,CAAlB;AAcA,QAAM,CAACD,KAAD,EAAQgB,QAAR,IAAoB,qBAAgB;AACxCC,IAAAA,SAAS,EAAEN,SAD6B;AAExCO,IAAAA,SAAS,EAAEP,SAAS,CAACD,YAAD;AAFoB,GAAhB,CAA1B;AAKA,QAAMS,iBAAiB,GAAG,wBACvBnB,KAAD,IAAmB;AACjB,UAAM;AAAEc,MAAAA,GAAF;AAAOC,MAAAA;AAAP,QAAqBJ,SAAS,CAACX,KAAD,CAApC;AACAgB,IAAAA,QAAQ,CAACI,QAAQ,KAAK,EACpB,GAAGA,QADiB;AAEpBF,MAAAA,SAAS,EAAE;AACTJ,QAAAA,GADS;AAETC,QAAAA;AAFS;AAFS,KAAL,CAAT,CAAR;AAOD,GAVuB,EAWxB,CAACJ,SAAD,EAAYK,QAAZ,CAXwB,CAA1B;AAcA,SAAO,CAAChB,KAAD,EAAQmB,iBAAR,CAAP;AACD,CAtCM","sourcesContent":["import { useCallback, useState } from 'react';\nimport { extractDigitsFromString } from '../../../../utils';\n\nexport interface IMaskValue {\n  formatted?: string;\n  raw?: any;\n}\n\nexport interface IMask {\n  converter?: (raw?: string) => IMaskValue;\n  maskValue?: IMaskValue;\n}\n\n/**\n * TODO:\n * @param value\n * @param mask\n * @returns\n */\nconst mergeMask = (value = '', mask: string) => {\n  const chars = '' + value;\n  let formattedValue = '';\n\n  for (\n    let iMask = 0, iChars = 0;\n    iMask < mask.length && iChars < chars.length;\n    iMask++\n  ) {\n    formattedValue +=\n      mask.charAt(iMask) === '9' ? chars.charAt(iChars++) : mask.charAt(iMask);\n  }\n  return formattedValue;\n};\n\n/**\n * TODO:\n * @param value\n * @param mask\n * @returns\n */\nconst getMask = (value = '', mask: ((raw: any) => string) | string): string => {\n  if (typeof mask === 'function') {\n    return mask(value);\n  }\n  return mask;\n};\n\n/**\n * TODO:\n * @param mask\n * @param defaultValue\n * @returns\n */\nexport const useMask = (\n  mask: ((raw: any) => string) | string,\n  defaultValue?: string\n): [IMask, (text: string) => void] => {\n  const applyMask = useCallback(\n    (value = ''): IMaskValue => {\n      const onlyNumbers = value ? extractDigitsFromString(value) : value;\n      const selectedMask = getMask(onlyNumbers, mask);\n      const formattedValue = mergeMask(onlyNumbers, selectedMask);\n\n      return {\n        raw: onlyNumbers,\n        formatted: formattedValue,\n      };\n    },\n    [mask]\n  );\n\n  const [value, setValue] = useState<IMask>({\n    converter: applyMask,\n    maskValue: applyMask(defaultValue),\n  });\n\n  const handleChangeValue = useCallback(\n    (value: string) => {\n      const { raw, formatted } = applyMask(value);\n      setValue(oldValue => ({\n        ...oldValue,\n        maskValue: {\n          raw,\n          formatted,\n        },\n      }));\n    },\n    [applyMask, setValue]\n  );\n\n  return [value, handleChangeValue];\n};\n"],"file":"useMask.js"}

package/dist/components/atoms/Input/masks/index.d.ts

@@ -1,10 +0,0 @@
-export declare const Masks: {
-    CPF: string;
-    CNPJ: string;
-    DATE: string;
-    MONTH_YEAR: string;
-    CEP: string;
-    PHONE: string;
-    PHONE_EXTENDED: string;
-    COMBINED_PHONE: (value: string) => string;
-};

package/dist/components/atoms/Input/masks/index.js

@@ -1,18 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Masks = void 0;
-const Masks = {
-  CPF: '999.999.999-99',
-  CNPJ: '99.999.999/9999-99',
-  DATE: '99/99/9999',
-  MONTH_YEAR: '99/9999',
-  CEP: '99999-999',
-  PHONE: '(99) 9999-9999',
-  PHONE_EXTENDED: '(99) 99999-9999',
-  COMBINED_PHONE: value => (value === null || value === void 0 ? void 0 : value.length) <= 10 ? Masks.PHONE : Masks.PHONE_EXTENDED
-};
-exports.Masks = Masks;
-//# sourceMappingURL=index.js.map

package/dist/components/atoms/Input/masks/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../../src/components/atoms/Input/masks/index.ts"],"names":["Masks","CPF","CNPJ","DATE","MONTH_YEAR","CEP","PHONE","PHONE_EXTENDED","COMBINED_PHONE","value","length"],"mappings":";;;;;;AACO,MAAMA,KAAK,GAAG;AACnBC,EAAAA,GAAG,EAAE,gBADc;AAEnBC,EAAAA,IAAI,EAAE,oBAFa;AAGnBC,EAAAA,IAAI,EAAE,YAHa;AAInBC,EAAAA,UAAU,EAAE,SAJO;AAKnBC,EAAAA,GAAG,EAAE,WALc;AAMnBC,EAAAA,KAAK,EAAE,gBANY;AAOnBC,EAAAA,cAAc,EAAE,iBAPG;AAQnBC,EAAAA,cAAc,EAAGC,KAAD,IACd,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEC,MAAP,KAAiB,EAAjB,GAAsBV,KAAK,CAACM,KAA5B,GAAoCN,KAAK,CAACO;AATzB,CAAd","sourcesContent":["// NOTE: Add here all individually masks, then you can use it on input components everywhere.\nexport const Masks = {\n  CPF: '999.999.999-99',\n  CNPJ: '99.999.999/9999-99',\n  DATE: '99/99/9999',\n  MONTH_YEAR: '99/9999',\n  CEP: '99999-999',\n  PHONE: '(99) 9999-9999',\n  PHONE_EXTENDED: '(99) 99999-9999',\n  COMBINED_PHONE: (value: string) =>\n    value?.length <= 10 ? Masks.PHONE : Masks.PHONE_EXTENDED,\n};\n"],"file":"index.js"}

package/src/components/atoms/Input/hooks/useCurrencyMask.ts

@@ -1,74 +0,0 @@
-import currency from 'currency.js';
-import { useCallback, useState } from 'react';
-import { extractNumbersFromString } from '../../../../utils';
-import { IMask, IMaskValue } from './useMask';
-
-type CurrencyOptions = currency.Options;
-
-const DEFAULT_OPTIONS: CurrencyOptions = {
-  symbol: 'R$ ',
-  separator: '.',
-  decimal: ',',
-  precision: 2,
-};
-
-/**
- * TODO:
- * @param options
- * @param defaultValue
- * @returns
- */
-export const useCurrencyMask = (
-  options?: CurrencyOptions,
-  defaultValue?: string
-): [IMask, (value: string) => void] => {
-  const getRegex = useCallback(
-    (precision: number) => new RegExp(`\\B(?=(\\d{${precision}})(?!\\d))`, 'g'),
-    [options]
-  );
-
-  const applyMask = useCallback(
-    (value = ''): IMaskValue => {
-      const mergedOptions = { ...DEFAULT_OPTIONS, ...options };
-      const { precision = -1 } = mergedOptions;
-      const onlyNumbers = String(extractNumbersFromString(value));
-      const padZeros = String(onlyNumbers).padStart(precision + 1, '0');
-      let internalNumber = Number(padZeros.replace(getRegex(precision), '.'));
-
-      if (internalNumber > Number.MAX_SAFE_INTEGER) {
-        internalNumber = Number.MAX_SAFE_INTEGER;
-      }
-
-      if (internalNumber < Number.MIN_SAFE_INTEGER) {
-        internalNumber = Number.MIN_SAFE_INTEGER;
-      }
-
-      return {
-        raw: internalNumber,
-        formatted: currency(internalNumber).format(mergedOptions),
-      };
-    },
-    [options, getRegex]
-  );
-
-  const [value, setValue] = useState<IMask>({
-    converter: applyMask,
-    maskValue: applyMask(defaultValue),
-  });
-
-  const handleChangeValue = useCallback(
-    (formattedValue: string) => {
-      const { raw, formatted } = applyMask(formattedValue);
-      setValue(oldValue => ({
-        ...oldValue,
-        maskValue: {
-          raw,
-          formatted,
-        },
-      }));
-    },
-    [applyMask, setValue]
-  );
-
-  return [value, handleChangeValue];
-};

package/src/components/atoms/Input/hooks/useMask.ts

@@ -1,92 +0,0 @@
-import { useCallback, useState } from 'react';
-import { extractDigitsFromString } from '../../../../utils';
-
-export interface IMaskValue {
-  formatted?: string;
-  raw?: any;
-}
-
-export interface IMask {
-  converter?: (raw?: string) => IMaskValue;
-  maskValue?: IMaskValue;
-}
-
-/**
- * TODO:
- * @param value
- * @param mask
- * @returns
- */
-const mergeMask = (value = '', mask: string) => {
-  const chars = '' + value;
-  let formattedValue = '';
-
-  for (
-    let iMask = 0, iChars = 0;
-    iMask < mask.length && iChars < chars.length;
-    iMask++
-  ) {
-    formattedValue +=
-      mask.charAt(iMask) === '9' ? chars.charAt(iChars++) : mask.charAt(iMask);
-  }
-  return formattedValue;
-};
-
-/**
- * TODO:
- * @param value
- * @param mask
- * @returns
- */
-const getMask = (value = '', mask: ((raw: any) => string) | string): string => {
-  if (typeof mask === 'function') {
-    return mask(value);
-  }
-  return mask;
-};
-
-/**
- * TODO:
- * @param mask
- * @param defaultValue
- * @returns
- */
-export const useMask = (
-  mask: ((raw: any) => string) | string,
-  defaultValue?: string
-): [IMask, (text: string) => void] => {
-  const applyMask = useCallback(
-    (value = ''): IMaskValue => {
-      const onlyNumbers = value ? extractDigitsFromString(value) : value;
-      const selectedMask = getMask(onlyNumbers, mask);
-      const formattedValue = mergeMask(onlyNumbers, selectedMask);
-
-      return {
-        raw: onlyNumbers,
-        formatted: formattedValue,
-      };
-    },
-    [mask]
-  );
-
-  const [value, setValue] = useState<IMask>({
-    converter: applyMask,
-    maskValue: applyMask(defaultValue),
-  });
-
-  const handleChangeValue = useCallback(
-    (value: string) => {
-      const { raw, formatted } = applyMask(value);
-      setValue(oldValue => ({
-        ...oldValue,
-        maskValue: {
-          raw,
-          formatted,
-        },
-      }));
-    },
-    [applyMask, setValue]
-  );
-
-  return [value, handleChangeValue];
-};

package/src/components/atoms/Input/masks/index.ts

@@ -1,12 +0,0 @@
-// NOTE: Add here all individually masks, then you can use it on input components everywhere.
-export const Masks = {
-  CPF: '999.999.999-99',
-  CNPJ: '99.999.999/9999-99',
-  DATE: '99/99/9999',
-  MONTH_YEAR: '99/9999',
-  CEP: '99999-999',
-  PHONE: '(99) 9999-9999',
-  PHONE_EXTENDED: '(99) 99999-9999',
-  COMBINED_PHONE: (value: string) =>
-    value?.length <= 10 ? Masks.PHONE : Masks.PHONE_EXTENDED,
-};