The dropdownDirection prop only sets the dropdown menu to be "flipped" (i.e. opening upwards) if the prop is updated after the initial mount.
This is because the css style that changes the direction of the dropdown only gets applied in the componentDidUpdate handler (where the bottom value is set directly on the element) of the DropdownMenu component, see here.
To fix this, the bottom: XXpx value should be set in the base css theme so it's not dependent on the component to manually set the style.
If there's something I'm missing please let me know, I've had to manually set the css so it opens upward correctly.