import { StatCardCommunityMomentumScoreboard } from "@/registry/stat-card-community-momentum-scoreboard-five/stat-card-community-momentum-scoreboard-five"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; import { IframeAutoHeight } from "@/app/(dynamic-pages)/(external-dynamic-pages)/ui/(showcase)/iframe-auto-height"; type ComponentProps = React.ComponentPropsWithoutRef< typeof StatCardCommunityMomentumScoreboard >; type KpiCard = NonNullable[number]; type ContributorProfile = NonNullable[number]; type EngagementMetric = NonNullable< ComponentProps["engagementMetrics"] >[number]; type SentimentBadgeConfig = NonNullable< ComponentProps["sentimentBadges"] >[number]; const kpis: KpiCard[] = [ { id: "members", title: "Active members", value: "24,630", delta: "+9.8%", deltaTone: "positive", description: "Daily active accounts across community hubs and private channels.", }, { id: "posts", title: "Posts per day", value: "1,482", delta: "+6.1%", deltaTone: "positive", badgeLabel: "Record high", description: "Includes async rituals, showcase threads, and office hours recaps.", }, ]; const contributors: ContributorProfile[] = [ { id: "avery", name: "Avery Park", role: "Startup founder", initials: "AP", contributions: "Leading async AMA series and growth experiments channel.", delta: "+18%", trendTone: "positive", hoverDescription: "Member since 2021 • Mentors new operators every Friday.", }, { id: "faizal", name: "Faizal Rahman", role: "Product ops", initials: "FR", contributions: "Published weekly ops teardown with 220 comments.", delta: "+12%", trendTone: "positive", hoverDescription: "Hosts monthly roundtable covering internal tooling best practices.", }, { id: "lena", name: "Lena Wu", role: "Education lead", initials: "LW", contributions: "Curated resource bundle for onboarding educators.", delta: "+4%", trendTone: "neutral", }, { id: "josh", name: "Josh Patel", role: "Community strategist", initials: "JP", contributions: "Launched ambassador referral program, 38 new invites.", delta: "+22%", trendTone: "positive", }, { id: "samira", name: "Samira Khan", role: "Content engineer", initials: "SK", contributions: "Moderates #build-in-public with sentiment guardrails.", delta: "Stable", trendTone: "neutral", }, { id: "diego", name: "Diego Flores", role: "Support lead", initials: "DF", contributions: "Closed 76 community escalations with <2h response time.", delta: "+15%", trendTone: "positive", }, { id: "aliya", name: "Aliya Roy", role: "Design advocate", initials: "AR", contributions: "Coordinated UI critique labs with 12 hosts.", delta: "+9%", trendTone: "positive", }, ]; const engagementMetrics: EngagementMetric[] = [ { id: "comments", label: "Comments per post", value: "6.2", delta: "+0.8", description: "Healthy dialog across async rituals and live debriefs.", sentiment: "healthy", }, { id: "time-zone", label: "Global overlap", value: "82%", delta: "+5%", description: "Sessions across APAC and EMEA maintain active conversation windows.", sentiment: "healthy", }, { id: "responses", label: "Responses < 4h", value: "91%", delta: "-2%", description: "Support queue slightly elevated due to new release rollout.", sentiment: "neutral", }, ]; const sentimentBadges: SentimentBadgeConfig[] = [ { id: "healthy", label: "Healthy", description: "Engagement is trending upward with strong contributor velocity.", sentiment: "healthy", }, { id: "watch", label: "Watch", description: "Response time still inside SLA but trending down across APAC nights.", sentiment: "neutral", }, { id: "declining", label: "Declining", description: "Sentiment drop isolated to #support escalations after billing update.", sentiment: "declining", }, ]; const segments = [ { id: "global", label: "Global" }, { id: "apac", label: "APAC" }, { id: "vip", label: "VIP advocates" }, ]; export function StatCardCommunityMomentumScoreboardFiveDemo() { return (

console.info("Share community update")} />

); } export default StatCardCommunityMomentumScoreboardFiveDemo;

Simple