ProfileMenu
A "User Profile Menu" is a component commonly found on websites or applications. It typically appears in the top-right corner of a web page and provides options related to the user's account. Within this menu, users can access features such as viewing their account details, adjusting settings, and logging out. It serves as a convenient hub for managing account-related actions.
Default
Bill Gates
Download:
Customized
Download:
Documentation
Depending on how your CSS styles are configured (e.g. whether body contains an overflow or not),
the ProfileMenu may be displayed with a flicking effect when placed at the top right or top left of the screen.
To avoid this, you can use the TopCorner="true" property, which forces the positioning of the popup.
FluentProfileMenu Class
Parameters
Name | Type | Default | Description |
|---|---|---|---|
ButtonSize | string? | 32px | Gets or sets the size of the main button image (button clickable to display the popover). |
ChildContent | RenderFragment? | Gets or sets the content to be displayed in the main section (body) of the popover. Using this property will override the FluentProfileMenu.EMail, FluentProfileMenu.FullName, FluentProfileMenu.Image properties. | |
EMail | string? | Gets or sets the email to display. | |
EndTemplate | RenderFragment? | Gets or sets the content to be displayed in the end (right) section of the Profile button. | |
FooterLabel | string? | Gets or sets the footer label to display on the bottom-left. | |
FooterLink | string? | View account | Gets or sets the Footer hyperlink label (e.g. View account) on the bottom-right. |
FooterTemplate | RenderFragment? | Gets or sets the content to be displayed in the footer section of the popover. Using this property will override the FluentProfileMenu.FooterLink property. | |
FullName | string? | Gets or sets the name to display. | |
HeaderButton | string? | Sign out | Gets or sets the Header Button label (e.g. Sign out) on the top-right. |
HeaderLabel | string? | Gets or sets the header label (e.g Company Name) to display on the top-left. | |
HeaderTemplate | RenderFragment? | Gets or sets the content to be displayed in the header section of the popover. Using this property will override the FluentProfileMenu.HeaderLabel and FluentProfileMenu.HeaderButton properties. | |
Image | string? | Gets or sets the image to display, in replacement of the initials. | |
ImageSize | string? | 64px | Gets or sets the size of the image, in the popover. |
Initials | string? | Gets or sets the initials to display if no image is provided. By default, the first letters of the FluentProfileMenu.FullName is used. | |
Open | bool | False | Gets or sets the Menu status. |
PopoverClass | string? | Gets or sets the Class to apply to the Profile Popup. | |
PopoverStyle | string? | Gets or sets the Style to apply to the Profile Popup. | |
StartTemplate | RenderFragment? | Gets or sets the content to be displayed in the start (left) section of the Profile button. | |
Status | PresenceStatus? | Gets or sets the status to show. See PresenceStatus for options. | |
StatusTitle | string? | Gets or sets the title to show on hover. If not provided, the status will be used. | |
TopCorner | bool | False | Gets or sets whether popover should be forced to top right or top left (RTL). |
EventCallbacks
Name | Type | Description |
|---|---|---|
OnFooterLinkClick | EventCallback | Event raised when the user clicks on the Footer hyperlink (e.g. View account). |
OnHeaderButtonClick | EventCallback | Event raised when the user clicks on the Header Button (e.g. Sign out). |
OpenChanged | EventCallback<bool> | Gets or sets the callback that is invoked when the open state changes. |