From 530c978bf8731e896f3fc24e493eaa377fbc8a95 Mon Sep 17 00:00:00 2001 From: Oliver Kieselbach Date: Fri, 24 Jul 2026 15:11:54 +0200 Subject: [PATCH] fix(web): TruncatedLabel expands to full text, not just two lines MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The expanded state used line-clamp-2, which re-truncated long values with an ellipsis after two lines — unreadable on touch where the hover tooltip is unavailable. Expand now wraps the entire string over as many lines as needed. Co-Authored-By: Claude Opus 4.8 (1M context) --- .../autopilot-monitor-web/components/TruncatedLabel.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/Web/autopilot-monitor-web/components/TruncatedLabel.tsx b/src/Web/autopilot-monitor-web/components/TruncatedLabel.tsx index 4f295d84..73965680 100644 --- a/src/Web/autopilot-monitor-web/components/TruncatedLabel.tsx +++ b/src/Web/autopilot-monitor-web/components/TruncatedLabel.tsx @@ -21,8 +21,9 @@ interface TruncatedLabelProps { * - Hovering always shows the full text in a native browser tooltip (standard * tooltip, no special cursor). * - When `interactive` (the default), clicking — or pressing Enter/Space when - * focused — toggles a two-line expanded view. This keeps long values readable - * on touch devices where hover is unavailable. + * focused — toggles a fully expanded view that wraps the entire text over as + * many lines as needed. This keeps long values readable on touch devices + * where hover is unavailable. * - When `interactive={false}`, it is a plain truncated span with only the * tooltip, safe to nest inside a clickable row or link. */ @@ -57,7 +58,7 @@ export default function TruncatedLabel({ } }} className={`${className} min-w-0 cursor-pointer ${ - expanded ? "line-clamp-2 break-words" : "truncate" + expanded ? "whitespace-normal break-words" : "truncate" }`} > {text}