Extra Space in Dropdown Menu of React Select Component on Initial Render

The React Select component is not rendering correctly on the first load. The dropdown menu has extra space at the bottom. This issue only occurs on the initial render

After the initial render it works as expected:

CODE:

<Select
 isMulti
 options={roomValues}
 components={animatedComponents}
 value={productRooms}
 onChange={onChangeRoomSelect}
 getOptionLabel={(option) => option.roomNameObj[activeLanguage.id]}
 className="z-[99] h-max"
/>

Expected Behavior:
The dropdown menu should fit the number of items without any extra space.

Actual Behavior:
On the first render, the dropdown menu has extra space at the bottom. On subsequent renders, the dropdown menu fits the number of items correctly.

Start with the supplied React Select reproduction and inspect the Select component's initial render and dropdown sizing behavior. Compare the first render with subsequent renders using the provided code and screenshots. Done means the menu fits the number of items on the initial render as well as later renders.