== Background goal
The way in which text truncation is handled by Codex buttons doesn't make them fully ready for all scenarios. Particularly those involving especially long translations in narrow screens. In said cases, Codex buttons (as their OOUI ancestors) will overflow their layout.
{F37088538}
As decided in {T359636}, Button and Select will be a maximum of one text line and use ellipsis truncation in case the text exceeds. The Button's entire text will appear as a `Tooltip` when hovering the Button.
=== Considerations
* This issue originally came from a OOUI task (T165870#8879237): It is not only a matter of removing the property `white-space: nowrap;` as it appears that, in order to bypass the no-wrap behavior of the OOUI button, we'd have to write separate style modules each time. (see T165870 and T165870#8891653 for further context). Is there any way to fix this also in OOUI in a centralized way?
* In case we provide a wrapping property, then we should make sure to document the cases in which this prop would be useful, and to indicate that the primary recommendation is to keep buttons' text clear, concise and action-oriented. We could make the ellipsis a configurable property so that users who need to show the entire button are able to do so.
=== Acceptance criteria (or Done)
[x] Define the best approach for content overflow in Codex T359636
**Design**
[] Update the Button component using ellipsis truncation in the [[ https://www.figma.com/file/KoDuJMadWBXtsOtzGS4134/❖-Codex-components?type=design&node-id=1891-4420&mode=design&t=tTs85kcHWfxKUTqU-11 | Codex Figma library ]]
[] Include maximum limitations in the Button Guidelines
**Code**
[] Update the Button component in Codex using ellipsis truncation