import { Star } from "lucide-react"; import React from "react"; import { Avatar, AvatarImage } from "@/components/ui/avatar"; import { Button } from "@/components/ui/button"; interface Hero7Props { heading?: string; description?: string; button?: { text: string; url: string; }; reviews?: { count: number; avatars: { src: string; alt: string; }[]; }; } const Hero7 = ({ heading = "A Collection of Components Built With Shadcn & Tailwind", description = "Finely crafted components built with React, Tailwind and Shadcn UI. Developers can copy and paste these blocks directly into their project.", button = { text: "Discover all components", url: "https://www.shadcnblocks.com", }, reviews = { count: 200, avatars: [ { src: "https://www.shadcnblocks.com/images/block/avatar-1.webp", alt: "Avatar 1", }, { src: "https://www.shadcnblocks.com/images/block/avatar-2.webp", alt: "Avatar 2", }, { src: "https://www.shadcnblocks.com/images/block/avatar-3.webp", alt: "Avatar 3", }, { src: "https://www.shadcnblocks.com/images/block/avatar-4.webp", alt: "Avatar 4", }, { src: "https://www.shadcnblocks.com/images/block/avatar-5.webp", alt: "Avatar 5", }, ], }, }: Hero7Props) => { return (

{heading}

{description}

{reviews.avatars.map((avatar, index) => ( ))}

{[...Array(5)].map((_, index) => ( ))}

from {reviews.count}+ reviews

); }; export { Hero7 };