/** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ import type { ElementType, ForwardRefExoticComponent, ReactElement, ReactNode } from 'react'; import { ButtonProps } from '../Button'; import type { MenuProps } from '../Menu'; import './user-dropdown-menu.scss'; export type UserDropdownMenuProps = Omit, 'open' | 'anchorEl'> & { /** * List item icon. */ actionIcon?: ReactNode; /** * List item button text. */ actionText?: string; /** * Footer content. */ footerContent?: ReactNode[]; /** * Menu items to be added to the dropdown menu. */ menuItems?: ReactNode[]; /** * Current mode. */ mode?: string; /** * Array list of modes */ modes?: ModeList[]; /** * Heading of the modes list. */ modesHeading?: string; /** * Callback function on list item action trigger. */ onActionTrigger?: () => void; /** * Callback function on mode change. */ onModeChange?: (mode: string) => void; /** * Callback function on navigation to logged user's profile. */ onUserProfileNavigation?: () => void; /** * Props sent to the menu trigger Button component. */ triggerOptions?: Omit & Record; /** * Logged user information. */ user?: UserTemplate; }; export type ModeList = { /** * Icon of the mode. */ icon?: string | ReactElement; /** * Display name of the mode. */ name: string; }; export type UserTemplate = { /** * Email of logged user. */ email?: string; /** * Image link of logged user. */ image?: string; /** * Display name of logged user. */ name?: string; }; /** * The User Dropdown Menu lets you display a dropdown menu with user information and actions. * * Demos: * * - [UserDropdownMenu (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-image) * * API: * * - inherits [Menu API](https://mui.com/material-ui/api/menu/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the native component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the UserDropdownMenu component. * @param ref - The ref to be forwarded to the Menu component. * @returns The rendered UserDropdownMenu component. */ declare const UserDropdownMenu: ForwardRefExoticComponent; export default UserDropdownMenu;