First item is selected when adding items to Select menu without defaultValue

[IanVS]

Current behavior

I am building an async Select control, and I want it to be able to not have a default value. However, I find that when the options load from my server call, the first one is chosen as the value.

Steps to reproduce the bug

1. Open sandbox: https://stackblitz.com/edit/fhxrgu?file=select%2Findex.tsx
2. Notice that the placeholder is only shown for one second, then a value is chosen, even though it's not specified as a defaultValue

Expected behavior

The value should not change when children are added to the SelectPopover.

Workaround

The defaultValue can be set to an empty string. But, since that's not one of the option values, it feels incorrect. I'd try setting it to null, but that does not typecheck.

Possible solutions

No response

[diegohaz]

If a default value is not specified, it defaults to the first value, just like a native <select>.

I'd try setting it to null, but that does not typecheck.

We can probably add support for null. I don't know if it may be affected by other things besides TS. Marked this as a feature request anyway.

[IanVS]

Thanks. I'm not a huge fan of the native behavior of needing an option with value "" that is disabled and has a label "--Please choose an option--", since it shows up in the dropdown list. So it would be great if the value could be null from that standpoint.

[cusxio]

@diegohaz just some feedback as a new user trying out ariakit, I'm confused with the difference between defaultActiveId and defaultValue.

For me personally, I didn't want the first item to be selected when the Select opens. So I tried defaultActiveId: null, but that seems to do something different, so here I am, landing on this issue. 😄

Using defaultValue: "" is precisely the behaviour I wanted!

[spencerfinnell]

I got tripped up by this too. I didn't catch what was going on until I saw this being defined explicitly in this example: https://github.com/ariakit/ariakit/blob/main/examples/form-select/index.tsx#L27

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.