The profile flyout is a component to use with the top navigation. When clicking the avatar, this flyout opens, containing the customer's name, email, and links to their account info.
Read more about when and how to use the Profile Flyout component on the website.
Install the package
yarn add @hig/profile-flyout @hig/theme-context @hig/theme-data
Import the component
import ProfileFlyout from '@hig/profile-flyout';
<ProfileFlyout image="https://placekitten.com/g/50/50" name="David Gonzalez" email="firstname.lastname@example.org" />