import { default as React } from 'react';
import { RoleTagRole } from '../RoleTag';
import { IconSize } from '../../icons/types';

export interface TopNavigationTab {
    label: string;
    isSelected: boolean;
    onClick?: () => void;
    /** When set, renders the tab as an anchor tag navigating to this URL. */
    href?: string;
    /** Target for the anchor tag, e.g. "_blank". Only used when `href` is set. */
    target?: string;
}
export interface TopNavigationNavItem {
    icon: React.ComponentType<{
        size?: IconSize;
    }>;
    label: string;
    isSelected?: boolean;
    onClick?: () => void;
    /** When set, renders the item as an anchor tag navigating to this URL. */
    href?: string;
    /** Target for the anchor tag, e.g. "_blank". Only used when `href` is set. */
    target?: string;
}
export interface TopNavigationLanguageOption {
    value: string;
    label: string;
}
export interface TopNavigationLabels {
    openMenu?: string;
    closeNavigation?: string;
    language?: string;
    logout?: string;
    navigation?: string;
    linkedAccounts?: string;
}
export interface LinkedAccount {
    id: string;
    name: string;
    role?: RoleTagRole;
    roleLabel?: string;
    avatarSrc?: string;
}
export interface TopNavigationProps {
    /** Logo element rendered on the left. Pass any React node (e.g. an SVG component or <img>). */
    logo?: React.ReactNode;
    /** Optional logo to show on mobile instead of `logo`. When provided, `logo` is shown only on desktop. */
    mobileLogo?: React.ReactNode;
    /** Desktop tab list. Omit or pass empty array to hide tabs. */
    tabs?: TopNavigationTab[];
    /** User display name. Omit to render the before-login state (no user section, no drawer). */
    userName?: string;
    /** User role shown as a RoleTag badge. */
    userRole?: RoleTagRole;
    /** Text displayed inside the role Tag. Defaults to capitalising userRole when omitted. */
    userRoleLabel?: string;
    /** Optional avatar image URL. Falls back to initials when absent. */
    userAvatarSrc?: string;
    /** Called when logout is clicked (both mobile drawer and desktop dropdown). Omit to hide logout. */
    onLogout?: () => void;
    /** Called when the desktop profile dropdown is opened. */
    onProfileDropdownOpen?: () => void;
    /** Accounts linked to the current user (e.g. students linked to a parent). Shown in the dropdown and mobile drawer. */
    linkedAccounts?: LinkedAccount[];
    /** Called when the user selects a linked account to switch to. */
    onSwitchAccount?: (account: LinkedAccount) => void;
    /** Nav items shown in the mobile drawer. */
    navItems?: TopNavigationNavItem[];
    /** Language options shown in the mobile drawer footer. */
    languages?: TopNavigationLanguageOption[];
    selectedLanguage?: string;
    onLanguageChange?: (value: string) => void;
    /** Set to true when the logo is taller than the 64px bar (e.g. the SK bookmark logo) so it aligns to the top and overflows downward instead of being clipped. */
    logoOverflowsBar?: boolean;
    /** Width of the mobile navigation drawer. Defaults to "375px". */
    drawerWidth?: string;
    labels?: TopNavigationLabels;
    className?: string;
}
export declare function TopNavigation({ logo, mobileLogo, tabs, userName, userRole, userRoleLabel, userAvatarSrc, onLogout, onProfileDropdownOpen, linkedAccounts, onSwitchAccount, navItems, languages, selectedLanguage, onLanguageChange, logoOverflowsBar, drawerWidth, labels, className, }: TopNavigationProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=TopNavigation.d.ts.map