{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "influencer-campaign-card", "title": "Influencer Campaign Card", "type": "registry:block", "files": [ { "path": "packages/registry-react/blocks/influencer-campaign-card/InfluencerCampaignCard.tsx", "content": "'use client'\n\nimport * as React from 'react'\nimport {\n BadgeCheck,\n Check,\n Clock,\n Copy,\n DollarSign,\n ExternalLink,\n Eye,\n FileText,\n Mail,\n MessageSquare,\n Play,\n Share2,\n Target,\n TrendingUp,\n Users,\n Video,\n} from 'lucide-react'\nimport { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Progress } from '@/components/ui/progress'\nimport { Separator } from '@/components/ui/separator'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport { cn } from '@/lib/utils'\n\nexport interface InfluencerCampaignCardProps {\n className?: string\n}\n\nexport function InfluencerCampaignCard({ className }: InfluencerCampaignCardProps) {\n const [copiedCode, setCopiedCode] = React.useState(false)\n const [copiedLink, setCopiedLink] = React.useState(false)\n\n const copyCode = () => {\n navigator.clipboard?.writeText('ALEX20')\n setCopiedCode(true)\n setTimeout(() => {\n setCopiedCode(false)\n }, 2000)\n }\n\n const copyLink = () => {\n navigator.clipboard?.writeText('https://uipkge.dev/c/alex20')\n setCopiedLink(true)\n setTimeout(() => {\n setCopiedLink(false)\n }, 2000)\n }\n\n return (\n
\n {/* 1. Creator Hero Header Card */}\n \n \n \n
\n
\n
\n \n \n AR\n \n \n \n \n
\n\n
\n
\n

\n Alex Rivera · Tech & Design Creator\n

\n \n \n Active Campaign · Q3 Launch\n \n
\n\n {/* Channel Handles */}\n
\n
\n \n @alextech\n (450k)\n
\n
\n \n @alextech\n (120k)\n
\n
\n
\n
\n\n {/* Niche Tags */}\n
\n \n Developer Tools\n \n \n Hardware\n \n \n Productivity\n \n
\n
\n
\n\n {/* Actions */}\n
\n \n \n \n
\n
\n \n \n\n {/* 2. 4 Campaign Telemetry Cards */}\n
\n {/* Reach */}\n \n \n
\n Total Reach\n
\n \n
\n
\n
\n
850,000
\n

850,000 cross-platform reach

\n
\n
\n \n 3 Channels\n \n +18.4% YoY\n
\n \n \n\n {/* Avg Engagement Rate */}\n \n \n
\n Avg Engagement\n
\n \n
\n
\n
\n
5.8%
\n

Across YouTube & Twitter

\n
\n
\n \n vs 2.4% industry benchmark\n \n
\n \n \n\n {/* Contract Value & Fee */}\n \n \n
\n Contract Value\n
\n \n
\n
\n
\n
$6,500.00
\n

$6,500.00 Fixed + 10% Affiliate

\n
\n
\n \n Escrow Funded\n \n 50% Disbursed\n
\n \n \n\n {/* Campaign ROI / Conversions */}\n \n \n
\n Campaign ROI\n
\n \n
\n
\n
\n
2.8x ROAS
\n

428 signups · $18,400 ARR generated

\n
\n
\n \n 14.2% CVR\n \n $43.00 CPA\n
\n \n \n
\n\n {/* 3. Contract Deliverables Checklist */}\n \n \n
\n Contract Deliverables\n \n Deliverables status, review workflows, and live audience performance.\n \n
\n
\n
\n \n Progress: 2 of 4 Completed\n \n (50%)\n
\n \n
\n \n \n
\n \n \n \n Deliverable & Scope\n Status\n Live Performance\n Timeline\n Action\n \n \n \n {/* Deliverable 1 */}\n \n \n
\n
\n \n
\n
\n

Dedicated YouTube Review Video

\n

10-12 min dedicated review + bio affiliate link

\n
\n
\n \n \n \n \n Completed\n \n \n \n
\n

48k views · 4.2k likes

\n

312 comments · 8.4% CTR

\n
\n \n \n Live Aug 15, 2026\n \n \n \n \n \n\n {/* Deliverable 2 */}\n \n \n
\n
\n \n
\n
\n

Twitter / X Launch Thread

\n

8-part technical breakdown with demo clips

\n
\n
\n \n \n \n \n Completed\n \n \n \n
\n

180 retweets · 1.2k bookmarks

\n

22.4k impressions

\n
\n \n \n Live Aug 18, 2026\n \n \n \n \n \n\n {/* Deliverable 3 */}\n \n \n
\n
\n
\n
\n

TikTok Short & Instagram Reel

\n

\n 60s vertical workflow demo highlighting UI speed\n

\n
\n
\n \n \n \n \n Draft Pending Approval\n \n \n \n
\n

v2 cut ready for approval

\n

1080x1920 60fps · 58s

\n
\n \n \n \n Due Aug 28, 2026\n \n \n \n \n \n \n\n {/* Deliverable 4 */}\n \n \n
\n
\n \n
\n
\n

Newsletter Feature Sponsorship

\n

\n Sponsored lead editorial placement + logo banner\n

\n
\n
\n \n \n \n \n Scheduled\n \n \n \n
\n

Estimated 65,000 readers

\n

48% historical open rate

\n
\n \n \n Sep 02, 2026\n \n \n \n \n \n \n
\n
\n \n \n\n {/* 4. Affiliate Link & Promo Code Performance Card */}\n \n \n Affiliate Link & Promo Code Performance\n \n Real-time redemption tracking, attribution metrics, and affiliate commission balance.\n \n \n \n
\n {/* Left: Code & Link Controls */}\n
\n
\n {/* Promo Code */}\n
\n
\n Promo Code (20% Discount)\n Active\n
\n
\n
\n ALEX20\n 20% off\n
\n \n
\n
\n\n \n\n {/* Referral Link */}\n
\n
\n Referral Campaign URL\n 14.2% CVR\n
\n
\n
\n https://uipkge.dev/c/alex20\n
\n \n
\n
\n
\n
\n\n {/* Right: Telemetry & Commission Stats */}\n
\n
\n
\n Redemptions\n

428

\n

+32 this week

\n
\n
\n Commission Earned\n

$2,140.00

\n

10% standard fee

\n
\n
\n Gross Revenue\n

$21,400.00

\n

$50.00 AOV

\n
\n
\n\n {/* Milestone Progress Bar */}\n
\n
\n \n Commission Milestone: 428 / 500 redemptions\n \n 85.6% to 15% rate boost\n
\n \n
\n\n {/* Payout Schedule notice */}\n
\n
\n \n \n Next payout: $2,140.00 via\n Stripe Connect\n \n
\n Sep 15, 2026\n
\n
\n
\n \n \n
\n )\n}\n", "type": "registry:block", "target": "~/components/blocks/InfluencerCampaignCard.tsx" } ], "dependencies": [ "lucide-react" ], "devDependencies": [], "registryDependencies": [ "https://uipkge.dev/r/react/avatar.json", "https://uipkge.dev/r/react/badge.json", "https://uipkge.dev/r/react/button.json", "https://uipkge.dev/r/react/card.json", "https://uipkge.dev/r/react/progress.json", "https://uipkge.dev/r/react/separator.json", "https://uipkge.dev/r/react/table.json" ], "description": "Creator partnership management card with verified creator hero profile, multi-channel reach demographics, 4-column campaign telemetry HUD, contract deliverables checklist with live asset telemetry, and affiliate promo code ROI tracker.", "categories": [ "marketing", "dashboard", "app" ] }