UNPKG

@neynar/ui

Version:

React UI component library built on shadcn/ui and Tailwind CSS

51 lines (41 loc) 1.36 kB
# AlertDialogAction **Type**: component Primary action button of the alert dialog The button that confirms or executes the action being alerted about. Automatically receives focus when the dialog opens (unless overridden). Styled using buttonVariants() by default, but can be customized for destructive actions. Closes the dialog when clicked. ## JSX Usage ```jsx import { AlertDialogAction } from '@neynar/ui'; <AlertDialogAction asChild={true} className="value" /> ``` ## Component Props ### asChild - **Type**: `boolean` - **Required**: No - **Description**: Render as child element, merging props and behavior ### className - **Type**: `string` - **Required**: No - **Description**: Additional CSS classes (useful for destructive styling) ## Examples ```tsx // Default action (primary button style) <AlertDialogAction>Continue</AlertDialogAction> <AlertDialogAction>Save Changes</AlertDialogAction> // Destructive action with red styling <AlertDialogAction className={buttonVariants({ variant: "destructive" })}> Delete Account </AlertDialogAction> // Custom styled action <AlertDialogAction className="bg-green-600 hover:bg-green-700"> Confirm Action </AlertDialogAction> // Composition with custom button <AlertDialogAction asChild> <Button variant="destructive" size="lg"> Delete Forever </Button> </AlertDialogAction> ``` /