48:I[675842,["/_next/static/chunks/3zk55npp9bf01.js","/_next/static/chunks/2m96g8z-gzh5d.js","/_next/static/chunks/2tex7xqe6exb2.js","/_next/static/chunks/1jm_pez57pooq.js","/_next/static/chunks/0y1un64j9cb_a.js","/_next/static/chunks/2t6aypjr7f6ts.js","/_next/static/chunks/192xv5ywvi9q4.js","/_next/static/chunks/3no31har91fnf.js","/_next/static/chunks/0_hsj6z42s46y.js","/_next/static/chunks/12i-to1x7rnyj.js","/_next/static/chunks/2wn6uqhj_7ar8.js","/_next/static/chunks/3wqx9rnz4o85e.js","/_next/static/chunks/3rvimhctlr4-r.js","/_next/static/chunks/35-b1h7oww7qw.js","/_next/static/chunks/2bwoeqry9sic1.js","/_next/static/chunks/22u5elh2-mv5w.js","/_next/static/chunks/2vzpfrswgjwkl.js","/_next/static/chunks/2qrdos7bay7xd.js","/_next/static/chunks/0dt0oxoji-6hg.js","/_next/static/chunks/0d26i-0pkwn3k.js","/_next/static/chunks/2myjm193pixht.js","/_next/static/chunks/3q0zcxtc9uq80.js","/_next/static/chunks/09pml84d4uoeh.js","/_next/static/chunks/2vrutmv-0m63u.js","/_next/static/chunks/3cdlx-tm7hyuq.js","/_next/static/chunks/2o-etke09ul30.js","/_next/static/chunks/183sa5pnnpvuj.js","/_next/static/chunks/3glue-gkerdj1.js","/_next/static/chunks/1lbxnxsq8ee8s.js","/_next/static/chunks/3dd99gw9mu-sf.js","/_next/static/chunks/1444rm47mh_mb.js","/_next/static/chunks/33_57fwl6a7_5.js","/_next/static/chunks/093uq_2nhv539.js","/_next/static/chunks/15riy05640d19.js","/_next/static/chunks/41-6ljd4yej5g.js","/_next/static/chunks/37fo5w4-gmeoz.js","/_next/static/chunks/0zf4ggrq52j6j.js","/_next/static/chunks/2d368ijh14dyh.js","/_next/static/chunks/24kcfhkyal62-.js","/_next/static/chunks/3nfyvi11gk9tz.js"],"CopyButton"] 4a:I[18486,["/_next/static/chunks/3zk55npp9bf01.js","/_next/static/chunks/2m96g8z-gzh5d.js","/_next/static/chunks/2tex7xqe6exb2.js","/_next/static/chunks/1jm_pez57pooq.js","/_next/static/chunks/0y1un64j9cb_a.js","/_next/static/chunks/2t6aypjr7f6ts.js","/_next/static/chunks/192xv5ywvi9q4.js","/_next/static/chunks/3no31har91fnf.js","/_next/static/chunks/0_hsj6z42s46y.js","/_next/static/chunks/12i-to1x7rnyj.js","/_next/static/chunks/2wn6uqhj_7ar8.js","/_next/static/chunks/3wqx9rnz4o85e.js","/_next/static/chunks/3rvimhctlr4-r.js","/_next/static/chunks/35-b1h7oww7qw.js","/_next/static/chunks/2bwoeqry9sic1.js","/_next/static/chunks/22u5elh2-mv5w.js","/_next/static/chunks/2vzpfrswgjwkl.js","/_next/static/chunks/2qrdos7bay7xd.js","/_next/static/chunks/0dt0oxoji-6hg.js","/_next/static/chunks/0d26i-0pkwn3k.js","/_next/static/chunks/2myjm193pixht.js","/_next/static/chunks/3q0zcxtc9uq80.js","/_next/static/chunks/09pml84d4uoeh.js","/_next/static/chunks/2vrutmv-0m63u.js","/_next/static/chunks/3cdlx-tm7hyuq.js","/_next/static/chunks/2o-etke09ul30.js","/_next/static/chunks/183sa5pnnpvuj.js","/_next/static/chunks/3glue-gkerdj1.js","/_next/static/chunks/1lbxnxsq8ee8s.js","/_next/static/chunks/3dd99gw9mu-sf.js","/_next/static/chunks/1444rm47mh_mb.js","/_next/static/chunks/33_57fwl6a7_5.js","/_next/static/chunks/093uq_2nhv539.js","/_next/static/chunks/15riy05640d19.js","/_next/static/chunks/41-6ljd4yej5g.js","/_next/static/chunks/37fo5w4-gmeoz.js","/_next/static/chunks/0zf4ggrq52j6j.js","/_next/static/chunks/2d368ijh14dyh.js","/_next/static/chunks/24kcfhkyal62-.js","/_next/static/chunks/3nfyvi11gk9tz.js"],"ExpandableCode"] 49:T760,"use client"; import { ConversionFunnel } from "@/components/premium/conversion-funnel"; export function ConversionFunnelPreview() { return ( ); } 4b:T3609,

