"use client"; import { Building, Globe, type LucideIcon, Users } from "lucide-react"; import { Badge } from "@/components/ui/badge"; import { cn } from "@/lib/utils"; interface StatItem { label: string; value: string; } interface OrganizationItem { id?: string; name: string; location: string; icon?: LucideIcon; } interface Education99Props { badge?: { label: string; variant?: "default" | "secondary" | "outline" }; heading?: string; description?: string; stats?: StatItem[]; organizations?: OrganizationItem[]; className?: string; } export const education99Demo: Education99Props = { badge: { label: "Global Network", variant: "secondary" }, heading: "International Partnerships", description: "We collaborate with leading institutions worldwide, providing students with global learning opportunities.", stats: [ { label: "Countries", value: "45+" }, { label: "Partner Institutions", value: "150+" }, { label: "Annual Exchanges", value: "500+" }, ], organizations: [ { id: "1", name: "University of Oxford", location: "United Kingdom", icon: Building, }, { id: "2", name: "Technical University of Munich", location: "Germany", icon: Building, }, { id: "3", name: "National University of Singapore", location: "Singapore", icon: Building, }, { id: "4", name: "ETH Zurich", location: "Switzerland", icon: Globe, }, { id: "5", name: "CERN", location: "Switzerland", icon: Globe, }, { id: "6", name: "Microsoft Research", location: "United States", icon: Users, }, ], }; export function Education99({ badge, heading, description, stats = [], organizations = [], className, }: Education99Props) { const count = organizations.length; const columnCount = count >= 5 ? 3 : count % 4 === 0 ? 4 : count % 3 === 0 ? 3 : 2; const gridCols = columnCount === 4 ? "lg:grid-cols-" : columnCount === 3 ? "lg:grid-cols-3" : "lg:grid-cols-2"; return (

{badge && ( {badge.label} )} {heading && (

{heading}

)} {description && (

{description}

)}

{stats.length > 0 && (

{stats.map((stat, i) => (

{stat.value}

{stat.label}

))}

)} {organizations.length > 0 && (

{organizations.map((org) => { const Icon = org.icon || Building; return (

{org.name}

{org.location}

); })}

)}

); }

Marketing - Partners Blocks

Select an Item to view its code