legend
Type | JSX children (optional) |
---|
Children for the <legend>
element. It may only render phrasing content.
Groups and labels related form fields.
It implements the <fieldset>
element.
pages/_app.js
.import 'device-agnostic-ui/public/components/Fieldset.css';
legend
Type | JSX children (optional) |
---|
Children for the <legend>
element. It may only render phrasing content.
children
Type | JSX children (required) |
---|
Main content, contained in a <div>
element.
...props
Type | …* (optional) |
---|
Additional props for the container; a <fieldset>
element.
import
.import Fieldset from 'device-agnostic-ui/public/components/Fieldset.js';
require
.const Fieldset = require('device-agnostic-ui/public/components/Fieldset');
import
. Convenient, but technically inferior to a deep import
.import { Fieldset } from 'device-agnostic-ui';
require
. Convenient, but technically inferior to a deep require
.const { Fieldset } = require('device-agnostic-ui');
import { Fieldset, Textbox } from 'device-agnostic-ui';
const result = (
<Fieldset legend="Options">
<Toggle
inputProps={{
type: 'radio',
name: 'options',
value: 'a',
defaultChecked: true,
}}
>
Label A
</Toggle>
<Toggle
inputProps={{
type: 'radio',
name: 'options',
value: 'b',
}}
>
Label B
</Toggle>
</Fieldset>
);