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>(
({ className, variant, size, loading, disabled, asChild = false, children, ...props }, ref) => {
const Comp = asChild ? Slot : 'button'
if (asChild) {
return (
<Slot
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
{...props}
>
{children}
</Slot>
)
}
return (
<Comp
<button
className={cn(buttonVariants({ variant, size, className }))}
ref={ref}
disabled={asChild ? undefined : (disabled || loading)}
disabled={disabled || loading}
{...props}
>
{loading && !asChild && <Loader2 className="h-4 w-4 animate-spin" />}
{loading && <Loader2 className="h-4 w-4 animate-spin" />}
{children}
</Comp>
</button>
)
}
)