TooltipDefinition cut off at the border of the window

<TooltipDefinition> that appear close to the windows border (or the border of an parent component) are cut off

Detailed description

<TooltipDefinition>s do not work well on the edges of the window. E.g. when the trigger text/component is right aligned and its width is smaller than 208px the tooltip is cut off. I have also seen cases in which the tooltip is cut-off by the bounds of a parent component, but need to reproduce this in sandbox.

Related to <TooltipDefinition> component

<TooltipDefinition> always seem to be left aligned with the left side of the tirgger component with a constant width, which makes them cut off by the window boundary. One solution would be to right align them with the tigger component. I have an intermediate solution using the right and left style attibutes as shown in the last button of https://codesandbox.io/s/6l2qvkr3rw. Please take a look.

Not sure what exactly the solution would be for the top, maybe move the tooltip automatically to the bottom.

Chrome & firefox

carbon-components@7.2.0

IBM Cloud SQL Query - we would like to release a Carbon 10 version in the days to come. So this is crutial to us

Steps to reproduce the issue

1. Place the trigger of a <TooltipDefinition> (width < 208px) to the right side of a window or at the top and you will see it

Please create a reduced test case in CodeSandbox https://codesandbox.io/s/6l2qvkr3rw

Additional information

cut-off at component bound (not covered by codesandbox yet):

[gmoehler]

@shixiedesign ok perfect - #2663 is exactly what i was looking for. Thanks for pointing out! When can i expect a new carbon-components-react version to be released (last one was from May1)?

[elizabethsjudd]

Ah yes! My bad. Thanks.