@asgardeo/react/dist/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.d.ts

React implementation of Asgardeo JavaScript SDK.

/**
 * 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;
}
/**
 * Interface for organization data.
 */
export interface Organization {
    /**
     * Avatar URL for the organization.
     */
    avatar?: string;
    /**
     * Unique identifier for the organization.
     */
    id: string;
    /**
     * Number of members in the organization.
     */
    memberCount?: number;
    /**
     * Additional metadata for the organization.
     */
    metadata?: Record<string, any>;
    /**
     * Display name of the organization.
     */
    name: string;
    /**
     * User's role in the organization.
     */
    role?: 'owner' | 'admin' | 'member';
    /**
     * URL slug for the organization.
     */
    slug?: string;
}
/**
 * Props interface for the BaseOrganizationSwitcher component.
 */
export interface BaseOrganizationSwitcherProps {
    /**
     * Optional size for the avatar
     */
    avatarSize?: number;
    /**
     * Custom class name for styling.
     */
    className?: string;
    /**
     * Currently selected organization.
     */
    currentOrganization?: Organization;
    /**
     * Error message to display.
     */
    error?: string;
    /**
     * Optional element to render when no organization is selected.
     */
    fallback?: ReactElement;
    /**
     * Whether the component is in a loading state.
     */
    loading?: boolean;
    /**
     * Additional menu items to display at the bottom of the dropdown.
     */
    menuItems?: MenuItem[];
    /**
     * Handler for when an organization is selected.
     */
    onOrganizationSwitch: (organization: Organization) => void;
    /**
     * Handler for when the manage profile button is clicked.
     */
    onManageProfile?: () => void;
    /**
     * List of available organizations.
     */
    organizations: Organization[];
    /**
     * The HTML element ID where the portal should be mounted
     */
    portalId?: string;
    /**
     * Custom render function for the error state.
     */
    renderError?: (error: string) => ReactElement;
    /**
     * Custom render function for the loading state.
     */
    renderLoading?: () => ReactElement;
    /**
     * Custom render function for the organization item.
     */
    renderOrganization?: (organization: Organization, isSelected: boolean) => ReactElement;
    /**
     * Whether to show the member count.
     */
    showMemberCount?: boolean;
    /**
     * Whether to show the role badge.
     */
    showRole?: boolean;
    /**
     * Show organization name next to avatar in the trigger button
     */
    showTriggerLabel?: boolean;
    /**
     * Custom styles for the component.
     */
    style?: React.CSSProperties;
}
/**
 * BaseOrganizationSwitcher component displays an organization selector with a dropdown menu.
 * When clicked, it shows a popover with available organizations to switch between.
 * This component serves as the base for framework-specific implementations.
 */
export declare const BaseOrganizationSwitcher: FC<BaseOrganizationSwitcherProps>;
export default BaseOrganizationSwitcher;