SPB Git

spb/spboucher.ai Public

spboucher.ai — personal website of Simon-Pierre Boucher.

TypeScript 93.4% HTML 5.5% CSS 1%
1.0 KB · 44 lines tsx
Raw Blame History
1/*2  pill-link.tsx3  spboucher.ai Web4  Author: Simon-Pierre Boucher5  Mail: contact@spboucher.ai6*/78import type { LucideIcon } from "lucide-react";910import { cn } from "@/lib/utils";1112interface PillLinkProps {13  href: string;14  icon?: LucideIcon;15  children: React.ReactNode;16  external?: boolean;17  className?: string;18}1920/** A rounded, chip-style link for documents and resources. */21export function PillLink({22  href,23  icon: Icon,24  children,25  external = true,26  className,27}: PillLinkProps) {28  return (29    <a30      href={href}31      {...(external32        ? { target: "_blank", rel: "noopener noreferrer" }33        : undefined)}34      className={cn(35        "inline-flex items-center gap-1.5 rounded-[0.5rem] border border-foreground/15 bg-card px-3 py-1.5 text-xs font-medium text-foreground/80 shadow-[var(--shadow-soft)] transition-all hover:-translate-y-px hover:border-primary/50 hover:text-primary",36        className,37      )}38    >39      {Icon && <Icon className="h-3.5 w-3.5" aria-hidden="true" />}40      {children}41    </a>42  );43}44