Skip to content

Conversation

@Ericlm
Copy link
Contributor

@Ericlm Ericlm commented Oct 19, 2025

This PR should fix the issue #1872, where a select with both multiple and required props is locked in a form when more than 1 option is selected.

I created a story for this specific issue, and it should support both controlled and uncontrolled values.

  • default value works as expected
  • native select is kept for a11y, but uses a v-model so that Vue itself handles the change between string/string array
  • 'change' event bubbling to the form
  • on submit, the selected options can be get with formData.getAll('name')

Things I'm not sure about :

  • options is stored as a Map instead of a Set (I'm not sure that storing objects in a Set ensures that there are unique?)
  • Call to rootContext.onValueChange() removed (side-effects?)

Things I need help with:
The <SelectValue> text flickers when opening or closing the select, because the Map temporarily loses all its keys before they’re re-added. Its size goes down to 0 when the content is closing (since ItemText emits an event on unmount), and then all the options are added again.
The issue is that during the frame between removal and addition, the placeholder briefly appears. However, this might be a separate issue, since it can also be observed in the Select component on the Reka UI docs (although it’s very short — blink and you’ll miss it!).

Fix #1872

@pkg-pr-new
Copy link

pkg-pr-new bot commented Oct 19, 2025

Open in StackBlitz

npm i https://pkg.pr.new/reka-ui@2231

commit: 1b571ef

@Ericlm
Copy link
Contributor Author

Ericlm commented Oct 19, 2025

This PR is working as expected, but I would like to know if I can remove the flickering, or if I missed unexpected behaviors.

@Ericlm Ericlm marked this pull request as ready for review October 19, 2025 09:50
@Ericlm
Copy link
Contributor Author

Ericlm commented Oct 19, 2025

(I left some console.log for help, I'll remove them if needed) 👀

@Ericlm
Copy link
Contributor Author

Ericlm commented Oct 29, 2025

Ready for review @zernonia!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: Select with multiple and required won't work with more than one item

1 participant