@asgardeo/react
Version:
React implementation of Asgardeo JavaScript SDK.
89 lines (88 loc) • 2.66 kB
TypeScript
/**
* Copyright (c) 2025, 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 { FC, ReactElement, ReactNode } from 'react';
interface MenuItem {
href?: string;
icon?: ReactNode;
label: ReactNode;
onClick?: () => void;
}
export interface BaseUserDropdownProps {
/**
* Mapping of component attribute names to identity provider field names.
* Allows customizing which user profile fields should be used for each attribute.
*/
attributeMapping?: {
[key: string]: string | string[] | undefined;
firstName?: string | string[];
lastName?: string | string[];
picture?: string | string[];
username?: string | string[];
};
/**
* Optional size for the avatar
*/
avatarSize?: number;
/**
* Optional className for the dropdown container.
*/
className?: string;
/**
* Optional element to render when no user is signed in.
*/
fallback?: ReactElement;
/**
* Whether the user data is currently loading
*/
isLoading?: boolean;
/**
* Menu items to display in the dropdown
*/
menuItems?: MenuItem[];
/**
* Callback function for "Manage Profile" action
*/
onManageProfile?: () => void;
/**
* Callback function for "Sign Out" action
*/
onSignOut?: () => void;
/**
* The HTML element ID where the portal should be mounted
*/
portalId?: string;
/**
* Show dropdown header with user information
*/
showDropdownHeader?: boolean;
/**
* Show user's display name next to avatar in the trigger button
*/
showTriggerLabel?: boolean;
/**
* The user object containing profile information
*/
user: any;
}
/**
* BaseUserDropdown component displays a user avatar with a dropdown menu.
* When clicked, it shows a popover with customizable menu items.
* This component serves as the base for framework-specific implementations.
*/
export declare const BaseUserDropdown: FC<BaseUserDropdownProps>;
export default BaseUserDropdown;