`useTextField` should block change events during composition

[qmhc]

Provide a general summary of the feature here

I think useTextField should block change events during composition by default.

This behavior doesn’t affect input in non-compositional languages like English. Moreover, in communities that use compositional input methods (such as Chinese), it’s already a widely accepted convention that change events shouldn’t fire during composition — all major component libraries handle this case. That’s why I believe adding this behavior would further improve the usability of useTextField.

🤔 Expected Behavior?

Blocks change events during composition.

😯 Current Behavior

Will dispatch change events during composition.

💁 Possible Solution

We can use a ref to track the composition state and block change events during composition.

🔦 Context

As I mentioned above, when working with languages like Chinese and Japanese, unintended change events are triggered during composition. To filter them out, I have to add composition-related handling every time.

However, if this becomes the default behavior, the user experience in such scenarios would improve significantly.

💻 Examples

https://stackblitz.com/edit/vitejs-vite-jffqgkfu?file=src%2FInput2.tsx

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[snowystinger]

Thanks for the issue, can you provide an example and steps to reproduce? Not all of us regularly work with composition, so in order to make certain we have fixed your issue, it'd be helpful to have instructions.

I know a few composition related bugs have been fixed in the past, it may be worthwhile to look through those old issues/prs to assist in a reproduction.

Thanks for understanding.

[qmhc]

Here an example shows difference between non-block & block change events during composition:

https://stackblitz.com/edit/vitejs-vite-jffqgkfu?file=src%2FInput2.tsx

You need to use an input method that supports composition. Then, try entering composed text in both inputs.

You’ll notice that the first input’s value changes in real time during composition, which can lead to unintended behaviors (such as prematurely triggering form validation). In contrast, the second input only updates its value after composition is complete.

For non-compositional input, both behave the same.