Premium & Brand

Receive Button

Family Receive pill that morphs into a confirmation card.

Import

tsx

import { ReceiveButton } from "@cronus-ui/ui";

bash

npx cronus-ui add receive-button

Examples

Family receive

The sky pill morphs into a confirmation card. Receive, Cancel, the close X, Escape, or the blurred backdrop all collapse it back. The CTA keeps its layoutId so it flies into the dialog.

Toggle layout with animation

tsx

<ReceiveButton />

API Reference

Generated from the component's exported types.

ReceiveButtonProps

Extends Omit< ComponentPropsWithoutRef<"div">, "onAnimationStart" | "onAnimationEnd" | "onDrag" | "onDragStart" | "onDragEnd" >

Prop	Type	Default	Description
`ref`	`Ref<HTMLDivElement>`	—	—
`open`	`boolean`	—	—
`defaultOpen`	`boolean`	`false`	—
`onOpenChange`	`(open: boolean) => void`	—	—
`onConfirm`	`() => void`	—	Fired when the dialog Receive action is pressed. The dialog then closes.
`labels`	`Partial<ReceiveButtonLabels>`	—	—