The placement of the component preview is sometimes inconsistent

So the problem is "easy" to see when you remove the scaling:

Here is a component where the placement is right:

And here is a component where the placement is incorrect:

The problem is that Radix Tooltip doesn't take the scaling into consideration, so, since the component in incorrect example would collide with the viewport, radix adjust the position.

Setting the prop avoidCollisions={false} possibly fixes the problem, but might introduce another one, in case there is an actual preview that does collide (goes outside the viewport), it will not be adjusted. So I don't think that's the right solution here.

Adding a wrapper as in the MR, is a possible fix:

wim leers → credited kristen pol → .

@kristen pol filed a duplicate bug report at 🐛 XB component thumbnail placement is inconsistent Active .

Noticed this when working on sections too.