Components
Fieldset
Fieldset, dressed in the paper-and-ink system: a song-serif legend heading a column of fields. The parts — Root, Legend, HelperText, ErrorText.
#Basic usage
<script setup lang="ts">
import { Field, Fieldset } from "@bysages/vue";
</script>
<template>
<Fieldset.Root>
<Fieldset.Legend>Contact details</Fieldset.Legend>
<Field.Root>
<Field.Label>Name</Field.Label>
<Field.Input placeholder="John Doe" />
</Field.Root>
<Field.Root>
<Field.Label>Email</Field.Label>
<Field.Input type="email" placeholder="[email protected]" />
</Field.Root>
</Fieldset.Root>
</template>
#Props
#ErrorText
A styled part — no props of its own; it takes the anatomy's shared styling.
#HelperText
A styled part — no props of its own; it takes the anatomy's shared styling.
#Legend
A styled part — no props of its own; it takes the anatomy's shared styling.
#Root
| Prop | Type | Default | Description |
|---|---|---|---|
disabled | boolean | 'true' | 'false' | Indicates whether the fieldset is disabled. | |
id | string | The id of the fieldset. | |
invalid | boolean | Indicates whether the fieldset is invalid. |