diff --git a/packages/ui/src/components/chat/FileMentionAutocomplete.tsx b/packages/ui/src/components/chat/FileMentionAutocomplete.tsx index fa5fa84a..be47a5da 100644 --- a/packages/ui/src/components/chat/FileMentionAutocomplete.tsx +++ b/packages/ui/src/components/chat/FileMentionAutocomplete.tsx @@ -368,7 +368,7 @@ export const FileMentionAutocomplete = React.forwardRef {showTabs ? ( @@ -446,7 +446,7 @@ export const FileMentionAutocomplete = React.forwardRef { const rowIndex = visibleAgents.length + index; const relativePath = file.relativePath || file.name; - const displayPath = truncatePathMiddle(relativePath, { maxLength: 45 }); + const displayPath = truncatePathMiddle(relativePath, { maxLength: 60 }); const isSelected = selectedIndex === rowIndex; const isOverflowing = overflowMap[rowIndex] ?? false; const marqueeDuration = marqueeDurations[rowIndex] ?? 2.6; diff --git a/packages/ui/src/index.css b/packages/ui/src/index.css index 93b5eb2d..9150fbba 100644 --- a/packages/ui/src/index.css +++ b/packages/ui/src/index.css @@ -300,6 +300,8 @@ textarea[data-chat-input="true"]:focus-visible { .file-mention-marquee-container { --file-mention-marquee-width: 360px; --file-mention-marquee-duration: 4s; + mask-image: linear-gradient(to right, black calc(100% - 24px), transparent 100%); + -webkit-mask-image: linear-gradient(to right, black calc(100% - 24px), transparent 100%); } .file-mention-marquee {