Button

A special button component that can receive Melt UI builders for use with the `asChild` prop.

	<script lang="ts">
  import { Button } from "$lib";
</script>
 
<Button.Root
  class="inline-flex h-12 items-center justify-center rounded-input bg-dark
  px-[21px] text-[15px] font-semibold text-background shadow-mini
  hover:bg-dark/95 active:scale-98 active:transition-all"
>
  Unlimited
</Button.Root>

	<script lang="ts">
  import { Button } from "$lib";
</script>
 
<Button.Root
  class="inline-flex h-12 items-center justify-center rounded-input bg-dark
  px-[21px] text-[15px] font-semibold text-background shadow-mini
  hover:bg-dark/95 active:scale-98 active:transition-all"
>
  Unlimited
</Button.Root>

Structure

	<script lang="ts">
  import { Button } from "bits-ui";
</script>
 
<Button.Root />

	<script lang="ts">
  import { Button } from "bits-ui";
</script>
 
<Button.Root />

Component API

Button.Root

A special button component that can receive Melt UI builders for use with the asChild prop.

Property	Type	Description
`builders`	`Builder[]`	An array of melt builders to be applied to the button. `Default: []`
`href`	`string`	An optional prop that when passed converts the button into an anchor tag. `Default: —— undefined`

Data Attribute	Value	Description
`data-button-root`	`——`	Present on the button element.