4e: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/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.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"] 4f: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/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.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"] 50:T6c5,import { Button } from "@/components/ui/button"; import { CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, } from "@/components/ui/empty"; import { DashboardCard } from "@/components/dashboard-card"; export function BillingHealth() { return ( Billing health Nothing urgent needs your attention. You're caught up. Balances and payouts look fine. nothing overdue in this snapshot. ); } 51:T136d,"use client"; import { useId } from "react"; import { CartesianGrid, Line, LineChart, XAxis } from "recharts"; import { formatDate } from "@/lib/formater"; import { CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent, } from "@/components/ui/chart"; import { Delta, DeltaIcon, DeltaValue } from "@/components/delta"; import { DashboardCard } from "@/components/dashboard-card"; const VISIBLE_DAYS = 7; /** One row per day: ISO `date`, `retail` / `online` = sales counts (units sold). */ type ChannelSalesChartRow = { date: string; retail: number; online: number; }; /** * Demo Data. */ const chartData: ChannelSalesChartRow[] = [ { date: "2026-03-15", retail: 198, online: 96 }, { date: "2026-03-16", retail: 176, online: 82 }, { date: "2026-03-17", retail: 184, online: 88 }, { date: "2026-03-18", retail: 170, online: 80 }, { date: "2026-03-19", retail: 188, online: 90 }, { date: "2026-03-20", retail: 180, online: 85 }, { date: "2026-03-21", retail: 192, online: 92 }, { date: "2026-03-22", retail: 172, online: 78 }, { date: "2026-03-23", retail: 166, online: 74 }, { date: "2026-03-24", retail: 174, online: 79 }, { date: "2026-03-25", retail: 158, online: 72 }, { date: "2026-03-26", retail: 168, online: 76 }, { date: "2026-03-27", retail: 152, online: 70 }, { date: "2026-03-28", retail: 160, online: 74 }, { date: "2026-03-29", retail: 146, online: 68 }, { date: "2026-03-30", retail: 154, online: 71 }, { date: "2026-03-31", retail: 142, online: 65 }, { date: "2026-04-01", retail: 140, online: 63 }, { date: "2026-04-02", retail: 132, online: 59 }, { date: "2026-04-03", retail: 124, online: 56 }, { date: "2026-04-04", retail: 128, online: 58 }, { date: "2026-04-05", retail: 116, online: 52 }, { date: "2026-04-06", retail: 84, online: 40 }, { date: "2026-04-07", retail: 82, online: 38 }, { date: "2026-04-08", retail: 96, online: 46 }, { date: "2026-04-09", retail: 92, online: 69 }, { date: "2026-04-10", retail: 96, online: 62 }, { date: "2026-04-11", retail: 112, online: 75 }, { date: "2026-04-12", retail: 101, online: 77 }, { date: "2026-04-13", retail: 112, online: 78 }, ]; /** Most recent daily rows shown in the chart. */ const chartRows = chartData.slice(-VISIBLE_DAYS); function rowTotal(row: ChannelSalesChartRow) { return row.retail + row.online; } function growthPctForWindow(rows: readonly ChannelSalesChartRow[]) { const first = rows[0]; if (!first) { return 0; } const last = rows.at(-1); if (!last) { return 0; } const a = rowTotal(first); const b = rowTotal(last); if (!a) { return 0; } return ((b - a) / a) * 100; } const growthPctNum = growthPctForWindow(chartRows); const chartConfig = { retail: { label: "Retail", color: "var(--chart-2)", }, online: { label: "Online", color: "var(--chart-1)", }, } satisfies ChartConfig; export function ChannelSalesChart() { const chartUid = useId().replace(/:/g, ""); const idLineGlow = `channel-sales-line-glow-${chartUid}`; return (

Channel sales

Daily sales count by channel, last {VISIBLE_DAYS} days.

formatDate(String(value), "day-month")} tickLine={false} tickMargin={8} /> } cursor={false} /> ); } 52:T84b,import { CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { DashboardCard } from "@/components/dashboard-card"; const items = [ { title: "Invoice #1045 marked paid", time: "About 2 hours ago", icon: ( ), }, { title: "Jordan joined the team", time: "This morning", icon: ( ), }, { title: "Weekly summary exported", time: "Yesterday", icon: ( ), }, { title: "Dashboard v2 shipped to prod", time: "2 days ago", icon: ( ), }, ] as const; export function DashboardActivity() { return ( Activity Latest updates in your workspace.

{item.title}

{item.time}

); } 53:T9c6,"use client"; import { Button } from "@/components/ui/button"; import { CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { Table, TableBody, TableCaption, TableCell, TableHead, TableHeader, TableRow, } from "@/components/ui/table"; import { DashboardCard } from "@/components/dashboard-card"; const invoices = [ { id: "1045", customer: "Northwind Labs", amount: "$2,400.00", status: "Paid", }, { id: "1044", customer: "Blue River Co.", amount: "$890.00", status: "Pending", }, { id: "1043", customer: "Oak Street Studio", amount: "$5,120.00", status: "Paid", }, { id: "1042", customer: "Harbor Freight LLC", amount: "$310.50", status: "Overdue", }, ] as const; export function DashboardInvoices() { return ( Recent invoices Open amounts and payment status. Recent invoices with customer, amount, and status. Customer Invoice Amount {invoices.map((inv) => ( {inv.customer} #{inv.id} {inv.amount} ))}

); } 54:Tb3e,"use client"; import type * as React from "react"; import { Bar, BarChart, XAxis } from "recharts"; import { CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card"; import { type ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent, } from "@/components/ui/chart"; import { Delta, DeltaIcon, DeltaValue } from "@/components/delta"; import { DashboardCard } from "@/components/dashboard-card"; /** Demo: last 7 days. */ const salesDaily7 = [ { day: "Mon", sales: 3200 }, { day: "Tue", sales: 3001 }, { day: "Wed", sales: 3780 }, { day: "Thu", sales: 4100 }, { day: "Fri", sales: 4520 }, { day: "Sat", sales: 4004 }, { day: "Sun", sales: 5340 }, ] as const; const chartRows = salesDaily7.map((row) => ({ ...row })); const firstDay = salesDaily7[0].sales; const lastDay = salesDaily7.at(-1)?.sales ?? firstDay; const growthPct = (((lastDay - firstDay) / firstDay) * 100).toFixed(1); const chartConfig = { sales: { label: "Sales", color: "var(--chart-2)", }, } satisfies ChartConfig; function CustomGradientBar( props: React.SVGProps & { index?: number; dataKey?: string | number; } ) { const { fill, x = 0, y = 0, width = 0, height = 0, dataKey = "sales", index = 0, } = props; const gid = `gradient-bar-${String(dataKey)}-${index}`; return ( <> ); } export function NetRevenueChart() { return (

Net revenue

Daily net sales, last 7 days. String(value)} tickLine={false} tickMargin={10} /> } cursor={false} /> } /> ); } 55:T535,import { CardContent, CardFooter, CardHeader, CardTitle, } from "@/components/ui/card"; import { Delta, DeltaIcon, DeltaValue } from "@/components/delta"; import { DashboardCard } from "@/components/dashboard-card"; type Stat = { label: string; value: string; delta: number; }; const stats: Stat[] = [ { label: "Active users", value: "847", delta: 3.1, }, { label: "Revenue", value: "$18,290", delta: 12.4, }, { label: "Conversion Rate", value: "3.28%", delta: -0.4, }, { label: "New signups", value: "142", delta: 8.7, }, ] as const; export function DashboardStats() { return ( <> {stats.map((s) => ( {s.label}

{s.value}

vs last week{" "} ))} ); } 56:T13a3,"use client"; import { cn } from "@/lib/utils"; import * as React from "react"; import { Badge } from "@/components/ui/badge"; type DeltaIconVariant = "default" | "trend" | "arrow"; type DeltaVariant = "default" | "badge"; type DeltaContextValue = { value: number; }; const DeltaContext = React.createContext(null); function useDeltaValue() { const context = React.useContext(DeltaContext); if (!context) { throw new Error( "DeltaIcon and DeltaValue must be used inside a `Delta` component." ); } return context.value; } function Delta({ className, value, variant = "default", ...props }: React.ComponentProps<"div"> & { value: number; variant?: DeltaVariant; }) { return ( {variant === "badge" ? ( 0 ? "bg-emerald-500/10 text-emerald-500" : "bg-red-500/10 text-red-500", className )} data-slot="delta" variant="secondary" {...(props as React.ComponentProps)} /> ) : (

0 ? "text-emerald-600 dark:text-emerald-400" : "", value < 0 ? "text-rose-600 dark:text-rose-400" : "", className )} data-slot="delta" {...props} /> )} ); } function FilledShell({ value, children, }: { value: number; children: React.ReactNode; }) { return ( 0 && "bg-emerald-500", value < 0 && "bg-red-500", (!value || value === 0) && "bg-muted-foreground" )} data-slot="delta-icon" > {children} ); } function DeltaIcon({ variant = "default", filled = false, className, ...props }: Omit, "fill"> & { variant?: DeltaIconVariant; filled?: boolean; }) { const resolvedValue = useDeltaValue(); const mergedClassName = cn(className); const shell = (node: React.ReactElement) => filled ? {node} : node; const slotProps = filled ? {} : { "data-slot": "delta-icon" as const }; if (!resolvedValue || resolvedValue === 0) { return shell( ); } if (resolvedValue > 0) { if (variant === "trend") { return shell( ); } if (variant === "arrow") { return shell( ); } return shell( ); } if (variant === "trend") { return shell( ); } if (variant === "arrow") { return shell( ); } return shell( ); } function DeltaValue({ className, precision = 1, suffix = "%", absolute = true, ...props }: React.ComponentProps<"span"> & { precision?: number; suffix?: string; absolute?: boolean; }) { const resolvedValue = useDeltaValue(); const formattedValue = ( absolute ? Math.abs(resolvedValue) : resolvedValue ).toFixed(precision); return ( {formattedValue} {suffix} ); } export { Delta, DeltaIcon, DeltaValue }; 4d:["$","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":[null,["$","$L4e",null,{"namespace":"@efferd","registryDependencies":["badge","button","card","chart","empty","table","@efferd/app-shell-2","@efferd/formater"]}]]}],null]}],["$","$L4f",null,{"files":[{"path":"registry/blocks/dashboard/2/billing-health.tsx","content":"$50","type":"registry:component"},{"path":"registry/blocks/dashboard/2/channel-sales-chart.tsx","content":"$51","type":"registry:component"},{"path":"registry/blocks/dashboard/2/dashboard-activity.tsx","content":"$52","type":"registry:component"},{"path":"registry/blocks/dashboard/2/dashboard-card.tsx","content":"import { cn } from \"@/lib/utils\";\nimport type * as React from \"react\";\nimport { Card } from \"@/components/ui/card\";\n\nexport function DashboardCard({\n\tclassName,\n\t...props\n}: React.ComponentProps) {\n\treturn (\n\t\t\n\t);\n}\n","type":"registry:component"},{"path":"registry/blocks/dashboard/2/dashboard-invoices.tsx","content":"$53","type":"registry:component"},{"path":"registry/blocks/dashboard/2/dashboard.tsx","content":"import { BillingHealth } from \"@/components/billing-health\";\nimport { ChannelSalesChart } from \"@/components/channel-sales-chart\";\nimport { DashboardActivity } from \"@/components/dashboard-activity\";\nimport { DashboardInvoices } from \"@/components/dashboard-invoices\";\nimport { NetRevenueChart } from \"@/components/net-revenue-chart\";\nimport { DashboardStats } from \"@/components/stats\";\n\nexport function Dashboard() {\n\treturn (\n\t\t

\n\t\t\t\n\t\t\t\n\t\t\t\n\t\t\t\n\t\t\t\n\t\t\t\n\t\t

\n\t);\n}\n","type":"registry:component"},{"path":"registry/blocks/dashboard/2/net-revenue-chart.tsx","content":"$54","type":"registry:component"},{"path":"registry/blocks/dashboard/2/stats.tsx","content":"$55","type":"registry:component"},{"path":"registry/blocks/dashboard/delta.tsx","content":"$56","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]