Fieldset

The built-in fieldset tag — a bordered group of related fields with a legend caption; the block body holds the inputs.

A built-in block tag that groups related fields in a bordered box with a legend caption. The block body holds the inputs, and disabled can cascade a disabled state to every control inside. Use it to break a long form into labelled sections.

Use it as {% fieldset %} … {% endFieldset %} in Markdown, or call it from Python logic (loops, snippets) via component('aardvark', 'fieldset', …) with the grouped fields passed as children.

A labelled group

The body between {% fieldset %} and {% endFieldset %} holds the fields; legend is the caption rendered in the border.

Variant

variant is default, filled, or unstyled.

Radius

radius sets the border radius — xs–xl or any CSS value.

Disabled cascade

disabled cascades a disabled state to every control inside the group, so you can lock a whole section with one flag.

With other components

Fieldset is a container, so any of the field tags can go inside it — text inputs, selects, file pickers, and more — to compose a complete form section.

Attributes

Omit any attribute to take its Mantine default.

CSS Selectors

Target a {% fieldset %} from your own CSS with the island data attribute or the Mantine Styles API part classes:

/* Every Fieldset instance on the page */
[data-aardvark-island="Fieldset"] { }

/* Mantine Styles API parts */
.mantine-Fieldset-root { }
.mantine-Fieldset-legend { }

Injecting Attributes

Pass attr={…} to forward raw HTML attributes — including inline event handlers — straight onto the rendered element. Here it is wired to onchange, so editing the nested field logs the field value to the console and alerts it: