Button

A multi-variant action component with loading state and size variants.

Preview

Button variants

The primary button styles cover high-emphasis actions, secondary actions, and quiet inline controls.

Use Button for primary actions, inline confirmations, and lightweight toolbar interactions.

Registry install

pnpm dlx shadcn@latest add https://vue.tileui.zmorg.cn/r/button.json

Package usage

import { TButton } from '@tile-ui/vue';

Highlights

  • Six visual variants
  • Loading state support
  • Small, default, and large sizes
  • Fits naturally into slot-based Vue composition

Registry dependencies

Item Purpose
button Component source
core Framework-agnostic behavior helpers
styles Shared SCSS tokens and globals

API reference

Prop Type Default Notes
variant default | destructive | outline | secondary | ghost | link default Chooses the button visual treatment.
size default | sm | lg | icon default Controls height and padding.
loading boolean false Disables interaction and shows the inline spinner.