@thecb/components 10.7.6-beta.0 → 10.7.6

package/dist/index.cjs.js

@@ -27106,6 +27106,10 @@ var FormInput = function FormInput(_ref15) {
     _useState2 = _slicedToArray(_useState, 2),
     showPassword = _useState2[0],
     setShowPassword = _useState2[1];
+  var _useState3 = React.useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isFocused = _useState4[0],
+    setIsFocused = _useState4[1];
   var _useContext = React.useContext(styled.ThemeContext),
     isMobile = _useContext.isMobile;
   var setValue = function setValue(value) {
@@ -27119,6 +27123,7 @@ var FormInput = function FormInput(_ref15) {
     if (isRequired && value === "") {
       setValue("");
     }
+    setIsFocused(false);
   };
   return /*#__PURE__*/React__default.createElement(Stack, {
     childGap: "0.25rem"
@@ -27189,6 +27194,15 @@ var FormInput = function FormInput(_ref15) {
     "data-qa": dataQa || labelTextWhenNoError,
     autoComplete: autocompleteValue,
     required: isRequired
+    // Additional handler to detect autofilled values
+  }, autocompleteValue && {
+    onFocus: function onFocus(e) {
+      if (!isFocused) {
+        var _e$target;
+        setValue((_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value);
+        setIsFocused(true);
+      }
+    }
   }, props)) : /*#__PURE__*/React__default.createElement(InputField, _extends({
     "aria-labelledby": createIdFromString(labelTextWhenNoError),
     "aria-describedby": createIdFromString(labelTextWhenNoError, "error message"),
@@ -48654,6 +48668,7 @@ var PaymentFormCard = function PaymentFormCard(_ref) {
     },
     isNum: true,
     autocompleteValue: "cc-number",
+    name: "cc-number",
     isRequired: true
   }), /*#__PURE__*/React__default.createElement(FormInputRow, {
     breakpoint: isMobile ? "1000rem" : "21rem",