Long words in assistant chat responses now wrap properly

[ryanjwilson9]

Description

Previously, very long unbroken words in assistant responses would overflow their container or get cut off, especially on smaller screens. This was due to markdown-rendered content (via StyledMarkdown) not propagating word-break and overflow-wrap to deeply nested elements

This change: Only added a global * { word-break: break-word; overflow-wrap: break-word; } rule inside StyledMarkdown -> gui/src/components/StyledMarkdownPreview/index.tsx An explicit white-space: pre-wrap rule for p, span, and div These changes ensure all markdown-rendered assistant responses wrap gracefully, even with unusually long tokens.

Checklist

• [x] I've read the contributing guide
• [x] The relevant docs, if any, have been updated or created
• [x] The relevant tests, if any, have been updated or created

Screenshots

## Tests

None

---

Summary by mrge

Long unbroken words in assistant chat responses now wrap correctly, preventing overflow and cut-off on all screen sizes.

• Bug Fixes
  • Added global word-break and overflow-wrap rules to StyledMarkdown.
  • Set white-space: pre-wrap for p, span, and div elements.

[netlify[bot]]

✅ Deploy Preview for continuedev canceled.

Name	Link
🔨 Latest commit	8b605dd3bb3fcd8598507af866b464156ee71a91
🔍 Latest deploy log	https://app.netlify.com/projects/continuedev/deploys/6827b71426d65400083751c7

[github-actions[bot]]

All contributors have signed the CLA ✍️ ✅
_{Posted by the CLA Assistant Lite bot.}

[ryanjwilson9]

I have read the CLA Document and I hereby sign the CLA

[RomneyDa]

@ryanjwilson9 just to confirm, this doesn't cause code to wrap?

[ryanjwilson9]

@ryanjwilson9 just to confirm, this doesn't cause code to wrap?

@RomneyDa currently it does wrap code. But I also wrote something up to not wrap code.

Not sure what you prefer. Initial fix (wrap everything): * { word-break: break-word; overflow-wrap: break-word; } p, span, div { white-space: pre-wrap; }

Wrap text, not code:

[RomneyDa]

The expected behavior should be

• use this fix for anything that's not a codeblock
• Apply this fix to codeblocks only when the codeWrap ui setting is turned on (see StyledMarkdownPreview)

[recurseml[bot]]

✨ No issues found! Your code is sparkling clean! ✨

[RomneyDa]

Closing since stale.

@ryanjwilson9 feel free to update/reopen, I've also opened a ticket to follow up. We need to make sure code doesn't wrap unless the setting is turned on.