From f0ee33c20f0513978813bab7afecb25d367c4932 Mon Sep 17 00:00:00 2001 From: Tariq Date: Thu, 19 Feb 2026 09:46:27 +0530 Subject: [PATCH] Fix: Wrap commit() in flushSync on Enter in useNumberField When Enter is pressed in NumberField, commit() was called without flushSync, unlike the blur handler which wraps commit() in flushSync. This caused controlled form libraries reading React state immediately after Enter to receive stale values instead of the committed value. The browser synthesizes a trusted click on the form's submit button when Enter is pressed, firing onSubmit before the unguarded commit() has flushed to React state. This change wraps commit() in flushSync on Enter, making it consistent with the blur behavior and ensuring the value is flushed synchronously before any consumer reads form state. Fixes #9671 --- packages/@react-aria/numberfield/src/useNumberField.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/@react-aria/numberfield/src/useNumberField.ts b/packages/@react-aria/numberfield/src/useNumberField.ts index 4d5f607ea31..06e5d42e526 100644 --- a/packages/@react-aria/numberfield/src/useNumberField.ts +++ b/packages/@react-aria/numberfield/src/useNumberField.ts @@ -219,7 +219,9 @@ export function useNumberField(props: AriaNumberFieldProps, state: NumberFieldSt } if (e.key === 'Enter') { - commit(); + flushSync(() => { + commit(); + }); commitValidation(); } else { e.continuePropagation();