spb/company-atlas

1import { cn } from '@/lib/cn';2import { MARK_TOKENS, MARK_VIEWBOX, MarkArt, markLevel, type MarkColors } from './mark';34/**5 * The mark as an inline SVG. `plate` follows the theme through the `--brand-*` tokens (dark plate on the light UI,6 * light plate on the dark UI); `mono` draws the globe in `currentColor` with the live node in `--live`, for use inside7 * text. Detail level follows the rendered size so small instances keep thick strokes.8 */9export function LogoMark({ size = 24, className, variant = 'plate', title }: { size?: number; className?: string; variant?: 'plate' | 'mono'; title?: string }) {10  const colors: MarkColors = variant === 'plate' ? MARK_TOKENS : { plate: 'transparent', ink: 'currentColor', grid: 'currentColor', accent: 'var(--live)' };11  return (12    <svg width={size} height={size} viewBox={`0 0 ${MARK_VIEWBOX} ${MARK_VIEWBOX}`} fill="none" className={cn('shrink-0', className)} aria-hidden={title ? undefined : true} role={title ? 'img' : undefined}>13      {title && <title>{title}</title>}14      <MarkArt colors={colors} plate={variant === 'plate'} level={markLevel(size)} />15    </svg>16  );17}1819/** Wordmark only: "Company" regular, "Atlas" semibold, tight tracking — Geist through the UI font stack. */20export function WordmarkText({ className }: { className?: string }) {21  return (22    <span className={cn('whitespace-nowrap tracking-[-0.02em]', className)}>23      <span className="font-normal text-ink-2">Company</span> <span className="font-semibold text-ink">Atlas</span>24    </span>25  );26}2728/** Lockup: mark + wordmark. */29export function Wordmark({ className, markSize = 24, textClassName }: { className?: string; markSize?: number; textClassName?: string }) {30  return (31    <span className={cn('inline-flex items-center gap-2.5 text-ink', className)}>32      <LogoMark size={markSize} />33      <WordmarkText className={cn('text-[17px]', textClassName)} />34    </span>35  );36}3738/** Alias kept for readability at call sites that want the full lockup. */39export const Logo = Wordmark;40