Lose it gracefully

"use client";
import { LoseGracefully } from "@/components/ui/notchset/blocks/lose-gracefully";

const money = (v: number) => `$${Math.round(v).toLocaleString("en-US")}`;

export default function LoseGracefullyDemo() {
  return (
    <LoseGracefully
      title="Open in Q4"
      reasons={["Budget", "Timing", "Competitor", "No decision"]}
      format={money}
      className="w-full max-w-[480px]"
      deals={[
        { id: "l1", company: "Sentry", color: "#362d59", title: "Annual platform", value: 96000 },
        { id: "l2", company: "Revolut", color: "#191c1f", title: "Rollout · 3 regions", value: 271000 },
        { id: "l3", company: "Dropbox", color: "#0061ff", title: "Team seats", value: 48000 },
        { id: "l4", company: "Webflow", color: "#146ef5", title: "Enterprise · 2-year", value: 215000 },
      ]}
    />
  );
}