linear-react-components-ui 0.4.77-beta.9 → 1.0.0-rc.1

package/lib/inputs/mask/ZipCode.js

@@ -3,21 +3,21 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
 var _BaseMask = _interopRequireDefault(require("./BaseMask"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 var ZipCodeField = function ZipCodeField(props) {
-  return /*#__PURE__*/_react["default"].createElement(_BaseMask["default"], _extends({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_BaseMask.default, _extends({}, props, {
     mask: "00000-000"
   }));
 };
 
 var _default = ZipCodeField;
-exports["default"] = _default;
+exports.default = _default;

package/lib/inputs/mask/helpers.d.ts

@@ -0,0 +1,14 @@
+import { AnyMaskedOptions } from 'imask';
+import { IMaskHOCProps } from '../types.js';
+import 'react';
+import '../../@types/PermissionAttr.js';
+import '../../@types/DataCombo.js';
+import '../select/types.js';
+import '../base/types.js';
+import '../../@types/Period.js';
+
+declare function extractNonMaskProps(props: IMaskHOCProps, maskProps: AnyMaskedOptions): any;
+declare function CPFValidation(cpf?: string, returnMessage?: (msg: string) => void): void | "CPF inválido";
+declare function CNPJValidation(cnpj?: string, returnMessage?: (msg: string) => void): void | "CNPJ inválido";
+
+export { CNPJValidation, CPFValidation, extractNonMaskProps };

package/lib/inputs/mask/helpers.js

@@ -6,74 +6,59 @@ Object.defineProperty(exports, "__esModule", {
 exports.CNPJValidation = CNPJValidation;
 exports.CPFValidation = CPFValidation;
 exports.extractNonMaskProps = extractNonMaskProps;
-exports.extractOptionsFromProps = extractOptionsFromProps;
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var _lodash = require("lodash");
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 /* eslint-disable no-plusplus */
-function extractNonMaskProps(props, maskedPropTypes) {
+function extractNonMaskProps(props, maskProps) {
   var nonMask = _extends({}, props);
 
-  Object.keys(maskedPropTypes).forEach(function (maskProp) {
+  Object.keys(maskProps).forEach(function (maskProp) {
     delete nonMask[maskProp];
   });
+  delete nonMask.value;
+  delete nonMask.onChange;
   return nonMask;
 }
 
-function extractOptionsFromProps(props, maskedPropTypes) {
-  var optionsProps = _extends({}, props); // Remove todas as propriedades que tenham sido passadas que nao são do componente.
-
-
-  Object.keys(optionsProps).filter(function (prop) {
-    return !Object.prototype.hasOwnProperty.call(maskedPropTypes, prop);
-  }).forEach(function (nonMaskProp) {
-    delete optionsProps[nonMaskProp];
-  });
-  delete optionsProps.value;
-  delete optionsProps.unmask;
-  return optionsProps;
-}
-
 var allEqualDigits = function allEqualDigits(input) {
-  return input.split('').every(function (_char) {
-    return _char === input[0];
+  return input.split('').every(function (char) {
+    return char === input[0];
   });
 };
 
-function CPFValidation() {
-  var cpf = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-  var returnMessage = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
-  var stringCpf = cpf.replace(/[^\d]+/g, '');
+function CPFValidation(cpf, returnMessage) {
+  var stringCpf = cpf ? cpf.replace(/[^\d]+/g, '') : '';
   var sum = 0;
   var splitRest;
   if (stringCpf === '' || stringCpf.length < 11) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido';
   if (allEqualDigits(stringCpf)) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido'; // 1st digit validation
 
   for (var i = 0; i < 9; i++) {
-    sum += parseInt(stringCpf.charAt(i), 10) * (10 - i);
+    sum += (0, _lodash.parseInt)(stringCpf.charAt(i), 10) * (10 - i);
   }
 
   splitRest = sum * 10 % 11;
   if (splitRest === 10 || splitRest === 11) splitRest = 0;
-  if (splitRest !== parseInt(stringCpf.charAt(9), 10)) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido'; // 2nd digit validation
+  if (splitRest !== (0, _lodash.parseInt)(stringCpf.charAt(9), 10)) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido'; // 2nd digit validation
 
   sum = 0;
   splitRest = 0;
 
   for (var _i = 0; _i < 10; _i++) {
-    sum += parseInt(stringCpf.charAt(_i), 10) * (11 - _i);
+    sum += (0, _lodash.parseInt)(stringCpf.charAt(_i), 10) * (11 - _i);
   }
 
   splitRest = sum * 10 % 11;
   if (splitRest === 10 || splitRest === 11) splitRest = 0;
-  if (splitRest !== parseInt(stringCpf.charAt(10), 10)) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido';
-  return returnMessage ? returnMessage(undefined) : undefined;
+  if (splitRest !== (0, _lodash.parseInt)(stringCpf.charAt(10), 10)) return returnMessage ? returnMessage('CPF inválido') : 'CPF inválido';
+  return returnMessage ? returnMessage('') : undefined;
 }
 
-function CNPJValidation() {
-  var cnpj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-  var returnMessage = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
-  var stringCnpj = cnpj.replace(/[^\d]+/g, '');
+function CNPJValidation(cnpj, returnMessage) {
+  var stringCnpj = cnpj ? cnpj.replace(/[^\d]+/g, '') : '';
   if (stringCnpj === '' || stringCnpj.length !== 14) return returnMessage ? returnMessage('CNPJ inválido') : 'CNPJ inválido';
   if (allEqualDigits(stringCnpj)) return returnMessage ? returnMessage('CNPJ inválido') : 'CNPJ inválido';
   var length = stringCnpj.length - 2;
@@ -83,7 +68,7 @@ function CNPJValidation() {
   var pos = length - 7; // 1° digit validation
 
   for (var i = length; i >= 1; i--) {
-    sum += numbers.charAt(length - i) * pos--;
+    sum += (0, _lodash.parseInt)(numbers.charAt(length - i)) * pos--;
     if (pos < 2) pos = 9;
   }
 
@@ -95,11 +80,11 @@ function CNPJValidation() {
   pos = length - 7; // 2° digit validation
 
   for (var _i2 = length; _i2 >= 1; _i2--) {
-    sum += numbers.charAt(length - _i2) * pos--;
+    sum += (0, _lodash.parseInt)(numbers.charAt(length - _i2)) * pos--;
     if (pos < 2) pos = 9;
   }
 
   result = sum % 11 < 2 ? 0 : 11 - sum % 11;
   if (result.toString() !== digits.charAt(1)) return returnMessage ? returnMessage('CNPJ inválido') : 'CNPJ inválido';
-  return returnMessage ? returnMessage(undefined) : undefined;
+  return returnMessage ? returnMessage('') : undefined;
 }

package/lib/inputs/mask/imaskHOC.d.ts

@@ -0,0 +1,14 @@
+import React__default from 'react';
+import { IMaskHOCProps } from '../types.js';
+import '../../@types/PermissionAttr.js';
+import '../../@types/DataCombo.js';
+import '../select/types.js';
+import '../base/types.js';
+import '../../@types/Period.js';
+
+declare const IMaskHOC: <ComponentProps extends IMaskHOCProps>(ComposedComponent: React__default.ComponentType<ComponentProps>) => {
+    (props: ComponentProps): JSX.Element;
+    displayName: string;
+};
+
+export { IMaskHOC as default };

package/lib/inputs/mask/imaskHOC.js

@@ -3,11 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = IMaskHOC;
+exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _imask = _interopRequireDefault(require("imask"));
 
@@ -15,277 +13,210 @@ var helpers = _interopRequireWildcard(require("./helpers"));
 
 var _permissionValidations = require("../../permissionValidations");
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+var _this = void 0;
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible, _permissionValidations.OPTIONS_ON_DENIED.readOnly, _permissionValidations.OPTIONS_ON_DENIED.hideContent];
+
+var IMaskHOC = function IMaskHOC(ComposedComponent) {
+  var MaskedComponent = function MaskedComponent(props) {
+    var permissionAttr = props.permissionAttr,
+        skeletonize = props.skeletonize,
+        _inputRef = props.inputRef,
+        _props$placeholderCha = props.placeholderChar,
+        placeholderChar = _props$placeholderCha === void 0 ? '_' : _props$placeholderCha,
+        _props$lazy = props.lazy,
+        lazy = _props$lazy === void 0 ? false : _props$lazy,
+        _props$pattern = props.pattern,
+        pattern = _props$pattern === void 0 ? '' : _props$pattern,
+        _props$radix = props.radix,
+        radix = _props$radix === void 0 ? ' ' : _props$radix,
+        _props$thousandsSepar = props.thousandsSeparator,
+        thousandsSeparator = _props$thousandsSepar === void 0 ? '' : _props$thousandsSepar,
+        _props$mapToRadix = props.mapToRadix,
+        mapToRadix = _props$mapToRadix === void 0 ? [] : _props$mapToRadix,
+        _props$scale = props.scale,
+        scale = _props$scale === void 0 ? 2 : _props$scale,
+        _props$signed = props.signed,
+        signed = _props$signed === void 0 ? false : _props$signed,
+        _props$normalizeZeros = props.normalizeZeros,
+        normalizeZeros = _props$normalizeZeros === void 0 ? true : _props$normalizeZeros,
+        _props$padFractionalZ = props.padFractionalZeros,
+        padFractionalZeros = _props$padFractionalZ === void 0 ? true : _props$padFractionalZ,
+        mask = props.mask,
+        _props$commit = props.commit,
+        commit = _props$commit === void 0 ? function () {} : _props$commit,
+        parse = props.parse,
+        format = props.format,
+        definitions = props.definitions,
+        groups = props.groups,
+        min = props.min,
+        max = props.max,
+        dispatch = props.dispatch,
+        _props$value = props.value,
+        value = _props$value === void 0 ? '' : _props$value,
+        onChange = props.onChange;
+    var maskOptions = {
+      placeholderChar: placeholderChar,
+      lazy: lazy,
+      pattern: pattern,
+      radix: radix,
+      thousandsSeparator: thousandsSeparator,
+      mapToRadix: mapToRadix,
+      scale: scale,
+      signed: signed,
+      normalizeZeros: normalizeZeros,
+      padFractionalZeros: padFractionalZeros,
+      mask: mask,
+      commit: commit,
+      parse: parse,
+      format: format,
+      definitions: definitions,
+      groups: groups,
+      min: min,
+      max: max,
+      dispatch: dispatch
+    };
+
+    var _useState = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr)),
+        _useState2 = _slicedToArray(_useState, 1),
+        onDenied = _useState2[0];
+
+    var elementRef = (0, _react.useRef)(null);
+    var maskRef = (0, _react.useRef)(null);
+    var hideContent = onDenied.hideContent,
+        unvisible = onDenied.unvisible,
+        disabled = onDenied.disabled,
+        readOnly = onDenied.readOnly;
+    var dontInitMask = hideContent || unvisible || skeletonize;
+    var disableCallbacks = disabled || readOnly;
+
+    var setValue = function setValue(newValue) {
+      if (maskRef.current) {
+        if (props.unmask) maskRef.current.unmaskedValue = newValue.toString();else maskRef.current.value = String(newValue);
+      }
+    };
+
+    var onAccept = function onAccept() {
+      if (onChange && !disableCallbacks && maskRef.current) {
+        var _maskRef$current = maskRef.current,
+            unmaskedValue = _maskRef$current.unmaskedValue,
+            el = _maskRef$current.el;
+        var name = el.name || el.input && el.input.name;
+        onChange({
+          target: {
+            value: unmaskedValue,
+            name: name
+          }
+        }, props.unmask ? unmaskedValue : maskRef.current.value);
+      }
+    };
+
+    var onComplete = function onComplete() {
+      if (props.onComplete && !disableCallbacks && maskRef.current) {
+        var _maskRef$current2 = maskRef.current,
+            unmaskedValue = _maskRef$current2.unmaskedValue,
+            el = _maskRef$current2.el;
+        var name = el.name || el.input && el.input.name;
+        props.onComplete({
+          target: {
+            value: unmaskedValue,
+            name: name
+          }
+        }, props.unmask ? unmaskedValue : maskRef.current.value);
+      }
+    };
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+    var getMask = function getMask() {
+      var element = elementRef.current;
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+      if (element) {
+        var maskCurrent = maskRef.current;
 
-function IMaskHOC(ComposedComponent) {
-  var MaskedComponent = /*#__PURE__*/function (_React$Component) {
-    _inherits(MaskedComponent, _React$Component);
+        if (!maskCurrent) {
+          maskRef.current = (0, _imask.default)(element, maskOptions).on('accept', onAccept.bind(_this)).on('complete', onComplete.bind(_this));
+          setValue(value);
+        } else {
+          maskCurrent.updateOptions(maskOptions);
+        }
+      }
+    };
 
-    var _super = _createSuper(MaskedComponent);
+    var destroyMask = function destroyMask() {
+      if (maskRef.current) {
+        maskRef.current.destroy();
+        maskRef.current = null;
+      }
+    };
 
-    function MaskedComponent(props) {
-      var _this;
+    (0, _react.useEffect)(function () {
+      if (props.handlerSetOnDenied) props.handlerSetOnDenied(onDenied);
+      if (!props.mask || dontInitMask) return;
+      getMask(); // eslint-disable-next-line consistent-return
 
-      _classCallCheck(this, MaskedComponent);
+      return function () {
+        var _maskRef$current3, _maskRef$current4;
 
-      _this = _super.call(this, props);
-      var options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible, _permissionValidations.OPTIONS_ON_DENIED.readOnly, _permissionValidations.OPTIONS_ON_DENIED.hideContent];
-      _this.state = {
-        maskOptions: helpers.extractOptionsFromProps(props, MaskedComponent.propTypes),
-        currentProps: _extends({}, props),
-        onDenied: (0, _permissionValidations.actionsOnPermissionDenied)(props.permissionAttr, options)
+        (_maskRef$current3 = maskRef.current) === null || _maskRef$current3 === void 0 ? void 0 : _maskRef$current3.off('accept', onAccept);
+        (_maskRef$current4 = maskRef.current) === null || _maskRef$current4 === void 0 ? void 0 : _maskRef$current4.off('complete', onComplete);
       };
-      var _this$state$onDenied = _this.state.onDenied,
-          hideContent = _this$state$onDenied.hideContent,
-          unvisible = _this$state$onDenied.unvisible,
-          disabled = _this$state$onDenied.disabled,
-          readOnly = _this$state$onDenied.readOnly;
-      var skeletonize = _this.state.currentProps.skeletonize;
-      _this.dontInitMask = hideContent || unvisible || skeletonize;
-      _this.disableCallbacks = disabled || readOnly;
-      return _this;
-    }
-
-    _createClass(MaskedComponent, [{
-      key: "componentDidMount",
-      value: function componentDidMount() {
-        var _this$props = this.props,
-            mask = _this$props.mask,
-            handlerSetOnDenied = _this$props.handlerSetOnDenied;
-        if (handlerSetOnDenied) handlerSetOnDenied(this.state.onDenied);
-        if (!mask || this.dontInitMask) return;
-        this.initMask();
-      }
-    }, {
-      key: "componentDidUpdate",
-      value: function componentDidUpdate() {
-        var _this$state = this.state,
-            maskOptions = _this$state.maskOptions,
-            currentProps = _this$state.currentProps;
-
-        if (maskOptions.mask && !this.dontInitMask) {
-          if (this.maskRef) {
-            this.maskRef.updateOptions(maskOptions);
-            if ('value' in currentProps) this.maskValue = currentProps.value;
-          } else {
-            this.initMask(maskOptions);
-          }
-        } else if (!this.dontInitMask) {
-          this.destroyMask();
-          if ('value' in currentProps) this.element.value = currentProps.value;
-        }
-      }
-    }, {
-      key: "componentWillUnmount",
-      value: function componentWillUnmount() {
-        this.destroyMask();
-      }
-    }, {
-      key: "onChange",
-      value: function onChange() {
-        var onChange = this.props.onChange;
-
-        if (onChange && !this.disableCallbacks) {
-          var _this$maskRef = this.maskRef,
-              unmaskedValue = _this$maskRef.unmaskedValue,
-              el = _this$maskRef.el;
-          var name = el.name || el.input && el.input.name;
-          onChange({
-            target: {
-              value: unmaskedValue,
-              name: name
-            }
-          }, this.maskValue);
+    }, [maskOptions]);
+    (0, _react.useEffect)(function () {
+      if (maskOptions.mask && !dontInitMask) {
+        if (maskRef.current) {
+          setValue(value);
+        } else {
+          getMask();
         }
+      } else if (!dontInitMask) {
+        destroyMask();
+        if (value && elementRef.current) elementRef.current.value = value;
       }
-    }, {
-      key: "onComplete",
-      value: function onComplete() {
-        var onComplete = this.props.onComplete;
-
-        if (onComplete && !this.disableCallbacks) {
-          var _this$maskRef2 = this.maskRef,
-              unmaskedValue = _this$maskRef2.unmaskedValue,
-              el = _this$maskRef2.el;
-          var name = el.name || el.input && el.input.name;
-          onComplete({
-            target: {
-              value: unmaskedValue,
-              name: name
-            }
-          }, this.maskValue);
-        }
-      }
-    }, {
-      key: "maskValue",
-      get: function get() {
-        return this.props.unmask ? this.maskRef.unmaskedValue : this.maskRef.value;
+    }, [value]);
+    (0, _react.useEffect)(function () {
+      return destroyMask;
+    }, []);
+    return /*#__PURE__*/_react.default.createElement(ComposedComponent, _extends({}, helpers.extractNonMaskProps(props, maskOptions), {
+      onDeniedActions: onDenied,
+      defaultValue: value,
+      onChange: function onChange(e) {
+        return setValue(e.target.value);
       },
-      set: function set(value) {
-        if (value === void 0) {
-          value = '';
-        }
+      inputRef: function inputRef(el) {
+        elementRef.current = el; // Propagate the input ref for who call it
 
-        this.maskRef.value = value;
-
-        if (this.props.unmask) {
-          this.maskRef.unmaskedValue = value;
-        } else this.maskRef.value = value;
-      }
-    }, {
-      key: "initMask",
-      value: function initMask() {
-        var maskOptions = helpers.extractOptionsFromProps(_extends({}, this.props), MaskedComponent.propTypes);
-        this.maskRef = new _imask["default"](this.element, maskOptions).on('accept', this.onChange.bind(this)).on('complete', this.onComplete.bind(this));
-        this.maskValue = this.props.value;
-      }
-    }, {
-      key: "destroyMask",
-      value: function destroyMask() {
-        if (this.maskRef) {
-          this.maskRef.destroy();
-          delete this.maskRef;
+        if (_inputRef) {
+          if (_typeof(_inputRef) === 'object') _inputRef.current = el;else _inputRef(el);
         }
       }
-    }, {
-      key: "render",
-      value: function render() {
-        var _this2 = this;
-
-        var _this$props2 = this.props,
-            _inputRef = _this$props2.inputRef,
-            value = _this$props2.value;
-        var onDenied = this.state.onDenied;
-        return /*#__PURE__*/_react["default"].createElement(ComposedComponent, _extends({}, helpers.extractNonMaskProps(this.props, MaskedComponent.propTypes), {
-          defaultValue: value,
-          onDeniedActions: onDenied,
-          inputRef: function inputRef(el) {
-            _this2.element = el; // Propagate the input ref for who call it
-
-            if (_inputRef) {
-              if (_typeof(_inputRef) === 'object') _inputRef.current = el;else _inputRef(el);
-            }
-          }
-        }));
-      }
-    }], [{
-      key: "getDerivedStateFromProps",
-      value: function getDerivedStateFromProps(props, state) {
-        var maskOptions = state.maskOptions,
-            currentProps = state.currentProps;
-
-        var newProps = _extends({}, currentProps, props);
-
-        if (currentProps !== newProps) {
-          var currentMaskOptions = helpers.extractOptionsFromProps(newProps, MaskedComponent.propTypes);
-          return {
-            maskOptions: maskOptions !== currentMaskOptions ? currentMaskOptions : maskOptions,
-            currentProps: _extends({}, newProps)
-          };
-        }
-
-        return null;
-      }
-    }]);
-
-    return MaskedComponent;
-  }(_react["default"].Component);
-
-  MaskedComponent.propTypes = {
-    // common
-    mask: _propTypes["default"].oneOfType([_propTypes["default"].array, _propTypes["default"].func, _propTypes["default"].string, _propTypes["default"].instanceOf(RegExp), _propTypes["default"].oneOf([Date, Number, _imask["default"].Masked]), _propTypes["default"].instanceOf(_imask["default"].Masked)]).isRequired,
-    value: _propTypes["default"].string,
-    unmask: _propTypes["default"].bool,
-
-    /* prepare: PropTypes.func,
-    validate: PropTypes.func,
-    commit: PropTypes.func, */
-    // events
-    commit: _propTypes["default"].func,
-    onChange: _propTypes["default"].func,
-    onComplete: _propTypes["default"].func,
-    inputRef: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].func]),
-    // pattern
-    placeholderChar: _propTypes["default"].string,
-    lazy: _propTypes["default"].bool,
-    definitions: _propTypes["default"].object,
-    groups: _propTypes["default"].object,
-    // date
-    pattern: _propTypes["default"].string,
-    format: _propTypes["default"].func,
-    parse: _propTypes["default"].func,
-    // number
-    radix: _propTypes["default"].string,
-    thousandsSeparator: _propTypes["default"].string,
-    mapToRadix: _propTypes["default"].arrayOf(_propTypes["default"].string),
-    scale: _propTypes["default"].number,
-    signed: _propTypes["default"].bool,
-    normalizeZeros: _propTypes["default"].bool,
-    padFractionalZeros: _propTypes["default"].bool,
-    min: _propTypes["default"].number,
-    max: _propTypes["default"].number,
-    // dynamic
-    dispatch: _propTypes["default"].func,
-    permissionAttr: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].arrayOf(_propTypes["default"].object)]),
-    handlerSetOnDenied: _propTypes["default"].func
-  };
-  MaskedComponent.defaultProps = {
-    value: undefined,
-    unmask: undefined,
-    onChange: undefined,
-    onComplete: undefined,
-    inputRef: undefined,
-    placeholderChar: '_',
-    lazy: false,
-    definitions: undefined,
-    groups: undefined,
-    pattern: '',
-    format: undefined,
-    parse: undefined,
-    // number
-    radix: ' ',
-    thousandsSeparator: '',
-    mapToRadix: [],
-    scale: 2,
-    signed: false,
-    normalizeZeros: true,
-    padFractionalZeros: true,
-    min: undefined,
-    max: undefined,
-    dispatch: undefined,
-    commit: function commit() {},
-    permissionAttr: undefined,
-    handlerSetOnDenied: undefined
+    }));
   };
+
   var nestedComponentName = ComposedComponent.displayName || ComposedComponent.name || 'Component';
   MaskedComponent.displayName = "IMask(".concat(nestedComponentName, ")");
   return MaskedComponent;
-}
+};
+
+var _default = IMaskHOC;
+exports.default = _default;