60:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 61:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1bpgyrs5qflhu.js","/_next/static/immutable/chunks/0-6vu2ul1h6ld.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 62:T50d,import { sectionHeader, stats } from "../lib/config" import { ScaleChart } from "./scale-chart" export default function StatsSectionV4() { return (

{sectionHeader.title}{" "} {sectionHeader.subtitle}

{stat.label}: {stat.value}

) } 63:T6e0,"use client" import * as React from "react" import { Bar, ComposedChart, Line, XAxis, YAxis } from "recharts" import { type ChartConfig, ChartContainer } from "@/components/ui/chart" import { cn } from "@/lib/utils" import { CHART_COLOR, weeklyInstalls } from "../lib/config" const chartConfig = { installs: { label: "Installs", color: CHART_COLOR }, } satisfies ChartConfig const peak = Math.max(...weeklyInstalls.map((point) => point.installs)) export function ScaleChart({ className }: { className?: string }) { const gradientId = `ssv4-bars-${React.useId().replace(/:/g, "")}` return ( ) } 64:T540,/** Same neutral gray as the Next.js series in stats-section-v2. */ export const CHART_COLOR = "#888888" export const sectionHeader = { title: "Adoption that compounds.", subtitle: "Every block installed makes the next project faster to ship.", } as const export type Stat = { id: string value: string label: string } export const stats: Stat[] = [ { id: "installs", value: "1.2M", label: "installs this week" }, { id: "projects", value: "48k", label: "projects shipped" }, { id: "blocks", value: "310", label: "blocks and templates" }, { id: "countries", value: "140+", label: "countries building" }, ] export type WeekPoint = { week: number installs: number } const WEEKS = 180 const FINAL_INSTALLS = 1200 const START_INSTALLS = 18 /** Higher values keep the curve flat for longer before it bends upward. */ const GROWTH = 4.2 /** * Weekly installs, in thousands: flat at first, then compounding up to the * 1.2M "installs this week" stat in the final week. */ export const weeklyInstalls: WeekPoint[] = Array.from( { length: WEEKS }, (_, index) => { const t = index / (WEEKS - 1) const curve = (Math.exp(GROWTH * t) - 1) / (Math.exp(GROWTH) - 1) return { week: index + 1, installs: Math.round( START_INSTALLS + (FINAL_INSTALLS - START_INSTALLS) * curve ), } } ) 5f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","recharts",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/recharts","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"recharts"}]]}]}]]}],["$","$L60",null,{"namespace":"@uiception","registryDependencies":["chart"]}]]}],null]}],["$","$L61",null,{"files":[{"path":"registry/new-york/blocks/stats-section-v4/page.tsx","content":"import StatsSectionV4 from \"./components/stats-section-v4\"\n\nexport default function Page() {\n return \n}\n","type":"registry:page","target":"app/stats-section-v4/page.tsx"},{"path":"registry/new-york/blocks/stats-section-v4/components/stats-section-v4.tsx","content":"$62","type":"registry:component","target":"app/stats-section-v4/components/stats-section-v4.tsx"},{"path":"registry/new-york/blocks/stats-section-v4/components/scale-chart.tsx","content":"$63","type":"registry:component","target":"app/stats-section-v4/components/scale-chart.tsx"},{"path":"registry/new-york/blocks/stats-section-v4/lib/config.ts","content":"$64","type":"registry:lib","target":"app/stats-section-v4/lib/config.ts"}],"className":"h-[70svh] min-h-80"}]]}]