[bug]: The Dots pagination component creates a double scrollbar

[GuillaumeDARRIET]

What version of design-system are you using?

• Strapi design version : 2.2.0
• Chromium browsers

What's Wrong?

When the number of items in a collection is large, and the list page needs to scroll, there is a double scroll bar on Chromium browsers.
This is due to the fact that the Dots component consists of a Box without "position=relative"
The VisuallyHidden component is then positioned at the bottom of the page, which forces the Body to create a scroll bar.

To Reproduce

You need to have a large number of items in the list and ensure that the page scrolls.

Expected Behaviour

• only one scrollbar and not the one from the body
  Here is a proposed fix

const Dots = ({ children, position, ...props }: DotsProps) => (
  <Box position={position || 'relative'} {...props}>
    <VisuallyHidden>{children}</VisuallyHidden>
    <Typography aria-hidden lineHeight="revert" textColor="neutral800" variant="pi">
      …
    </Typography>
  </Box>
);

[GuillaumeDARRIET]