fix(ui): prevent content click from toggling accordion and improve UX with cursor-text in Codeblock (#930)

Hovering over the code block previously showed a pointer cursor, and
clicking inside would collapse/expand the accordion. This PR updates the
DyadWrite component to use `cursor-text` and adds `e.stopPropagation()`
so clicks inside the code block no longer toggle the accordion, making
it behave like other AI tools and improving user friendliness.


Before


https://github.com/user-attachments/assets/7b6983fd-91a0-4f30-9337-d444cbfcc110

After


https://github.com/user-attachments/assets/07d0d765-7206-4552-b0b4-2665d87df4a1
This commit is contained in:
Adeniji Adekunle James
2025-08-13 23:34:11 +01:00
committed by GitHub
parent c4420a56e2
commit 76054c6db7

View File

@@ -94,7 +94,10 @@ export const DyadWrite: React.FC<DyadWriteProps> = ({
</div>
)}
{isContentVisible && (
<div className="text-xs">
<div
className="text-xs cursor-text"
onClick={(e) => e.stopPropagation()}
>
<CodeHighlight className="language-typescript">
{children}
</CodeHighlight>