Fieldset

# Brok UI: Fieldset (`fieldset`)

A <fieldset> that groups related controls under an optional <legend>, with a single disabled toggle that natively cascades to every control inside.

Brok UI is a Laravel Blade component registry. Installed components are plain Blade files the app owns.

## Install

```bash
php artisan ui:add fieldset
```

## Usage

```blade
<x-ui.fieldset legend="Notifications" class="mx-auto w-full max-w-md">
    <x-ui.field name="notify_email" label="Email">
        <x-ui.input name="notify_email" type="email" placeholder="[email protected]" />
    </x-ui.field>
    <label class="flex items-center gap-2 text-sm text-foreground">
        <x-ui.checkbox name="weekly_digest" />
        {{ __('Send me the weekly digest') }}
    </label>
</x-ui.fieldset>
```

## Props

- `legend` (mixed|null, default `null`) — Legend text. For richer legend markup, fill the legend slot instead.
- `disabled` (bool, default `false`) — Disables the whole group; cascades natively to every contained control.

## Use when

- Use to collect, group, and clearly label related input so users understand what is being asked and can recover from errors.
- Grouping a set of related fields (such as an address, or a radio/checkbox set) under one heading.
- Needing to disable every control inside a section at once, natively, without wiring each control individually.

## Avoid when

- Do not create dense unlabeled forms; start from one thing per page or one conceptual question per step when the task is unfamiliar or high stakes.
- Labelling a single field; use label instead.
- A purely visual grouping with no shared legend or disable behaviour; use a plain div instead.

## Anti-patterns

- Dense unlabeled forms
- Collecting information without a task need

## Rules

- Use the `<brok:fieldset>` tag (or `<x-ui.fieldset>`) in Blade; do not rewrite the component.
- Prefer the documented props and variants over utility-class overrides; when a utility must win, use the `!` important modifier.
- Use semantic design tokens (`bg-primary`, `text-muted-foreground`), never raw colour utilities.
- Keep the `data-slot` attributes; they are the styling and test hooks.

## Links

- Docs: https://brokui.dev/docs/components/fieldset
- Registry JSON (files, props, contract): https://brokui.dev/r/open/fieldset.json

@props([
    // Optional legend text. For richer legend markup, fill the `legend` slot instead.
    'legend' => null,
    // Disable the whole group (cascades to every contained control natively).
    'disabled' => false,
])

<fieldset
    data-slot="fieldset"
    @disabled($disabled)
    {{ $attributes->merge(['class' => 'min-w-0 space-y-4 border-0 p-0']) }}
>
    @isset($legend)
        {{-- Slot wins over the prop for custom legend markup. --}}
        <legend data-slot="fieldset-legend" class="text-base font-semibold leading-none text-foreground">
            {{ $legend }}
        </legend>
    @elseif (filled($legend))
        <legend data-slot="fieldset-legend" class="text-base font-semibold leading-none text-foreground">
            {{ __($legend) }}
        </legend>
    @endisset

    {{ $slot }}
</fieldset>