import React from "react";
interface NavItem {
    href: string;
    label: string;
    icon?: React.ReactNode;
}
interface NavProps {
    title: string;
    items: NavItem[];
    logo?: React.ReactNode;
    className?: string;
    variant?: "top" | "sidebar";
    collapsed?: boolean;
    onProfileClick?: () => void;
    onItemClick?: (item: NavItem) => void;
    onToggleCollapse?: () => void;
}
/**
 * Nav component - Navigation bar with two variants: top navigation and sidebar
 *
 * Top variant features:
 * - Sticky top navigation for all screen sizes
 * - Desktop: Title, logo, navigation items, and user avatar all visible
 * - Mobile: Hamburger menu replaces title/logo, user avatar hidden
 * - Uses CSS Grid layout for perfect centering
 * - Left column: Title and optional logo
 * - Center column: Navigation items (perfectly centered)
 * - Right column: User avatar
 * - Sticky positioning at top with z-50 for proper layering
 * - Translucent background with backdrop blur and bottom border
 *
 * Sidebar variant features:
 * - Fixed left positioning with full height
 * - Vertical layout with logo/title at top
 * - Navigation items displayed vertically with optional icons
 * - User profile section at bottom
 * - Supports collapsed state for compact view
 * - Responsive: transforms off-screen on mobile
 *
 * Props:
 * - title: The application or section title
 * - logo: Optional React node for brand logo/icon
 * - items: Navigation items array with optional icons
 * - className: Optional additional CSS classes
 * - variant: "sidebar" (default) or "top"
 * - collapsed: Whether sidebar is collapsed (sidebar variant only)
 * - onProfileClick: Callback for profile interactions
 * - onItemClick: Callback when navigation item is clicked
 * - onToggleCollapse: Callback when collapse toggle is clicked
 */
export declare const Nav: React.FC<NavProps>;
export {};
//# sourceMappingURL=nav.d.ts.map