asChild props on AlertDialogAction do not work

[luvlaceeeee]

asChild props on AlertDialogAction do not work

I have this code element

...
       <AlertDialogFooter>
          <AlertDialogCancel>Cancel</AlertDialogCancel>
          <AlertDialogAction asChild>
            <Button variant={'destructive'}>Continue</Button>
          </AlertDialogAction>
        </AlertDialogFooter>
...

And I wanted to make the button in the dialog box destructive, and I found that the asChild property does not work correctly with styles.

In the ui i comment this code

const AlertDialogAction = React.forwardRef<
  React.ElementRef<typeof AlertDialogPrimitive.Action>,
  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>
>(({ className, ...props }, ref) => (
  <AlertDialogPrimitive.Action
    ref={ref}
    className={cn(buttonVariants(), className)}
    {...props}
  />
));
AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
));
AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName; 

and add this

const AlertDialogAction = AlertDialogPrimitive.Action;

And everything works fine

[spcbfr]

No official solution to this yet?

[dngpng]

One possible temporary solution is:

<AlertDialogAction asChild>
  <>
    <Button variant="destructive">Delete</Button>
  </>
</AlertDialogAction>

[shadcn]

This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.