User

Display user information with avatar and name.

Installation

npx nextui-cli@latest add user

The above command is for individual installation only. You may skip this step if @nextui-org/react is already installed globally.

Import

Usage

Note: See the Avatar component for more details about avatarProps.

Link Description

Slots

• base: The base slot of the user, it is the main container.
• wrapper: The name and description wrapper.
• name: The name of the user.
• description: The description of the user.

Data Attributes

User has the following attributes on the root element only when isFocusable is true:

• data-focus: When the user is being focused. Based on useFocusRing
• data-focus-visible: When the user is being focused with the keyboard. Based on useFocusRing

API

User Props