Breadcrumb
<Breadcrumb>
<Breadcrumb.Item>
<a href="">Home</a>
</Breadcrumb.Item>
<Breadcrumb.Item>
<a href="">Group</a>
</Breadcrumb.Item>
<Breadcrumb.Item>
<a href="">Page</a>
</Breadcrumb.Item>
</Breadcrumb>
Menu
<Dropdown
overlay={
<Menu>
<Menu.Item>
<a href="#">Item 1</a>
</Menu.Item>
<Menu.Item>
<a href="#">Item 2</a>
</Menu.Item>
<Menu.Item>
<a href="#">Item 3</a>
</Menu.Item>
</Menu>
}
placement="bottomLeft">
<Button>Open menu</Button>
</Dropdown>
Stepper
<Steps current={1}>
<Steps.Step title="Step 1" />
<Steps.Step title="Step 2" />
<Steps.Step title="Step 3" />
</Steps>
Tabs
const [value, setValue] = React.useState("1");
<Menu
selectedKeys={[value]}
onClick={(e) => setValue(e.key.toString())}
mode="horizontal">
<Menu.Item key="1">Selected</Menu.Item>
<Menu.Item key="2" disabled>
Disabled
</Menu.Item>
<Menu.Item key="3">Active</Menu.Item>
</Menu>
Drawer
const [isOpen, setIsOpen] = useState();
<Drawer
title="Drawer"
placement="left"
onClose={setIsOpen()}
visible={isOpen}
>
<p>Hello!</p>
</Drawer>
Pagination
<Pagination defaultCurrent={1} total={50} />