Dinachi

Button

A customizable button component with multiple variants and sizes. Built with accessibility in mind.

View Source

#Installation

npx @dinachi/cli@latest add button

#Usage

tsx
import { Button } from '@/components/ui/button'

#Examples

Default Button

A basic button with default styling

Button Variants

Different button variants for various use cases

Button Sizes

Different button sizes for different contexts

#API Reference

PropTypeDefaultDescription
variant'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link''default'The visual style variant of the button
size'default' | 'sm' | 'lg' | 'icon''default'The size of the button
renderReactElement | ((props, state) => ReactElement)undefinedReplace the rendered element with a different tag or component.