fix(Button): asChild slot children error

- Separate render paths: asChild uses Slot directly, normal uses button
- Fixes "Slot failed to slot onto its children" runtime error
- Slot now always receives exactly one child (the Link element)
This commit is contained in:
2026-07-08 00:00:01 -04:00
parent f5f3b2263e
commit 3812b831c9
+15 -5
View File
@@ -47,17 +47,27 @@ export interface ButtonProps
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>( const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ className, variant, size, loading, disabled, asChild = false, children, ...props }, ref) => { ({ className, variant, size, loading, disabled, asChild = false, children, ...props }, ref) => {
const Comp = asChild ? Slot : 'button' if (asChild) {
return ( return (
<Comp <Slot
className={cn(buttonVariants({ variant, size, className }))} className={cn(buttonVariants({ variant, size, className }))}
ref={ref} ref={ref}
disabled={asChild ? undefined : (disabled || loading)}
{...props} {...props}
> >
{loading && !asChild && <Loader2 className="h-4 w-4 animate-spin" />}
{children} {children}
</Comp> </Slot>
)
}
return (
<button
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
disabled={disabled || loading}
{...props}
>
{loading && <Loader2 className="h-4 w-4 animate-spin" />}
{children}
</button>
) )
} }
) )