Toast's "Show all" button text is truncated on some locales

[alp87488]

Provide a general summary of the issue here

Button labels are being cut off in specific languages, making them unreadable

🤔 Expected Behavior?

Text should be readable across all locales

😯 Current Behavior

Text is getting truncated for the following locales:
de-DE, ja-JP, nl-NL, bg-BG, hu-HU, pl-PL, ru-RU, sk-SK, tr-TR, uk-UA, el-GR

💁 Possible Solution

One of the following options might be considered as a solution:

• Reduce the column gap
• Use shorter translations
• Add a tooltip

🔦 Context

Cut-off text makes it unreadable for international users and ruins the UX.

🖥️ Steps to Reproduce

1. Open s2 storybook
2. Select Toast component
3. Select German locale
4. Click "Show Long Word Toast" button twice

Version

Latest

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

Windows

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[yihuiliao]

Hm, definitely not ideal. Maybe a good question to bring up to our design team since Spectrum defines a max width for toasts so making it wider is not an option and adding a tooltip would mean that it wouldn't be accessible on mobile. Thanks for bringing it up!

[snowystinger]

Even if we reduce the translation or add the gap, depending on the label used for the action button, this case could still easily be hit.