@agentiffai/design 1.3.22 → 1.3.23

package/dist/copilotkit/index.js

@@ -3148,13 +3148,13 @@ var GlobalSidebarStyles2 = createGlobalStyle`
       width: calc(100% - 60px) !important;
     }
 
-    /* Shrink the sidebar container to only cover the right portion where dialog lives */
-    /* Also stretch to full height (remove default 8px padding) */
+    /* Sidebar container covers right portion — full height, no gaps */
     .copilotKitSidebar {
       top: 0 !important;
       bottom: 0 !important;
-      left: 58vw !important;
-      width: min(50vw, 22rem) !important;
+      right: 0 !important;
+      left: 50vw !important;
+      width: auto !important;
       height: 100vh !important;
     }
 
@@ -3164,31 +3164,34 @@ var GlobalSidebarStyles2 = createGlobalStyle`
     }
 
     .copilotKitSidebar [role="dialog"] {
-      width: min(50vw, 20rem) !important;
-      max-width: min(50vw, 20rem) !important;
+      width: min(50vw, 22rem) !important;
+      max-width: min(50vw, 22rem) !important;
       left: auto !important;
-      right: 1.5rem !important;
-      /* Use top/bottom ONLY - let browser calculate height (more reliable than explicit height) */
+      /* Flush with right edge — safe area handled via internal padding */
+      right: 0 !important;
+      /* Fill ALL vertical space — overlay the bottom nav for maximum chat area */
+      /* Keep top safe area so dialog doesn't go behind status bar (battery/wifi) */
       top: var(--safe-area-top, 0px) !important;
-      bottom: calc(52px + var(--safe-area-bottom, 0px)) !important;
-      /* Remove explicit height - let top/bottom define it */
+      bottom: 0 !important;
+      /* Let top/bottom define height */
       height: auto !important;
       max-height: none !important;
-      /* Remove margins */
       margin: 0 !important;
+      /* Only round the left edges since right is flush with viewport */
       border-radius: 0 !important;
       border-top-left-radius: ${tokens.borderRadius.xl} !important;
       border-bottom-left-radius: ${tokens.borderRadius.xl} !important;
     }
 
     /* Compact header in landscape - hide title text but keep close button */
+    /* Safe area top padding applied here so content avoids status bar */
     .copilotKitSidebar [role="dialog"] header,
     .copilotKitSidebar [role="dialog"] [data-testid="chat-header"],
     .copilotKitSidebar [role="dialog"] > div:first-child {
-      padding: 0.25rem 0.5rem !important;
+      padding: 0.25rem 0.5rem 0.25rem !important;
       min-height: auto !important;
-      height: 1.5rem;
-      padding-right: 1.5rem !important;
+      height: auto !important;
+      padding-right: calc(1.5rem + var(--safe-area-right, 0px)) !important;
     }
 
     /* Hide the title text but keep close button visible */
@@ -3201,9 +3204,9 @@ var GlobalSidebarStyles2 = createGlobalStyle`
       display: none !important;
     }
 
-    /* Reduce vertical padding inside chat to preserve space in landscape */
+    /* Reduce vertical padding inside chat — right safe area for notch */
     .copilotKitMessages {
-      padding: ${tokens.spacing.xs} ${tokens.spacing.sm} !important;
+      padding: ${tokens.spacing.xs} calc(${tokens.spacing.sm} + var(--safe-area-right, 0px)) ${tokens.spacing.xs} ${tokens.spacing.sm} !important;
     }
 
     .copilotKitMessage {
@@ -3211,17 +3214,15 @@ var GlobalSidebarStyles2 = createGlobalStyle`
       margin: ${tokens.spacing.xs} 0 !important;
     }
 
-    /* Compact input area in landscape */
-    .copilotKitInput,
-    .copilotKitSidebar [role="dialog"] > div:last-child {
-      padding: ${tokens.spacing.xs} ${tokens.spacing.sm} !important;
-    }
-
     /* Reduce gap between messages */
     .copilotKitMessages > div {
       gap: 0.25rem !important;
       padding-bottom: 0;
-      margin-bottom: -3rem;
+    }
+
+    /* Compact input area — safe area padding for bottom gesture bar and right notch */
+    .copilotKitInput {
+      padding: ${tokens.spacing.xs} calc(${tokens.spacing.sm} + var(--safe-area-right, 0px)) calc(${tokens.spacing.xs} + var(--safe-area-bottom, 0px)) ${tokens.spacing.sm} !important;
     }
 
     /* Compact suggested prompts in landscape */
@@ -3232,9 +3233,9 @@ var GlobalSidebarStyles2 = createGlobalStyle`
       max-height: 32px !important;
     }
 
-    /* Compact parent of suggestions (input area) */
+    /* Suggestions container — safe area padding for bottom and right */
     .copilotKitSidebar [role="dialog"] > div:last-child {
-      padding: 1px !important;
+      padding: 1px calc(1px + var(--safe-area-right, 0px)) calc(1px + var(--safe-area-bottom, 0px)) 1px !important;
     }
   }