Skip to content

Conversation

@Mohamed-Abuali
Copy link

  • What kind of change does this PR introduce? (Bug fix, feature, docs update, ...)
    This PR introduces a bug fix to the messaging widget:

Fix message bubble width and text wrapping to prevent overflow.

Correct list spacing and alignment.

Add responsive table support to prevent layout issues.

Replace the single-line input with a textarea to support multi-line input, custom scrollbar styling, and Enter/Shift+Enter behavior for message submission.

  • Why was this change needed? (You can also link to an open issue here)

Bug fixes were needed to resolve display issues that caused messages, lists, and tables to render improperly or overflow the chat container.

The feature was needed to allow users to input multi-line prompts naturally while maintaining proper submission behavior.

Issue Link: #2159

  • Other information:

video showcase:

FormatFix2.mp4
NewLineFix.mp4

- Adjust max-width for message bubbles to 90% for answers and 80% for questions
- Add overflow-wrap to prevent text overflow in messages
- Update list styling with proper spacing and positioning
- Add responsive font sizing for headings using clamp()
- Implement custom table styling with proper borders and spacing
- Add custom markdown renderer rules for tables
Add support for multi-line input and custom scrollbar styling. Implement Enter key submission handling while allowing Shift+Enter for new lines.
@vercel
Copy link

vercel bot commented Nov 23, 2025

@Mohamed-Abuali is attempting to deploy a commit to the Arc53 Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions bot added the extensions Extensions label Nov 23, 2025
Copy link
Collaborator

@ManishMadan2882 ManishMadan2882 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are few issuess

  • Empty whitespace is sent as a prompts
  • In tables, horizontal scrollbars may only appear while hovering/scrolling, which makes the fact that the table is horizontally scrollable less obvious
  • Swapped td/th Tags (Lines 693-694)
md.renderer.rules.td_open = () => '<th class="dgpt-th">';  // ❌ Should be <td>
md.renderer.rules.th_open = () => '<td class="dgpt-td">';  // ❌ Should be <th>
  • Multi-line Input Not Properly Implemented: The input is not vertically centered in the textarea, user cannot see multiple lines of the text properly - one row is visible
Image

@Mohamed-Abuali
Copy link
Author

Got it, I’m already working on these items and will push them tomorrow.

@Mohamed-Abuali
Copy link
Author

Mohamed-Abuali commented Nov 27, 2025

@ManishMadan2882

Hello, I wanted to ask about the textarea input in the large window widget.
Do you prefer the placeholder and text to be vertically centered or aligned to the top/start of the input? Both look fine on my side, but I want to match the intended design.

Another option could be to reduce the height of both the textarea and the send button to match a single-line input size. Right now it’s closer to a two-line height, so I can adjust that if needed.

The small widget is perfectly centered and reseizes for each new line.

Screenshot 2025-11-26 193006

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

extensions Extensions

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants