Right aligned dropdowns have wrong width on Bootstrap 4.1

[cauethenorio]

Since version 4.1, bootstrap added some CSS rules which relies on x-position attribute added by popper.js to properly size the dropdown menu node:

twbs/bootstrap#25400
https://github.com/twbs/bootstrap/pull/25400/files#diff-17c7180c6905243675dbb731bacf389aR90

But since version 0.8.1, react-popper doesn't set the x-position attribute on the menu node:

floating-ui/react-popper@4338327

So when using right-aligned dropdown menus with reactstrap the menu node is set with left:0 and right:0 resulting in a wrong width, since there's no x-position to add the right: auto rule.

The error can be reproduced on the right aligned dropdown reactstrap doc page if you add a dropdown item with a longer content:

Not sure how it can be fixed. Maybe updating reactstrap to add the x-position manually?

[TheSharpieOne]

We'll have to fix this in reactstrap as the next version of react-popper (currently in beta) changes drastically and we would have to apply that attribute in that version anyways so pushing this issue upstream doesn't get us very far.