Fieldset

Display a collection of related information in a single unit.

General

Add custom buttons.

Preview

See code

Try React

React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started.

Custom Text

Representation in different situations.

Preview

See code

Add React to a Website

You can add React to an HTML page in one minute. You can then either gradually expand its presence, or keep it contained to a few dynamic widgets

Tabs

Show multiple Fieldset.

Preview

See code

Create a New React App

When starting a React project, a simple HTML page with script tags might still be the best option. It only takes a minute to set up!

Learn React

People come to React from different backgrounds and with different learning styles. Whether you prefer a more theoretical or a practical approach, we hope you’ll find this section helpful.

First Examples

The React homepage contains a few small React examples with a live editor. Even if you don’t know anything about React yet, try changing their code and see how it affects the result.

With Divider

Use Divider and Fieldset.Content to combine different layouts.

Preview

See code

React

For Beginners

If you feel that the React documentation goes at a faster pace than you’re comfortable with, check out this overview of React by Tania Rascia. It introduces the most important React concepts in a detailed, beginner-friendly way. Once you’re done, give the documentation another try!

APIs

Fieldset.Props

Attribute	Description	Type	Accepted values	Default
value	unique ident value (only in group)	`string`	-	-
label	group tab text (only in group)	`string`	-	-
title	title of fieldset	`ReactNode` / `string`	-	-
subtitle	subtitle of fieldset	`ReactNode` / `string`	-	-
...	native props	`FieldsetHTMLAttributes`	`'name', 'className', ...`	-

Fieldset.Content.Props[alias: `Fieldset.Body`]

Attribute	Description	Type	Accepted values	Default
...	native props	`HTMLAttributes`	-	-

Fieldset.Footer.Props

Attribute	Description	Type	Accepted values	Default
...	native props	`HTMLAttributes`	-	-

Fieldset.Group.Props

Attribute	Description	Type	Accepted values	Default
value	selected tab value	`string`	-	-
onChange	change tab event	`(value: string) => void`	-	-
...	native props	`HTMLAttributes`	-	-

Edit this page on GitHub

Drawer

Grid

MADE & DESIGNED WITHBY BRUNO ANDRADE

Fieldset

React

Fieldset.Content.Props[alias: Fieldset.Body]

Fieldset.Content.Props[alias: `Fieldset.Body`]