From 8cd90eaa9db8995f64e0a3924a4a7ab1cb170553 Mon Sep 17 00:00:00 2001 From: Maximilian Kaske <56969857+mxkaske@users.noreply.github.com> Date: Sat, 5 Sep 2026 14:20:23 +0200 Subject: [PATCH] fix: input group disabled control (#2646) --- packages/ui/src/components/ui/input-group.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/ui/src/components/ui/input-group.tsx b/packages/ui/src/components/ui/input-group.tsx index 0022cd433..b514e0cb1 100644 --- a/packages/ui/src/components/ui/input-group.tsx +++ b/packages/ui/src/components/ui/input-group.tsx @@ -15,7 +15,9 @@ function InputGroup({ className, ...props }: React.ComponentProps<"div">) { className={cn( "group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none", "h-9 min-w-0 has-[>textarea]:h-auto", - "has-[:disabled]:pointer-events-none has-[:disabled]:opacity-50", + // Scoped to the control: an addon button going disabled (e.g. an empty + // send button) must not make the whole group non-interactive. + "has-[[data-slot=input-group-control]:disabled]:pointer-events-none has-[[data-slot=input-group-control]:disabled]:opacity-50", // Variants based on alignment. "has-[>[data-align=inline-start]]:[&>input]:pl-2", @@ -72,7 +74,9 @@ function InputGroupAddon({ if ((e.target as HTMLElement).closest("button")) { return; } - e.currentTarget.parentElement?.querySelector("input")?.focus(); + e.currentTarget.parentElement + ?.querySelector("[data-slot=input-group-control]") + ?.focus(); }} {...props} /> -- 2.51.2