# Fieldset Primitive

Fieldset is a Starwind Runtime primitive in the field-control-coordinator contract family.
Astro and React share one semantic component API. React coordinates reactive state through controlled and default props plus callbacks. Astro renders initial state and coordinates later changes through DOM events and Runtime methods. Raw HTML uses Runtime attributes, DOM events, and imperative methods.
## Anatomy
### Astro
Use the Astro primitive adapter to render Fieldset anatomy with the Runtime wiring included.
```astro
---
import { Fieldset } from "@starwind-ui/astro/fieldset";
---

<Fieldset.Root>
  <Fieldset.Legend>Preferences</Fieldset.Legend>
</Fieldset.Root>
```

### React
Use the React primitive adapter when Fieldset state participates in React rendering.
```tsx
import { Fieldset } from "@starwind-ui/react/fieldset";

export function Example() {
  return (
    <Fieldset.Root>
      <Fieldset.Legend>Preferences</Fieldset.Legend>
    </Fieldset.Root>
  );
}
```

### HTML
Render the Fieldset data-sw-* contract yourself, then initialize createFieldset.
```html
<fieldset data-sw-fieldset>
  <div data-sw-fieldset-legend>Preferences</div>
</fieldset>

<script type="module">
  import { createFieldset } from "@starwind-ui/runtime/fieldset";

  const root = document.querySelector("[data-sw-fieldset]");
  if (root) {
    createFieldset(root);
  }
</script>
```

### Vue
Use the Vue 3.5 beta adapter to render Fieldset anatomy.
```vue
<script setup lang="ts">
import Fieldset from "@starwind-ui/vue/fieldset";
</script>

<template>
  <Fieldset.Root>
    <Fieldset.Legend>Preferences</Fieldset.Legend>
  </Fieldset.Root>
</template>
```
## API Reference
### Root
The main element that owns the Fieldset Runtime instance.
| Fact | Value |
| --- | --- |
| Default element | `fieldset` |
| Discovery hook | `data-sw-fieldset` |
| Role | - |
#### Props
| Prop | Type | Default | Kind | Description | Framework Behavior |
| --- | --- | --- | --- | --- | --- |
| disabled | `boolean` | false | option | Disables the Root part. | - |
#### Data Attributes
| Attribute | Source | Value | Description |
| --- | --- | --- | --- |
| `data-sw-fieldset` | runtime | - | Marks the Root part so Starwind Runtime can find it. |
| `data-disabled` | prop | - | Reflects the disabled prop on the Root part. |
#### Runtime Setters
| Method | Target | Options | Suppresses Emit | Description |
| --- | --- | --- | --- | --- |
| `setDisabled` | prop: disabled | - | No | Updates whether Fieldset is disabled from Runtime code. |
#### Refs
| Part | Public |
| --- | --- |
| root | Yes |
#### Initial Markup
| Attributes | Reason |
| --- | --- |
| `data-sw-fieldset`, `data-disabled` | Fieldsets must expose disabled grouping state before initialization so child Fields can inherit it. |

### Legend
Legend text for the Fieldset fieldset.
| Fact | Value |
| --- | --- |
| Default element | `div` |
| Discovery hook | `data-sw-fieldset-legend` |
| Role | - |
#### Data Attributes
| Attribute | Source | Value | Description |
| --- | --- | --- | --- |
| `data-sw-fieldset-legend` | runtime | - | Marks the Legend part so Starwind Runtime can find it. |
#### Refs
| Part | Public |
| --- | --- |
| legend | Yes |
#### Initial Markup
| Attributes | Reason |
| --- | --- |
| `data-sw-fieldset-legend` | The Fieldset controller associates legend ids with the root and then mirrors disabled state for styling. |
## Runtime API
| Fact | Value |
| --- | --- |
| Factory | [`createFieldset`](/docs/runtime/#create-fieldset) |
| Import | `@starwind-ui/runtime/fieldset` |
| Root part | root |
| Option props | disabled |
| Option lifecycles | disabled: setter-backed |
## Related Styled Components
| Component | Relationship |
| --- | --- |
| [Field](/docs/components/field/) | Composite |
## Exports
| Group | Import | Exports |
| --- | --- | --- |
| Runtime | `@starwind-ui/runtime/fieldset` | `createFieldset` |
| Astro Primitive | `@starwind-ui/astro/fieldset` | `Fieldset`, `FieldsetRoot`, `FieldsetLegend` |
| React Primitive | `@starwind-ui/react/fieldset` | `Fieldset`, `FieldsetRoot`, `FieldsetLegend` |
## Canonical Names
| Kind | Name |
| --- | --- |
| namespace | `Fieldset` |
| runtime-factory | `createFieldset` |
| part | `Fieldset.Root` |
| part | `Fieldset.Legend` |
## Changelog
### v1.0.1
- Removed obsolete private-release warnings from generated Vue adapters and normalized the resulting blank line in vendored Primitive indexes.
### v1.0.0
- Promoted this Primitive's vendoring version to the stable 1.0.0 baseline. Its existing API and Runtime behavior carry forward from the previous release.
### v0.1.1
- Marked generated React Primitive files as client modules so vendored installs preserve client boundaries in React server frameworks.
### v0.1.0
- Introduced grouped field state with legend, disabled, invalid, and accessible description coordination.