"use client";

import { ConversionFunnel } from "@/components/premium/conversion-funnel";

export function ConversionFunnelPreview() {
  return (
    <ConversionFunnel
      periods={[
        {
          id: "week",
          label: "7 days",
          stages: [
            {
              id: "visits",
              label: "Visitors",
              value: 12840,
              detail: "Unique people who visited your website.",
            },
            {
              id: "signup",
              label: "Sign-ups",
              value: 6420,
              detail: "Visitors who created a workspace.",
            },
            {
              id: "active",
              label: "Activated",
              value: 3852,
              detail: "Workspaces that completed their first project.",
            },
            {
              id: "paid",
              label: "Customers",
              value: 1541,
              detail: "Activated workspaces that chose a paid plan.",
            },
          ],
        },
        {
          id: "month",
          label: "30 days",
          stages: [
            {
              id: "visits",
              label: "Visitors",
              value: 52680,
              detail: "Unique people who visited your website.",
            },
            {
              id: "signup",
              label: "Sign-ups",
              value: 23706,
              detail: "Visitors who created a workspace.",
            },
            {
              id: "active",
              label: "Activated",
              value: 14224,
              detail: "Workspaces that completed their first project.",
            },
            {
              id: "paid",
              label: "Customers",
              value: 5932,
              detail: "Activated workspaces that chose a paid plan.",
            },
          ],
        },
      ]}
    />
  );
}

46:["$","div",null,{"className":"group relative overflow-hidden rounded-xl border border-(--color-border) bg-(--color-bg-elev) font-mono text-[13px]","children":[["$","div",null,{"className":"flex items-center justify-between gap-3 border-b border-(--color-border) bg-(--color-bg)/60 px-4 py-2.5","children":[["$","div",null,{"className":"flex min-w-0 items-center gap-2 text-xs","children":[["$","span",null,{"className":"inline-flex h-5 shrink-0 items-center rounded border border-(--color-border) bg-(--color-bg-elev) px-1.5 font-mono font-semibold text-[10px] text-(--color-fg-muted) uppercase tracking-wider","children":"TSX"}],["$","$L3a",null,{"ref":"$undefined","iconNode":[["path",{"d":"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z","key":"1oefj6"}],["path",{"d":"M14 2v5a1 1 0 0 0 1 1h5","key":"wfsgrz"}]],"className":"lucide-file size-3.5 shrink-0 text-(--color-fg-muted)"}],["$","span",null,{"className":"truncate font-mono text-(--color-fg-muted)","children":[["$","span",null,{"className":"opacity-60","children":["components/previews/premium","/"]}],["$","span",null,{"className":"font-medium text-(--color-fg)","children":"conversion-funnel-preview.tsx"}]]}]]}],["$","$L48",null,{"text":"$49","eventName":"copy_code","eventParams":{"filename":"components/previews/premium/conversion-funnel-preview.tsx","lang":"tsx"}}]]}],["$","$L4a",null,{"children":["$","div",null,{"className":"relative px-0 py-4 text-[13px] leading-relaxed [&_pre]:!bg-transparent [&_pre]:!p-0 [&_pre]:w-max [&_pre]:min-w-full [&_code]:font-mono [&_code]:text-[13px] [&_.shiki]:bg-transparent [&_.shiki]:text-[var(--shiki-light)] dark:[&_.shiki]:text-[var(--shiki-dark)] [&_.shiki_span]:text-[var(--shiki-light)] dark:[&_.shiki_span]:text-[var(--shiki-dark)] [&_.line]:px-5 [&_.highlighted]:border-blue-500 [&_.highlighted]:border-l-2 [&_.highlighted]:bg-(--color-fg)/[0.07] [&_.highlighted]:!pl-[18px] [&_.diff.add]:border-green-500 [&_.diff.add]:border-l-2 [&_.diff.add]:bg-green-500/10 [&_.diff.add]:!pl-[18px] [&_.diff.remove]:border-red-500 [&_.diff.remove]:border-l-2 [&_.diff.remove]:bg-red-500/10 [&_.diff.remove]:!pl-[18px] [&_.focused]:opacity-100 [&_pre:has(.focused)_.line:not(.focused)]:opacity-30 [&_pre:has(.focused)_.line:not(.focused)]:transition-opacity","dangerouslySetInnerHTML":{"__html":"$4b"}}]}]]}]

Conversion Funnel

Conversion Funnel

Install