From e22fd5c1162f494fe3878fd945ee8585f2e5c9e3 Mon Sep 17 00:00:00 2001 From: Arthurk12 Date: Tue, 6 Oct 2026 20:25:36 -0300 Subject: [PATCH] fix(BBBSpinner): clip the rotating svg to its box The spinner rotates its whole svg, and the corners of that square sweep past the wrapper as it turns: a 16px spinner reaches about 22.6px across its diagonal. Browsers count the transformed box as scrollable overflow, so a spinner at the edge of a scroll container makes that container show a scrollbar, as in the last row of a BBBToast, whose body scrolls past `maxHeight`. Clip the wrapper to its box. The drawn circle (radius 20 in a 50x50 viewBox, plus half the stroke) stays inside the box at any angle, so only the empty corners of the svg are clipped; a stroke wider than 10 would start to be cut. --- src/components/Spinner/styles.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Spinner/styles.ts b/src/components/Spinner/styles.ts index 90b86aa..9a03022 100644 --- a/src/components/Spinner/styles.ts +++ b/src/components/Spinner/styles.ts @@ -18,6 +18,7 @@ export const Wrapper = styled.div` height: ${({ $size }) => typeof $size === 'number' ? `${$size}px` : $size}; display: inline-grid; place-items: center; + overflow: hidden; `; export const StyledSvg = styled.svg`