Button

Preview

Installation

npx shadcn@latest add @cubby-ui/button

Usage

import { Button } from "@/components/ui/cubby-ui/button"

<Button />

Examples

Variants

The Button supports multiple visual variants for different use cases.

Sizes

Choose from multiple sizes to fit your design.

With Icons

Add icons to provide visual context.

As Link

Use the render prop to render as a Next.js Link and set nativeButton to false.

API Reference

The Button component is built on top of Base UI's Button. All Base UI props are supported. The documentation below only covers custom props and modified defaults specific to our implementation.

For the complete Base UI API, see the Base UI Button documentation.

Custom Props

Modified Defaults

Our implementation changes the following Base UI prop defaults:

• Button: When loading is true, button is automatically disabled
• Button: When loading is true, focusableWhenDisabled is set to true to maintain keyboard accessibility