carbon-react 106.6.7 → 106.6.8

package/esm/components/decimal/decimal.component.js

@@ -29,8 +29,7 @@ const Decimal = ({
 }) => {
   const l = useContext(LocaleContext);
   const emptyValue = allowEmptyValue ? "" : "0.00";
-
-  const getSafeValueProp = initialValue => {
+  const getSafeValueProp = useCallback(initialValue => {
     // We're intentionally preventing the use of number values to help prevent any unintentional rounding issues
     invariant(typeof initialValue === "string", "Decimal `value` prop must be a string");
 
@@ -39,8 +38,7 @@ const Decimal = ({
     }
 
     return initialValue;
-  };
-
+  }, [allowEmptyValue]);
   const getSeparator = useCallback(separatorType => {
     const numberWithGroupAndDecimalSeparator = 10000.1;
     return Intl.NumberFormat(locale || l.locale()).formatToParts(numberWithGroupAndDecimalSeparator).find(part => part.type === separatorType).value;
@@ -169,18 +167,22 @@ const Decimal = ({
     invariant(prevControlledRef.current !== isControlled, message);
     prevControlledRef.current = isControlled;
   }, [isControlled]);
+  const prevValue = usePrevious(value);
   useEffect(() => {
-    const unformattedValue = toStandardDecimal(stateValue);
+    const standardDecimalValue = toStandardDecimal(stateValue);
 
     if (isControlled) {
       const valueProp = getSafeValueProp(value);
 
-      if (unformattedValue !== valueProp) {
-        setStateValue(formatValue(value));
+      if (standardDecimalValue !== valueProp) {
+        if (valueProp === "" && prevValue === "") {
+          setStateValue(formatValue(emptyValue));
+        } else {
+          setStateValue(formatValue(valueProp));
+        }
       }
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  }, [value]);
+    }
+  }, [emptyValue, formatValue, getSafeValueProp, isControlled, prevValue, stateValue, toStandardDecimal, value]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Textbox, _extends({
     onKeyPress: onKeyPress,
     align: align,

package/lib/components/decimal/decimal.component.js

@@ -50,8 +50,7 @@ const Decimal = ({
 }) => {
   const l = (0, _react.useContext)(_i18nContext.default);
   const emptyValue = allowEmptyValue ? "" : "0.00";
-
-  const getSafeValueProp = initialValue => {
+  const getSafeValueProp = (0, _react.useCallback)(initialValue => {
     // We're intentionally preventing the use of number values to help prevent any unintentional rounding issues
     (0, _invariant.default)(typeof initialValue === "string", "Decimal `value` prop must be a string");
 
@@ -60,8 +59,7 @@ const Decimal = ({
     }
 
     return initialValue;
-  };
-
+  }, [allowEmptyValue]);
   const getSeparator = (0, _react.useCallback)(separatorType => {
     const numberWithGroupAndDecimalSeparator = 10000.1;
     return Intl.NumberFormat(locale || l.locale()).formatToParts(numberWithGroupAndDecimalSeparator).find(part => part.type === separatorType).value;
@@ -190,18 +188,22 @@ const Decimal = ({
     (0, _invariant.default)(prevControlledRef.current !== isControlled, message);
     prevControlledRef.current = isControlled;
   }, [isControlled]);
+  const prevValue = (0, _usePrevious.default)(value);
   (0, _react.useEffect)(() => {
-    const unformattedValue = toStandardDecimal(stateValue);
+    const standardDecimalValue = toStandardDecimal(stateValue);
 
     if (isControlled) {
       const valueProp = getSafeValueProp(value);
 
-      if (unformattedValue !== valueProp) {
-        setStateValue(formatValue(value));
+      if (standardDecimalValue !== valueProp) {
+        if (valueProp === "" && prevValue === "") {
+          setStateValue(formatValue(emptyValue));
+        } else {
+          setStateValue(formatValue(valueProp));
+        }
       }
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  }, [value]);
+    }
+  }, [emptyValue, formatValue, getSafeValueProp, isControlled, prevValue, stateValue, toStandardDecimal, value]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_textbox.default, _extends({
     onKeyPress: onKeyPress,
     align: align,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "106.6.7",
+  "version": "106.6.8",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {