Components

All components and hooks provided by React Suite.

Layout

15 components

Components

<Box>

Box

>=6.0.0

Components

<Center>

Center

>=6.0.0

Components

<Divider>

Divider

Updated

Components

<Container>
<Header>
<Footer>
<Content>
<Sidebar>

Frame

Updated

Components

<Grid>
<Row>
<Col>

Grid

Updated

Components

<Stack>
<Stack.Item>
<HStack>
<VStack>

Stack

Buttons

4 components

Button

Components

<Button>

Button

Components

<IconButton>

IconButton

Components

<ButtonGroup>
<ButtonToolbar>

ButtonGroup

Status

10 components

5

Components

<Badge>

Badge

Components

<Loader>

Loader

Components

<Message>

Message

Components

<Notification>

Notification

Components

<Progress>
<ProgressCircle>

Progress

Updated

Components

<ProgressCircle>

ProgressCircle

Updated

Components

<Placeholder.Graph>
<Placeholder.Grid>
<Placeholder.Paragraph>

Placeholder

Typography

4 components

H1H2H3

Components

<Heading>

Heading

>=5.58.0
Text

Components

<Highlight>

Highlight

>=5.61.0
ACtrl

Components

<Kbd>

Kbd

>=6.0.0

Components

<Text>

Text

>=5.58.0

Overlays

11 components

Components

<Drawer>
<Drawer.Header>
<Drawer.Body>
<Drawer.Footer>

Drawer

Components

<Modal>
<Modal.Header>
<Modal.Body>
<Modal.Footer>

Modal

Modal Integrations

Components

<Popover>

Popover

Components

<Tooltip>

Tooltip

Components

<Whisper>

Whisper

Navigation and Menu

29 components

Components

<Affix>

Affix

››

Components

<Breadcrumb>
<Breadcrumb.Item>

Breadcrumb

Components

<Dropdown>
<Dropdown.Item>
<Dropdown.Menu>
<Dropdown.Separator>

Dropdown

Visit Page

Components

<Link>

Link

>=6.0.0

Components

<Menu>
<Menu.Item>
<Menu.Separator>

Menu

>=6.0.0

Components

<Nav>
<Nav.Item>
<Nav.Menu>
<Nav.MegaMenu>

Nav

Updated

Components

<Navbar>
<Navbar.Brand>
<Navbar.Content>
<Navbar.Drawer>
<Navbar.Toggle>

Navbar

Updated

Components

<Sidenav>
<Sidenav.Header>
<Sidenav.Body>
<Sidenav.Footer>
<Sidenav.Toggle>
<Sidenav.GroupLabel>

Sidenav

Updated
12

Components

<Steps>
<Steps.Item>

Steps

123

Components

<Pagination>

Pagination

Media and icons

4 components

Components

<Avatar>
<AvatarGroup>

Avatar

Components

<Icon>

Icon

Components

<Image>

Image

>=5.76.0

Form

9 components

Components

<Form>
<Form.Stack>
<Form.Group>
<Form.Control>
<Form.ControlLabel>
<Form.HelpText>
<Form.ErrorMessage>

Form

Updated

Components

<Form>
<Form.Control>

Hooks

useFormControl

APIs

Schema

Form Validation

Updated

Formik

React Hook Form

schema-typed

Data Entry

29 components

Components

<AutoComplete>

AutoComplete

Components

<CascadeTree>

CascadeTree

>=5.56.0

Components

<Checkbox>
<CheckboxGroup>

Checkbox

Components

<CheckTree>

CheckTree

Components

<Input>
<InputGroup>
<InputGroup.Button>
<InputGroup.Addon>
<MaskedInput>

Input

Components

<InlineEdit>

InlineEdit

>=5.54.0

Components

<MultiCascadeTree>

MultiCascadeTree

>=5.56.0
123

Components

<NumberInput>

NumberInput

>=6.0.0

Components

<Radio>
<RadioGroup>

Radio

Components

<RadioTile>
<RadioTileGroup>

RadioTile

>=5.35.0

Components

<Rate>

Rate

Components

<SegmentedControl>

SegmentedControl

>=6.0.0

Components

<Slider>
<RangeSlider>

Slider

Updated

Components

<PasswordInput>
<PasswordStrengthMeter>

PasswordInput

>=6.0.0

Components

<PinInput>

PinInput

>=6.0.0

Components

<TagInput>

TagInput

Components

<Textarea>

Textarea

>=6.0.0

Components

<Toggle>

Toggle

Updated

Components

<Tree>

Tree

Components

<Uploader>

Uploader

Data Pickers

8 components

Components

<Cascader>

Cascader

Components

<CheckPicker>

CheckPicker

Components

<CheckTreePicker>

CheckTreePicker

Components

<InputPicker>

InputPicker

Components

<MultiCascader>

MultiCascader

Components

<SelectPicker>

SelectPicker

Components

<TagPicker>

TagPicker

Components

<TreePicker>

TreePicker

Date and Time

7 components

Components

<Calendar>

Calendar

Components

<DateInput>

DateInput

>=5.48.0

Components

<DatePicker>

DatePicker

Components

<DateRangeInput>

DateRangeInput

>=5.49.0

Components

<DateRangePicker>

DateRangePicker

1230PM

Components

<TimePicker>

TimePicker

>=5.72.0
900530

Components

<TimeRangePicker>

TimeRangePicker

>=5.72.0

Data Grid

5 components

Components

<Table>
<Table.Column>
<Table.ColumnGroup>
<Table.HeaderCell>
<Table.Cell>

Basic Table

Virtual Table

Tree Table

Sticky Table

Editable Table

Filterable Table

Data Display

19 components

Components

<Card>
<Card.Header>
<Card.Body>
<Card.Footer>
<CardGroup>

Card

>=5.75.0

Components

<Carousel>

Carousel

Components

<List>
<List.Item>

List

Components

<Stat>
<Stat.Label>
<Stat.ValueText>
<Stat.ValueUnit>
<Stat.HelpText>
<Stat.Trend>

Stat

>=5.75.0

Components

<Tag>

Tag

Components

<Timeline>
<Timeline.Item>

Timeline

Components

<Panel>
<PanelGroup>

Panel

Disclosure

5 components

Components

<Accordion>
<Accordion.Item>

Accordion

>=5.52.0

Components

<Tabs>
<Tabs.Tab>

Tabs

>=5.53.0

Components

<VisuallyHidden>

VisuallyHidden

>=5.52.0

Misc

6 components

Components

<Animation.Transition>
<Animation.Fade>
<Animation.Bounce>
<Animation.Slide>
<Animation.Collapse>

Animation

Components

<CustomProvider>

CustomProvider

APIs

DOMHelper

DOMHelper

Hooks

Hooks

useBreakpointValue

useBreakpointValue

>=5.64.0

Hooks

useDialog

useDialog

>=6.0.0

Hooks

useMediaQuery

useMediaQuery

Hooks

useToaster

useToaster

Updated

Can't find the component you want? Request to add new components