intelicoreact 1.3.21 → 1.3.23

package/dist/Atomic/FormElements/Input/Input.scss

@@ -16,18 +16,19 @@
 
   &__wrap {
     position: relative;
+
     display: flex;
     align-items: center;
 
     box-sizing: border-box;
     height: 28px;
 
-    border: 1px solid #E2E5EC;
+    border: 1px solid #e2e5ec;
     border-radius: 4px;
-    background-color: #FFF;
+    background-color: #fff;
 
     &_focus {
-      border-color: #6B81DD;
+      border-color: #6b81dd;
       filter: drop-shadow(0 0 4px rgb(93 120 255 / 50%));
     }
 
@@ -35,12 +36,12 @@
       pointer-events: none;
 
       opacity: 0.5;
-      border-color: #A6ACB1;
-      background: #F7F8FA;
+      border-color: #a6acb1;
+      background: #f7f8fa;
     }
 
     &_error {
-      border-color: #F06D8D !important;
+      border-color: #f06d8d !important;
     }
 
     .lds-ring.lds-ring_small {
@@ -52,12 +53,12 @@
     pointer-events: none;
 
     opacity: 0.5;
-    border-color: #A6ACB1;
-    background: #F7F8FA;
+    border-color: #a6acb1;
+    background: #f7f8fa;
   }
 
   &_error {
-    border-color: #F06D8D;
+    border-color: #f06d8d;
   }
 
   svg {
@@ -70,12 +71,12 @@
     height: 100%;
     padding: 0 5px;
 
-    color: #1E1E2D;
-    border: none;
-    border-radius: 4px;
-
     font-size: 13px;
     font-weight: 400;
+
+    color: #1e1e2d;
+    border: none;
+    border-radius: 4px;
   }
 
   &__close {
@@ -110,7 +111,7 @@
 
       content: "";
 
-      background-color: #9AA0B9;
+      background-color: #9aa0b9;
     }
 
     &::before {
@@ -131,20 +132,19 @@
 
   &__num-btn {
     display: flex;
-    align-items: center;
     justify-content: center;
+    align-items: center;
 
     width: 24px;
     height: 100%;
 
+    font-size: 20px;
     cursor: pointer;
     user-select: none;
 
-    border-left: 1px solid #E2E5EC;
+    border-left: 1px solid #e2e5ec;
     background: none;
 
-    font-size: 20px;
-
     &.disabled {
       opacity: 0.3;
     }

package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js

@@ -1,154 +1,104 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
+var _classnames = _interopRequireDefault(require("classnames"));
 var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
-
 var _reactInputMask = _interopRequireDefault(require("react-input-mask"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Calendar = _interopRequireDefault(require("../Calendar/Calendar"));
-
 var _useClickOutside = require("../../../Functions/useClickOutside");
-
+var _Calendar = _interopRequireDefault(require("../Calendar/Calendar"));
 require("./InputCalendar.scss");
-
-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; }
-
-var InputCalendar = function InputCalendar(_ref) {
-  var value = _ref.value,
-      minDate = _ref.minDate,
-      maxDate = _ref.maxDate,
-      _ref$format = _ref.format,
-      format = _ref$format === void 0 ? 'MM/DD/YYYY' : _ref$format,
-      isDontLimitFuture = _ref.isDontLimitFuture,
-      onChange = _ref.onChange,
-      _ref$className = _ref.className,
-      className = _ref$className === void 0 ? '' : _ref$className,
-      _ref$placeholder = _ref.placeholder,
-      placeholder = _ref$placeholder === void 0 ? 'mm/dd/yyyy' : _ref$placeholder,
-      _ref$mask = _ref.mask,
-      mask = _ref$mask === void 0 ? '99/99/9999' : _ref$mask,
-      isListTop = _ref.isListTop,
-      disabled = _ref.disabled,
-      _ref$disabledFormatte = _ref.disabledFormattedMaxDate,
-      disabledFormattedMaxDate = _ref$disabledFormatte === void 0 ? false : _ref$disabledFormatte,
-      testId = _ref.testId,
-      _ref$onKeyDown = _ref.onKeyDown,
-      onKeyDownProp = _ref$onKeyDown === void 0 ? function (e) {} : _ref$onKeyDown,
-      _ref$onKeyUp = _ref.onKeyUp,
-      onKeyUpProp = _ref$onKeyUp === void 0 ? function (e) {} : _ref$onKeyUp,
-      _ref$onBlur = _ref.onBlur,
-      onBlurProp = _ref$onBlur === void 0 ? function (e) {} : _ref$onBlur;
-
-  var _useState = (0, _react.useState)(null),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      isOpened = _useState2[0],
-      setIsOpened = _useState2[1];
-
-  var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      isOpenedByEnter = _useState4[0],
-      setOpenedByEnter = _useState4[1];
-
-  var calendarRef = (0, _react.useRef)(null);
-  var inputRef = (0, _react.useRef)(null);
-  var formattedMinDate = (0, _momentTimezone.default)(minDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(minDate, format).format(format) : null;
-  var formattedMaxDate = (0, _momentTimezone.default)(maxDate, format).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(maxDate, format).format(format) : null;
-  var momentMinDate = (0, _momentTimezone.default)(formattedMinDate, format).startOf('day');
-  var momentMaxDate = (0, _momentTimezone.default)(formattedMaxDate, format).startOf('day');
-  (0, _useClickOutside.useClickOutside)(calendarRef, function () {
-    return setIsOpened(false);
-  });
-
-  var changeInputValue = function changeInputValue(val) {
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const InputCalendar = _ref => {
+  let {
+    value,
+    minDate,
+    maxDate,
+    format = "MM/DD/YYYY",
+    isDontLimitFuture,
+    onChange,
+    className = "",
+    placeholder = "mm/dd/yyyy",
+    mask = "99/99/9999",
+    isListTop,
+    disabled,
+    disabledFormattedMaxDate = false,
+    testId,
+    onKeyDown: onKeyDownProp = e => {},
+    onKeyUp: onKeyUpProp = e => {},
+    onBlur: onBlurProp = e => {}
+  } = _ref;
+  const [isOpened, setIsOpened] = (0, _react.useState)(null);
+  const [isOpenedByEnter, setOpenedByEnter] = (0, _react.useState)(false);
+  const calendarRef = (0, _react.useRef)(null);
+  const inputRef = (0, _react.useRef)(null);
+  const formattedMinDate = (0, _momentTimezone.default)(minDate, format).format(format) !== "Invalid date" ? (0, _momentTimezone.default)(minDate, format).format(format) : null;
+  const formattedMaxDate = (0, _momentTimezone.default)(maxDate, format).format(format) !== "Invalid date" ? (0, _momentTimezone.default)(maxDate, format).format(format) : null;
+  const momentMinDate = (0, _momentTimezone.default)(formattedMinDate, format).startOf("day");
+  const momentMaxDate = (0, _momentTimezone.default)(formattedMaxDate, format).startOf("day");
+  (0, _useClickOutside.useClickOutside)(calendarRef, () => setIsOpened(false));
+  const changeInputValue = val => {
     if (onChange) onChange(val);
   };
-
-  var changeCalendarDay = function changeCalendarDay(val) {
+  const changeCalendarDay = val => {
     if (onChange) onChange(val);
   };
-
-  var getCalendarValue = function getCalendarValue(value) {
-    var date = (0, _momentTimezone.default)(value).format('L');
-    if (date !== 'Invalid date') return date;
-    return (0, _momentTimezone.default)(new Date()).format('L');
+  const getCalendarValue = value => {
+    const date = (0, _momentTimezone.default)(value).format("L");
+    if (date !== "Invalid date") return date;
+    return (0, _momentTimezone.default)(new Date()).format("L");
   };
-
-  (0, _react.useEffect)(function () {
-    if (typeof isOpened === 'boolean' && !isOpened) {
+  (0, _react.useEffect)(() => {
+    if (typeof isOpened === "boolean" && !isOpened) {
       handleBlur();
     }
   }, [isOpened]);
-
-  var handleBlur = function handleBlur(e) {
+  const handleBlur = e => {
     var _inputRef$current;
-
-    var value = inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value;
-    if ((0, _momentTimezone.default)(value, format).format(format) === 'Invalid date' || value.indexOf('_') > -1) value = '';
-    if (value && typeof isOpened === 'boolean' && (0, _momentTimezone.default)(value, format).startOf('day').isBefore(momentMinDate, 'days')) onChange(formattedMinDate);else if (value && typeof isOpened === 'boolean' && (0, _momentTimezone.default)(value, format).endOf('day').isAfter(momentMaxDate, 'days')) onChange(formattedMaxDate);else if (value) onChange((0, _momentTimezone.default)(value, format).format(format));
+    let value = inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value;
+    if ((0, _momentTimezone.default)(value, format).format(format) === "Invalid date" || value.indexOf("_") > -1) value = "";
+    if (value && typeof isOpened === "boolean" && (0, _momentTimezone.default)(value, format).startOf("day").isBefore(momentMinDate, "days")) onChange(formattedMinDate);else if (value && typeof isOpened === "boolean" && (0, _momentTimezone.default)(value, format).endOf("day").isAfter(momentMaxDate, "days")) onChange(formattedMaxDate);else if (value) onChange((0, _momentTimezone.default)(value, format).format(format));
   };
-
-  var onKeyDown = function onKeyDown(e) {
+  const onKeyDown = e => {
     if (isOpened && [9, 13].includes(e.keyCode)) {
       setIsOpened(false);
       setOpenedByEnter(true);
     }
-
     onKeyDownProp(e);
   };
-
-  var onKeyUp = function onKeyUp(e) {
+  const onKeyUp = e => {
     var _e$target$value;
-
-    var isValidLenght = ((_e$target$value = e.target.value) === null || _e$target$value === void 0 ? void 0 : _e$target$value.replace(/[^0-9]/g, '').length) === 8;
-
+    const isValidLenght = ((_e$target$value = e.target.value) === null || _e$target$value === void 0 ? void 0 : _e$target$value.replace(/[^0-9]/g, "").length) === 8;
     if ([9, 13].includes(e.keyCode)) {
       setIsOpened(true);
       setOpenedByEnter(true);
     }
-
     if (isValidLenght) {
       setIsOpened(false);
       handleBlur();
     } else {
       setIsOpened(true);
     }
-
     onKeyUpProp(e);
   };
-
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-testid": "inputCalendar--key-".concat(testId, "--container"),
-    className: (0, _classnames.default)('input__wrap calendar-container', className, {
-      'calendar-container_disabled': disabled
+    className: (0, _classnames.default)("input__wrap calendar-container", className, {
+      "calendar-container_disabled": disabled
     }),
     ref: calendarRef
   }, /*#__PURE__*/_react.default.createElement(_reactInputMask.default, {
     mask: mask,
     placeholder: placeholder,
     value: value,
-    onChange: function onChange(e) {
-      return changeInputValue(e.target.value);
-    },
+    onChange: e => changeInputValue(e.target.value),
     className: "calendar-dropdown",
-    onClick: function onClick() {
-      return setIsOpened(true);
-    },
+    onClick: () => setIsOpened(true),
     onKeyUp: onKeyUp,
     onKeyDown: onKeyDown,
     onBlur: onBlurProp,
@@ -156,21 +106,17 @@ var InputCalendar = function InputCalendar(_ref) {
   }), isOpened ? /*#__PURE__*/_react.default.createElement(_Calendar.default, {
     testId: testId,
     date: getCalendarValue(value),
-    setDate: function setDate(newDate) {
-      return changeCalendarDay(newDate);
-    },
+    setDate: newDate => changeCalendarDay(newDate),
     params: {
-      format: format,
+      format,
       minDate: formattedMinDate,
       maxDate: formattedMaxDate,
-      momentMinDate: momentMinDate,
-      momentMaxDate: momentMaxDate,
-      isDontLimitFuture: isDontLimitFuture
+      momentMinDate,
+      momentMaxDate,
+      isDontLimitFuture
     },
     isListTop: isListTop,
     setIsOpened: setIsOpened
   }) : null);
 };
-
-var _default = InputCalendar;
-exports.default = _default;
+var _default = exports.default = InputCalendar;

package/dist/Atomic/FormElements/InputColor/InputColor.js

@@ -1,65 +1,52 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Input = _interopRequireDefault(require("../Input/Input"));
-
 var _fieldValueFormatters = require("../../../Functions/fieldValueFormatters");
-
+var _Input = _interopRequireDefault(require("../Input/Input"));
 require("./InputColor.scss");
-
-var _excluded = ["value", "className", "symbolsLimit", "onChange", "withHexFormat", "initialHexOfColorBlock", "testId", "withDelete"];
-
-var InputColor = function InputColor(_ref) {
-  var value = _ref.value,
-      className = _ref.className,
-      _ref$symbolsLimit = _ref.symbolsLimit,
-      symbolsLimit = _ref$symbolsLimit === void 0 ? 7 : _ref$symbolsLimit,
-      onChange = _ref.onChange,
-      _ref$withHexFormat = _ref.withHexFormat,
-      withHexFormat = _ref$withHexFormat === void 0 ? {
-    withSharp: false,
-    isTurnOn: true
-  } : _ref$withHexFormat,
-      _ref$initialHexOfColo = _ref.initialHexOfColorBlock,
-      initialHexOfColorBlock = _ref$initialHexOfColo === void 0 ? '#9AA0B9' : _ref$initialHexOfColo,
-      _ref$testId = _ref.testId,
-      testId = _ref$testId === void 0 ? '' : _ref$testId,
-      _ref$withDelete = _ref.withDelete,
-      withDelete = _ref$withDelete === void 0 ? true : _ref$withDelete,
-      args = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var withSharp = withHexFormat.withSharp,
-      isHex = withHexFormat.isTurnOn; // HANDLES
-
-  var handle = {
-    change: function change(e) {
-      var inputValue = e !== null && e !== void 0 && e.target ? e.target.value : e;
+const InputColor = _ref => {
+  let {
+    value,
+    className,
+    symbolsLimit = 7,
+    onChange,
+    withHexFormat = {
+      withSharp: false,
+      isTurnOn: true
+    },
+    initialHexOfColorBlock = "#9AA0B9",
+    testId = "",
+    withDelete = true,
+    ...args
+  } = _ref;
+  const {
+    withSharp,
+    isTurnOn: isHex
+  } = withHexFormat;
+  // HANDLES
+  const handle = {
+    change: e => {
+      let inputValue = e !== null && e !== void 0 && e.target ? e.target.value : e;
       inputValue = (0, _fieldValueFormatters.formatToOnlyASCIICodeText)(inputValue);
       if (isHex) inputValue = (0, _fieldValueFormatters.formatToHex)({
-        inputValue: inputValue,
+        inputValue,
         withSharp: withSharp
       });
-      if (symbolsLimit && inputValue.length > +symbolsLimit) inputValue = inputValue.substring(0, +symbolsLimit);
-      onChange === null || onChange === void 0 ? void 0 : onChange(inputValue);
+      if (symbolsLimit && inputValue.length > Number(symbolsLimit)) inputValue = inputValue.substring(0, Number(symbolsLimit));
+      onChange === null || onChange === void 0 || onChange(inputValue);
     }
   };
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('inputColor', className)
+    className: (0, _classnames.default)("inputColor", className)
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('inputColor__color-block'),
+    className: (0, _classnames.default)("inputColor__color-block"),
     style: {
       backgroundColor: value && value.length === 7 ? value : initialHexOfColorBlock
     }
@@ -69,10 +56,8 @@ var InputColor = function InputColor(_ref) {
     onChange: handle.change,
     symbolsLimit: symbolsLimit || 7,
     testId: "inputColor--key-".concat(testId),
-    className: (0, _classnames.default)('input inputColor__input'),
+    className: (0, _classnames.default)("input inputColor__input"),
     type: "text"
   })));
 };
-
-var _default = InputColor;
-exports.default = _default;
+var _default = exports.default = InputColor;

package/dist/Atomic/FormElements/InputCurrency/InputCurrency.js

@@ -1,105 +1,77 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 require("./InputCurrency.scss");
-
-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; }
-
-var InputCurrency = function InputCurrency(_ref) {
-  var currencySymbol = _ref.currencySymbol,
-      onChange = _ref.onChange,
-      className = _ref.className,
-      value = _ref.value,
-      disabled = _ref.disabled,
-      _ref$attributesOfNati = _ref.attributesOfNativeInput,
-      attributesOfNativeInput = _ref$attributesOfNati === void 0 ? {} : _ref$attributesOfNati,
-      _ref$min = _ref.min,
-      min = _ref$min === void 0 ? 0 : _ref$min,
-      max = _ref.max,
-      error = _ref.error;
-
-  var _useState = (0, _react.useState)(currencySymbol || '$'),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      inputValue = _useState2[0],
-      setInputValue = _useState2[1];
-
-  var inputRef = (0, _react.useRef)(null);
-
-  var formatNumberWithCommas = function formatNumberWithCommas(number) {
-    return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const InputCurrency = _ref => {
+  let {
+    currencySymbol,
+    onChange,
+    className,
+    value,
+    disabled,
+    attributesOfNativeInput = {},
+    min = 0,
+    max,
+    error
+  } = _ref;
+  const [inputValue, setInputValue] = (0, _react.useState)(currencySymbol || "$");
+  const inputRef = (0, _react.useRef)(null);
+  const formatNumberWithCommas = number => {
+    return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
   };
-
-  var formatCurrencyInput = function formatCurrencyInput(event) {
-    var newValue = event.target.value;
-    newValue = newValue.replace(/[^0-9]/g, '');
+  const formatCurrencyInput = event => {
+    let newValue = event.target.value;
+    newValue = newValue.replace(/[^0-9]/g, "");
     newValue = formatNumberWithCommas(newValue);
-    newValue = "".concat(currencySymbol || '$').concat(newValue);
+    newValue = "".concat(currencySymbol || "$").concat(newValue);
     setInputValue(newValue);
-    onChange(newValue.replace(/[^0-9]/g, ''));
+    onChange(newValue.replace(/[^0-9]/g, ""));
   };
-
-  var onInputClick = function onInputClick() {
+  const onInputClick = () => {
     if (!inputValue) {
       inputRef.current.selectionStart = inputRef.current.selectionEnd = currencySymbol ? currencySymbol.length : 1;
     }
   };
-
-  var onKeyDown = function onKeyDown(event) {
+  const onKeyDown = event => {
     if (event.key.match(/^[a-zA-Z0-9]$/)) {
       setInputValue(inputValue.slice(0, inputRef.current.selectionStart));
     }
   };
-
-  var checkMinMax = function checkMinMax(event, value) {
-    var _event$target, _event$target$value;
-
-    var clearValue = value !== null && value !== void 0 ? value : event === null || event === void 0 ? void 0 : (_event$target = event.target) === null || _event$target === void 0 ? void 0 : (_event$target$value = _event$target.value) === null || _event$target$value === void 0 ? void 0 : _event$target$value.replace(/[^0-9]/g, '');
+  const checkMinMax = (event, value) => {
+    var _event$target;
+    const clearValue = value !== null && value !== void 0 ? value : event === null || event === void 0 || (_event$target = event.target) === null || _event$target === void 0 || (_event$target = _event$target.value) === null || _event$target === void 0 ? void 0 : _event$target.replace(/[^0-9]/g, "");
     if (!clearValue) return false;
-
     if (clearValue < min) {
-      setInputValue("".concat(currencySymbol || '$').concat(formatNumberWithCommas(min)));
+      setInputValue("".concat(currencySymbol || "$").concat(formatNumberWithCommas(min)));
       onChange(min);
       return false;
     }
-
     if (max && clearValue > max) {
-      setInputValue("".concat(currencySymbol || '$').concat(formatNumberWithCommas(max)));
+      setInputValue("".concat(currencySymbol || "$").concat(formatNumberWithCommas(max)));
       onChange(max);
       return false;
     }
-
     return true;
   };
-
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     var _inputValue$toString;
-
-    if (value && value.toString() !== (inputValue === null || inputValue === void 0 ? void 0 : (_inputValue$toString = inputValue.toString()) === null || _inputValue$toString === void 0 ? void 0 : _inputValue$toString.replace(/[^0-9]/g, ''))) {
-      if (checkMinMax(null, value)) setInputValue("".concat(currencySymbol || '$').concat(formatNumberWithCommas(value)));
+    if (value && value.toString() !== (inputValue === null || inputValue === void 0 || (_inputValue$toString = inputValue.toString()) === null || _inputValue$toString === void 0 ? void 0 : _inputValue$toString.replace(/[^0-9]/g, ""))) {
+      if (checkMinMax(null, value)) setInputValue("".concat(currencySymbol || "$").concat(formatNumberWithCommas(value)));
     }
   }, [value]);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('input-currency-box', className, {
-      disabled: disabled,
-      'input-currency__error': error
+    className: (0, _classnames.default)("input-currency-box", className, {
+      disabled,
+      "input-currency__error": error
     })
   }, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
     className: "input-currency",
@@ -112,6 +84,4 @@ var InputCurrency = function InputCurrency(_ref) {
     onBlur: checkMinMax
   }, attributesOfNativeInput)));
 };
-
-var _default = InputCurrency;
-exports.default = _default;
+var _default = exports.default = InputCurrency;

package/dist/Atomic/FormElements/InputCurrency/InputCurrency.scss

@@ -1,15 +1,18 @@
-.input-currency-box {}
+.input-currency-box {
+}
 
 .input-currency {
-  padding: 0 16px;
+  box-sizing: border-box;
   height: 40px;
   max-height: 40px;
-  border-radius: 6px;
-  border: 1px solid #E1E8F1;
-  background: #F8FBFF;
+  padding: 0 16px;
+
   font-size: 16px;
   font-weight: 400;
   line-height: 24px;
   letter-spacing: 0.2px;
-  box-sizing:border-box;
+
+  border: 1px solid #e1e8f1;
+  border-radius: 6px;
+  background: #f8fbff;
 }