From 26b786dd3feb474aca3434e51000047d9ffaf423 Mon Sep 17 00:00:00 2001
From: Adam <2363879+adamdotdevin@users.noreply.github.com>
Date: Thu, 5 Feb 2026 07:26:21 -0600
Subject: [PATCH] fix(ui): toast overflow

---
 packages/ui/src/components/toast.css | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/ui/src/components/toast.css b/packages/ui/src/components/toast.css
index 1459bb189..ed7ba4a20 100644
--- a/packages/ui/src/components/toast.css
+++ b/packages/ui/src/components/toast.css
@@ -6,7 +6,7 @@
   display: flex;
   flex-direction: column;
   gap: 8px;
-  max-width: 400px;
+  max-width: min(400px, calc(100vw - 64px));
   width: 100%;
   pointer-events: none;
 
@@ -21,6 +21,7 @@
 }
 
 [data-component="toast"] {
+  position: relative;
   display: flex;
   align-items: flex-start;
   gap: 20px;
@@ -91,10 +92,14 @@
     flex-direction: column;
     gap: 2px;
     min-width: 0;
+    overflow: hidden;
   }
 
   [data-slot="toast-title"] {
     color: var(--text-invert-strong);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 
     /* text-14-medium */
     font-family: var(--font-family-sans);
@@ -110,6 +115,8 @@
   [data-slot="toast-description"] {
     color: var(--text-invert-base);
     text-wrap-style: pretty;
+    overflow-wrap: anywhere;
+    word-break: break-word;
 
     /* text-14-regular */
     font-family: var(--font-family-sans);
@@ -124,6 +131,7 @@
 
   [data-slot="toast-actions"] {
     display: flex;
+    flex-wrap: wrap;
     gap: 16px;
     margin-top: 8px;
   }
@@ -133,6 +141,11 @@
     border: none;
     padding: 0;
     cursor: pointer;
+    min-width: 0;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 
     color: var(--text-invert-weak);
     font-family: var(--font-family-sans);