You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
BBBModal title overflows the header and pushes the close button out of the modal #83
A title containing one long word with no spaces is cut off at the modal's edge, and the close button is pushed out of the modal with it. The button goes first: it is already gone while the title still looks fine. Since shouldCloseOnEsc and shouldCloseOnOverlayClick both default to false, a consumer passing noFooter is left with a modal it cannot close.
The title is a BBBTypography paragraph sharing a flex row with the close button in ModalHeader (src/components/Modal/styles.ts). Nothing sets a word-breaking rule on it, so as a flex item it never shrinks below its longest word, and the modal clips whatever sticks out.
To Reproduce
Steps to reproduce the behavior:
Storybook → BBBModal → Default.
Set the title control to Averyveryveryveryveryveryveryveryveryverylongwordwithoutspaces.
Narrow the window until the modal hits its 90vw cap.
Expected behavior
The title wraps, and the close button stays inside the modal at any width.
Actual behavior
The word stays on one line and is clipped at the modal edge; the close button is clipped with it.
Activity
fix(BBBModal): wrap long titles instead of pushing the close button out