{"version":3,"sources":["../src/TopNavBar/TopNavBar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Sparkles } from 'lucide-react';\nimport { TopNavItem } from '../TopNavItem';\nimport { SearchGlobal } from '../SearchGlobal';\nimport { Button } from '../Button';\nimport { AvatarLogoLockup } from '../AvatarLogoLockup';\n\nexport interface NavItem {\n  /**\n   * Unique identifier for the nav item\n   */\n  id: string;\n  /**\n   * Display label for the nav item\n   */\n  label: string;\n  /**\n   * Whether this nav item is currently active\n   */\n  active?: boolean;\n}\n\nexport interface TopNavBarProps {\n  /**\n   * School logo image source URL\n   */\n  schoolLogoSrc?: string;\n  /**\n   * Alt text for school logo\n   */\n  schoolLogoAlt?: string;\n  /**\n   * Click handler for school logo\n   */\n  onSchoolLogoClick?: () => void;\n  /**\n   * Array of navigation items\n   */\n  navItems?: NavItem[];\n  /**\n   * Callback when a nav item is clicked\n   */\n  onNavItemClick?: (item: NavItem) => void;\n  /**\n   * Search value\n   */\n  searchValue?: string;\n  /**\n   * Search change handler\n   */\n  onSearchChange?: (value: string) => void;\n  /**\n   * Search submit handler\n   */\n  onSearchSubmit?: (value: string) => void;\n  /**\n   * Search clear handler\n   */\n  onSearchClear?: () => void;\n  /**\n   * Action button label (e.g., \"Ask Arbor\")\n   */\n  actionButtonLabel?: string;\n  /**\n   * Action button click handler\n   */\n  onActionButtonClick?: () => void;\n  /**\n   * Whether to show the action button\n   */\n  showActionButton?: boolean;\n  /**\n   * User avatar image source URL\n   */\n  avatarSrc?: string;\n  /**\n   * User avatar initials (fallback when no image)\n   */\n  avatarInitials?: string;\n  /**\n   * User avatar alt text\n   */\n  avatarAlt?: string;\n  /**\n   * Avatar section click handler\n   */\n  onAvatarClick?: () => void;\n  /**\n   * Logo section click handler\n   */\n  onLogoClick?: () => void;\n  /**\n   * Custom className\n   */\n  className?: string;\n  /**\n   * Custom style\n   */\n  style?: React.CSSProperties;\n}\n\n/**\n * TopNavBar component - Arbor Design System\n *\n * A full-width navigation bar fixed to the top of the page.\n * Contains school logo, navigation items, search, action button, and avatar-logo lockup.\n */\nexport const TopNavBar = React.forwardRef<HTMLElement, TopNavBarProps>(\n  (\n    {\n      schoolLogoSrc,\n      schoolLogoAlt = 'School logo',\n      onSchoolLogoClick,\n      navItems = [],\n      onNavItemClick,\n      searchValue = '',\n      onSearchChange,\n      onSearchSubmit,\n      onSearchClear,\n      actionButtonLabel = 'Ask Arbor',\n      onActionButtonClick,\n      showActionButton = true,\n      avatarSrc,\n      avatarInitials,\n      avatarAlt = 'User avatar',\n      onAvatarClick,\n      onLogoClick,\n      className,\n      style,\n    },\n    ref\n  ) => {\n    const containerStyles: React.CSSProperties = {\n      position: 'fixed',\n      top: 0,\n      left: 0,\n      right: 0,\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      padding: '4px 8px',\n      backgroundColor: '#ffffff',\n      boxShadow: '0px 1px 2px 0px rgba(0, 0, 0, 0.08)',\n      fontFamily: \"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif\",\n      boxSizing: 'border-box',\n      zIndex: 1000,\n      height: '48px',\n      ...style,\n    };\n\n    const leftSectionStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '16px',\n    };\n\n    const schoolLogoContainerStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      width: '64px',\n      height: '40px',\n      backgroundColor: '#ffffff',\n      border: '1px solid #efefef',\n      borderRadius: '8px',\n      overflow: 'hidden',\n      padding: '2px',\n      boxSizing: 'border-box',\n      cursor: onSchoolLogoClick ? 'pointer' : 'default',\n    };\n\n    const schoolLogoImageStyles: React.CSSProperties = {\n      maxWidth: '100%',\n      maxHeight: '100%',\n      objectFit: 'contain',\n    };\n\n    const placeholderStyles: React.CSSProperties = {\n      width: '100%',\n      height: '100%',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      backgroundColor: '#f8f8f8',\n      color: '#949494',\n      fontSize: '10px',\n      fontWeight: 500,\n      textAlign: 'center',\n    };\n\n    const navItemsGroupStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '8px',\n    };\n\n    const rightSectionStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '16px',\n    };\n\n    const actionButtonStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '8px',\n    };\n\n    const SchoolLogoElement = onSchoolLogoClick ? 'button' : 'div';\n\n    return (\n      <nav ref={ref} className={className} style={containerStyles}>\n        {/* Left section: School logo + Nav items */}\n        <div style={leftSectionStyles}>\n          <SchoolLogoElement\n            style={{\n              ...schoolLogoContainerStyles,\n              ...(onSchoolLogoClick ? { outline: 'none', border: '1px solid #efefef' } : {}),\n            }}\n            onClick={onSchoolLogoClick}\n            {...(onSchoolLogoClick ? { type: 'button' } : {})}\n          >\n            {schoolLogoSrc ? (\n              <img\n                src={schoolLogoSrc}\n                alt={schoolLogoAlt}\n                style={schoolLogoImageStyles}\n              />\n            ) : (\n              <div style={placeholderStyles}>Logo</div>\n            )}\n          </SchoolLogoElement>\n\n          <div style={navItemsGroupStyles}>\n            {navItems.map((item) => (\n              <TopNavItem\n                key={item.id}\n                active={item.active}\n                onClick={() => onNavItemClick?.(item)}\n              >\n                {item.label}\n              </TopNavItem>\n            ))}\n          </div>\n        </div>\n\n        {/* Right section: Search + Action button + Avatar-Logo lockup */}\n        <div style={rightSectionStyles}>\n          <SearchGlobal\n            value={searchValue}\n            onChange={onSearchChange}\n            onSubmit={onSearchSubmit}\n            onClear={onSearchClear}\n          />\n\n          {showActionButton && (\n            <Button\n              variant=\"secondary\"\n              size=\"small\"\n              onClick={onActionButtonClick}\n              style={actionButtonStyles}\n            >\n              <Sparkles size={16} strokeWidth={2} />\n              {actionButtonLabel}\n            </Button>\n          )}\n\n          <AvatarLogoLockup\n            avatarSrc={avatarSrc}\n            avatarInitials={avatarInitials}\n            avatarAlt={avatarAlt}\n            onAvatarClick={onAvatarClick}\n            onLogoClick={onLogoClick}\n          />\n        </div>\n      </nav>\n    );\n  }\n);\n\nTopNavBar.displayName = 'TopNavBar';\n"],"mappings":"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","names":[]}