Code in Markdown doesn't wrap

[dentroai]

Describe the bug The markdown component wraps nicely when only text is displayed, but the moment some part is rendered as code and longer than the width it doesn't wrap and the screen is suddenly vertically scrollable.

To Reproduce Steps to reproduce the behavior:

• Code/Link to Repo:

E.g.

message_style = dict(
    display="inline-block",
    padding_x="1em",
    border_radius="8px",
    max_width=max_width,
)


def message_block(query: str):
    return rx.box(
        rx.markdown(
            query,
            background_color=rx.color("gray", 3),
            color=rx.color("gray", 12),
            text_align="left",
            **message_style,
        ),
        text_align="right",
        padding="1em",
        padding_top="2em",
        width="100%",
        height="100%",
    )

Expected behavior Code blocks inside markdown components are also wrapped

Screenshots If applicable, add screenshots to help explain your problem.

Specifics (please complete the following information):

• Python Version: 3.12
• Reflex Version: 0.5.8 (also happened on older versions)
• OS: linux
• Browser (Optional): firefox, chrome

Additional context long live the team