Fix correctly handle IME Input in Combobox

[ryo-manba]

related to https://github.com/nextui-org/nextui/issues/2121

This PR addresses a bug in the combobox component where inputs from an IME were being incorrectly committed before the user completed their text entry.

✅ Pull Request Checklist:

• [ ] Included link to corresponding React Spectrum GitHub Issue.
• [ ] Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• [x] Filled out test instructions.
• [ ] Updated documentation (if it already exists for this component).
• [ ] Looked at the Accessibility Practices for this feature - Aria Practices

before

https://github.com/adobe/react-spectrum/assets/76232929/e92e8dcb-490c-4b14-bcb0-d5cb66c545e9

after

https://github.com/adobe/react-spectrum/assets/76232929/39722d5b-0f72-4e0e-82b2-07ce68bd4e0f

📝 Test Instructions:

Setup for MacOS

Add the Japanese input method

• Settings > Keyboard > Input Sources > Add a language > Japanese

Test Steps

1. Choose Hiragana in the menu bar.
2. Navigate to http://localhost:9003/?path=/story/react-aria-components--combo-box-ime-example&providerSwitcher-express=false&strict=true
3. Type nihon followed by the enter key. This should result in "にほん" or "日本".
4. Continue typing go, and the combobox should suggest "にほんご". Press enter.
5. Previously, the initial input "にほん" would be cleared, leaving only "ご". After this fix, "にほんご" should be correctly inputted without clearing the previous characters.

🧢 Your Project:

https://github.com/nextui-org/nextui

[snowystinger]

GET_BUILD

[rspbot]

Build successful! 🎉

• View the storybook
• View the storybook-17
• View the storybook-16
• View the documentation

[rspbot]

## API Changes

unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any', access: 'private' } unknown top level export { type: 'any', access: 'private' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'identifier', name: 'Column' } unknown top level export { type: 'identifier', name: 'Column' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown type { type: 'link' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' } unknown top level export { type: 'any' }

[ryo-manba]

@snowystinger

I think we could introduce some behavior based on the composition events from useTextfield, onCompositiionStart and onCompositionEnd.

This is a good idea. I'll see if I can come up with another issue to address what state would be desirable for users! Thanks for the feedback!