Button

#Basic usage

button/basic.vue

<script setup lang="ts">
import { Button } from "@bysages/vue";
</script>

<template>
  <Button variant="solid" tone="ink" size="md">Submit</Button>
</template>

#Props

#Button

The control recipe as a standalone button: the variant chooses how it rests, the tone chooses the pigment. Ink is the solemn default; any action can carry the primary weight.

Prop	Type	Default	Description
`variant`	`String`	`"solid"`	How the button rests: a solid ink fill, an outline shell, a quiet ghost, or a subtle wash.
`tone`	`String`	`"ink"`	The pigment the variant is inked with; ink is the solemn default, and the fixed pigments speak for their meaning.
`size`	`String`	`"md"`	One rung of the control-height ladder: the small, medium, or large register.
`square`	`Boolean`	`false`	Icon-only: the silhouette squares to the control height.
`asChild`	`Boolean`	`false`	Render the slot's element as the button — the recipe rides on it (a NuxtLink, say) instead of wrapping it in a nested
`disabled`	`Boolean`	`false`	—