onClick and onBlur issue in React

I have a text field followed by a button.

The text field has an onBlur function and a onClick function is accociated with the button.

Issue: If I enter some text and click on the button, onBlur event triggers but the onClick event never gets triggered.

How can I solve this issue?

I'm happy to share the code if required.

Edit: (Adding the code)

// This simple onClick is associated with the button.

onClick={(e) => {
    console.log("ONclicked!");
}}>

// blurHandler associated with the input field

blurHandler = event => {
    if (undefined !== event) event.stopPropagation();
    
    // modifying some states using setState
    
    };

Imp: the onClick button is not not firing on first click, second click behaves as expected (simple debug message doesn't appear until second click)