I am currently facing an issue while implementing popovers on our application using Angular 6.0.1, Ngx-bootstrap 2.0.5, and Bootstrap 4.1.1. The problem arises when I use 'auto' positioning for the popovers, specifically on the right side of the screen. In this scenario, the popovers do not behave as expected. While the Left and Center elements work fine by placing the popover on top or to the right, the right side still sets it to 'top' and attempts to resize the popover area.
Due to the dynamic nature of a lot of our content, I cannot predict when this issue will occur and rectify it by manually setting it to 'left', for example.
It would be ideal if, in this case, the content could be positioned on the left side of the button. Any additional help or advice regarding this matter would be greatly appreciated.
I have been unable to set up a working stackBlitz demo to showcase this bug, but we are generating the popover with the following code:
<button popoverTitle="Info" popover="auto auto auto auto auto auto" placement="auto" container="body" triggers="hover tap"> Right </button>
The Left button functions correctly by positioning the content to the right: https://i.sstatic.net/Vs4MI.png
Similarly, the Center button also works as expected by positioning the content at the top: https://i.sstatic.net/pCkIH.png
However, the right button places the content at the top and attempts to resize it (the size of the content changes intermittently before stabilizing): https://i.sstatic.net/CjmpO.png