BricksLab Catalog

@brickslab/ui-web

Interactive button that triggers confetti animation on click. Combines the Confetti component with a button for easy celebration triggers.

Aperçu

Default ConfettiButton

With Custom Confetti Options

Multiple Variants

Props Table

Prop	Type	Défaut	Requis	Description
`children`	`React.ReactNode`	—	—	Button label or content.
`options`	`Partial<ConfettiProps>`	—	—	Configuration for confetti animation.
`disabled`	`boolean`	`false`	—	Disable the button.
`onClick`	`() => void`	—	—	Callback triggered on click.
`className`	`string`	—	—	Additional CSS class.

Usage

tsx

import { ConfettiButton } from "@brickslab/ui-web";

// Basic usage
<ConfettiButton>Celebrate!</ConfettiButton>

// Custom confetti
<ConfettiButton
  options={{
    particleCount: 150,
    angle: 45,
    spread: 90,
    colors: ["#CC4A48", "#4ADE80"],
  }}
>
  Success!
</ConfettiButton>

// With callback
<ConfettiButton onClick={() => console.log("Clicked!")}>
  Click me
</ConfettiButton>