Axonyx UI

Forms

Fieldset

Give related controls a semantic group and an accessible name with Fieldset and Legend. Choose the default or forged surface independently of the fields inside.

Next: Field

Publishing preferences

Legend labels the whole group. Each checkbox still has its own label and can be toggled using the keyboard.

Publishing preferences
View code
Code
asx
<Fieldset surface="forged">
  <Legend>Publishing preferences</Legend>
  <Checkbox name="show_author" checked="true">Show the author</Checkbox>
  <Checkbox name="allow_comments">Allow comments</Checkbox>
</Fieldset>

System metadata

Use the default surface for supporting fields. Disable individual controls when a value is assigned by the server.

System metadata

This disabled field is excluded from form submission.

View code
Code
asx
<Fieldset>
  <Legend>System metadata</Legend>
  <Field htmlFor="revision">
    <FieldLabel htmlFor="revision">Revision</FieldLabel>
    <Input id="revision" name="revision" value="Assigned on save" disabled="true" />
  </Field>
</Fieldset>

Installation

Command
bash
cargo ax add ui
Manual setup
Cargo.toml
toml
[dependencies]
axonyx-ui = "0.0.80"
app/layout.asx
asx
use "@axonyx/ui"

Fieldset and Legend contract

Imports
asx
import { Fieldset } from "@axonyx/ui/foundry/Fieldset.asx"
import { Legend } from "@axonyx/ui/foundry/Legend.asx"

Fieldset surface: optional String. Default uses the standard border; forged adds a stronger border and accent surface.

Fieldset slot: grouped controls. Place Legend first; it renders the native legend element and takes its label from the default slot.

Legend has no declared props. Fieldset declares surface; set disabled on individual controls to disable them in the current API.

Fieldset renders a fieldset element. It does not submit data itself; place it inside Form when the controls need to be submitted together.

See Fieldset inside the CMS article editor