A full-featured e-commerce platform with payment integration and inventory management.
"use client";
import { ProjectCard } from "@/registry/new-york-v4/components/project-card";
export function ProjectCardDemo() {
return (
<div className="flex flex-wrap gap-4">
<ProjectCard
title="E-commerce Platform"
description="A full-featured e-commerce platform with payment integration and inventory management."
status="active"
tags={["React", "TypeScript", "Node.js"]}
onViewDetails={() => console.log("View details")}
onEdit={() => console.log("Edit")}
/>
</div>
);
}
pnpm dlx shadcn@latest add https://components.sudarshandhakal.com.np/r/project-card.jsonimport { ProjectCard } from "@/components/project-card"<ProjectCard
title="My Project"
description="Project description goes here"
status="active"
tags={["React", "TypeScript"]}
onViewDetails={() => console.log("View details")}
onEdit={() => console.log("Edit")}
/>The ProjectCard component accepts the following props:
| Prop | Type | Default |
|---|---|---|
| title* | string | — |
| description* | string | — |
| status | "active" | "completed" | "archived" | "active" |
| tags | string[] | [] |
| onViewDetails | () => void | — |
| onEdit | () => void | — |
| variant | "default" | "compact" | "default" |