authorgravatar for 73941998+UtkarshUsername@users.noreply.github.comUtkarsh Patil <73941998+UtkarshUsername@users.noreply.github.com> 2026-10-06 02:02:03+05:30
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-10-05 13:32:03-07:00
log5b613de175dd2567ae806907440ef83f6cd7c2a4
tree26c25cd6c6e62aeab2e7e115f49fc59250526278
parent039ddf1143d7dba0e25d0b1b7c8ed0cd3e19f588
signature Signed by PGP key B5690EEEBB952194

fix(web): wrap full status text in composer hover details (#16158)


2 files changed, 3 insertions(+), 3 deletions(-)

apps/web/src/components/chat/ComposerBannerStack.tsx+1-1
...@@ -306,7 +306,7 @@ function NoticeDescription({ children, compact }: { children: ReactNode; compact...@@ -306,7 +306,7 @@ function NoticeDescription({ children, compact }: { children: ReactNode; compact
306 aria-label="Notice details"306 aria-label="Notice details"
307 tooltipStyle307 tooltipStyle
308 side="top"308 side="top"
309 className="max-w-80 whitespace-normal wrap-anywhere"309 className="max-w-[min(30rem,calc(100vw-2rem))] whitespace-normal wrap-anywhere [--inline-button-text-align:start] [--inline-button-white-space:normal] [&_[data-slot=inline-button]]:max-w-full"
310 >310 >
311 <ComposerBanner.Scroll className="max-h-[min(var(--available-height),24rem,40dvh)]">311 <ComposerBanner.Scroll className="max-h-[min(var(--available-height),24rem,40dvh)]">
312 {children}312 {children}
apps/web/src/components/ui/button.tsx+2-2
...@@ -101,7 +101,7 @@ function Button({ className, variant, size, render, ...props }: ButtonProps) {...@@ -101,7 +101,7 @@ function Button({ className, variant, size, render, ...props }: ButtonProps) {
101export { Button, buttonVariants, type ButtonSize, type ButtonVariant };101export { Button, buttonVariants, type ButtonSize, type ButtonVariant };
102102
103const inlineButtonVariants = cva(103const inlineButtonVariants = cva(
104 "inline-flex shrink-0 cursor-pointer items-center gap-0.5 whitespace-nowrap font-medium underline-offset-2 hover:underline focus-visible:outline-2 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-64",104 "inline-flex shrink-0 cursor-pointer items-center gap-0.5 font-medium underline-offset-2 [text-align:var(--inline-button-text-align,center)] [white-space:var(--inline-button-white-space,nowrap)] hover:underline focus-visible:outline-2 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-64",
105 {105 {
106 defaultVariants: { tone: "default" },106 defaultVariants: { tone: "default" },
107 variants: {107 variants: {
...@@ -117,7 +117,7 @@ const inlineButtonVariants = cva(...@@ -117,7 +117,7 @@ const inlineButtonVariants = cva(
117 },117 },
118);118);
119119
120/** An inline text action that keeps the size of the surrounding text and underlines on hover. */120/** An inline text action. Set --inline-button-white-space to normal in wrapping prose containers. */
121export function InlineButton({121export function InlineButton({
122 className,122 className,
123 tone,123 tone,