fix(ui): truncate long URLs in copy button from the start

Button wraps its children in an unconstrained inline-flex span, so a long
checkout URL sized that wrapper past the button and got clipped on both
ends by justify-center, hiding the start of the URL.

Constrain the wrapper with min-w-0 max-w-full so truncating children can
shrink, and left-align the URL text so the ellipsis lands at the end.

Author: charlietlamb

packages/ui/src/components/ui/button.tsx

@@ -151,7 +151,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
 						)}
 						<span
 							className={cn(
-								"inline-flex items-center gap-2",
+								"inline-flex items-center gap-2 min-w-0 max-w-full",
 								variant === "primary" && "relative z-10 transition-none",
 								isLoading && "invisible",
 							)}

vite/src/components/forms/shared/UrlSuccessView.tsx

@@ -47,7 +47,7 @@ export function UrlSuccessView({
 				<CopyButton
 					text={url}
 					className="w-full"
-					innerClassName="text-xs text-tertiary-foreground font-mono min-w-0 flex-1"
+					innerClassName="text-xs text-tertiary-foreground font-mono min-w-0 flex-1 text-left"
 				/>
 			</SheetFooter>
 		</>