@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/sales/conversion-panel.js

@@ -0,0 +1,59 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AdmLoading, CATEGORY_PALETTE, Panel } from "../_ui";
+import styles from "./sales.module.css";
+const integer = new Intl.NumberFormat("en-US");
+const GROUPS = [
+  "Signed up only",
+  "Activated, no order yet",
+  "Selling, no payout yet",
+  "Paid out"
+];
+function ConversionPanel({
+  activation
+}) {
+  if (!activation) {
+    return /* @__PURE__ */ jsx(Panel, { title: "Conversion", caption: "All time", height: "auto", children: /* @__PURE__ */ jsx(AdmLoading, { label: "Loading conversion\u2026", size: "sm" }) });
+  }
+  const counts = activation.funnel.map((s) => s.count);
+  const total = counts.at(0) ?? 0;
+  const segments = GROUPS.map((label, i) => ({
+    label,
+    color: CATEGORY_PALETTE.at(i) ?? CATEGORY_PALETTE[0],
+    count: Math.max((counts.at(i) ?? 0) - (counts.at(i + 1) ?? 0), 0)
+  }));
+  const share = (n) => total ? Math.round(n / total * 100) : 0;
+  return /* @__PURE__ */ jsxs(Panel, { title: "Conversion", caption: "All time", height: "auto", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: styles.segments,
+        role: "img",
+        "aria-label": "Merchants by furthest stage reached",
+        children: segments.map(
+          (s) => s.count > 0 ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              style: { width: `${share(s.count)}%`, background: s.color }
+            },
+            s.label
+          ) : null
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("ul", { className: styles.legend, children: segments.map((s) => /* @__PURE__ */ jsxs("li", { children: [
+      /* @__PURE__ */ jsx("span", { className: styles.swatch, style: { background: s.color } }),
+      /* @__PURE__ */ jsx("span", { className: styles.legendLabel, children: s.label }),
+      /* @__PURE__ */ jsx("strong", { children: integer.format(s.count) }),
+      /* @__PURE__ */ jsxs("span", { className: styles.legendShare, children: [
+        share(s.count),
+        "%"
+      ] })
+    ] }, s.label)) }),
+    total === 0 && /* @__PURE__ */ jsx("p", { className: styles.note, children: "No businesses yet." })
+  ] });
+}
+export {
+  ConversionPanel
+};
+//# sourceMappingURL=conversion-panel.js.map

package/dist/admin/sales/conversion-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sales/conversion-panel.tsx"],"sourcesContent":["'use client';\n\nimport type { PlatformCockpit } from '@withpotter/lib/admin-api';\nimport { AdmLoading, CATEGORY_PALETTE, Panel } from '../_ui';\nimport styles from './sales.module.css';\n\nconst integer = new Intl.NumberFormat('en-US');\n\n/** Where each merchant stopped, as exclusive groups that sum to the total. */\nconst GROUPS = [\n  'Signed up only',\n  'Activated, no order yet',\n  'Selling, no payout yet',\n  'Paid out',\n];\n\n/**\n * The activation funnel as one segmented bar: every merchant sits in exactly\n * one segment, the furthest stage it has reached. The funnel is close to\n * cumulative, so a segment is the difference between neighbouring stages,\n * floored at zero (a suspended merchant with orders is not \"activated\").\n */\nexport function ConversionPanel({\n  activation,\n}: {\n  activation: PlatformCockpit['activation'];\n}) {\n  if (!activation) {\n    return (\n      <Panel title=\"Conversion\" caption=\"All time\" height=\"auto\">\n        <AdmLoading label=\"Loading conversion…\" size=\"sm\" />\n      </Panel>\n    );\n  }\n\n  const counts = activation.funnel.map((s) => s.count);\n  const total = counts.at(0) ?? 0;\n  const segments = GROUPS.map((label, i) => ({\n    label,\n    color: CATEGORY_PALETTE.at(i) ?? CATEGORY_PALETTE[0],\n    count: Math.max((counts.at(i) ?? 0) - (counts.at(i + 1) ?? 0), 0),\n  }));\n  const share = (n: number) => (total ? Math.round((n / total) * 100) : 0);\n\n  return (\n    <Panel title=\"Conversion\" caption=\"All time\" height=\"auto\">\n      <div\n        className={styles.segments}\n        role=\"img\"\n        aria-label=\"Merchants by furthest stage reached\"\n      >\n        {segments.map((s) =>\n          s.count > 0 ? (\n            <span\n              key={s.label}\n              style={{ width: `${share(s.count)}%`, background: s.color }}\n            />\n          ) : null,\n        )}\n      </div>\n      <ul className={styles.legend}>\n        {segments.map((s) => (\n          <li key={s.label}>\n            <span className={styles.swatch} style={{ background: s.color }} />\n            <span className={styles.legendLabel}>{s.label}</span>\n            <strong>{integer.format(s.count)}</strong>\n            <span className={styles.legendShare}>{share(s.count)}%</span>\n          </li>\n        ))}\n      </ul>\n      {total === 0 && <p className={styles.note}>No businesses yet.</p>}\n    </Panel>\n  );\n}\n"],"mappings":";AA8BQ,cAoCI,YApCJ;AA3BR,SAAS,YAAY,kBAAkB,aAAa;AACpD,OAAO,YAAY;AAEnB,MAAM,UAAU,IAAI,KAAK,aAAa,OAAO;AAG7C,MAAM,SAAS;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAQO,SAAS,gBAAgB;AAAA,EAC9B;AACF,GAEG;AACD,MAAI,CAAC,YAAY;AACf,WACE,oBAAC,SAAM,OAAM,cAAa,SAAQ,YAAW,QAAO,QAClD,8BAAC,cAAW,OAAM,4BAAsB,MAAK,MAAK,GACpD;AAAA,EAEJ;AAEA,QAAM,SAAS,WAAW,OAAO,IAAI,CAAC,MAAM,EAAE,KAAK;AACnD,QAAM,QAAQ,OAAO,GAAG,CAAC,KAAK;AAC9B,QAAM,WAAW,OAAO,IAAI,CAAC,OAAO,OAAO;AAAA,IACzC;AAAA,IACA,OAAO,iBAAiB,GAAG,CAAC,KAAK,iBAAiB,CAAC;AAAA,IACnD,OAAO,KAAK,KAAK,OAAO,GAAG,CAAC,KAAK,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;AAAA,EAClE,EAAE;AACF,QAAM,QAAQ,CAAC,MAAe,QAAQ,KAAK,MAAO,IAAI,QAAS,GAAG,IAAI;AAEtE,SACE,qBAAC,SAAM,OAAM,cAAa,SAAQ,YAAW,QAAO,QAClD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,OAAO;AAAA,QAClB,MAAK;AAAA,QACL,cAAW;AAAA,QAEV,mBAAS;AAAA,UAAI,CAAC,MACb,EAAE,QAAQ,IACR;AAAA,YAAC;AAAA;AAAA,cAEC,OAAO,EAAE,OAAO,GAAG,MAAM,EAAE,KAAK,CAAC,KAAK,YAAY,EAAE,MAAM;AAAA;AAAA,YADrD,EAAE;AAAA,UAET,IACE;AAAA,QACN;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,QAAG,WAAW,OAAO,QACnB,mBAAS,IAAI,CAAC,MACb,qBAAC,QACC;AAAA,0BAAC,UAAK,WAAW,OAAO,QAAQ,OAAO,EAAE,YAAY,EAAE,MAAM,GAAG;AAAA,MAChE,oBAAC,UAAK,WAAW,OAAO,aAAc,YAAE,OAAM;AAAA,MAC9C,oBAAC,YAAQ,kBAAQ,OAAO,EAAE,KAAK,GAAE;AAAA,MACjC,qBAAC,UAAK,WAAW,OAAO,aAAc;AAAA,cAAM,EAAE,KAAK;AAAA,QAAE;AAAA,SAAC;AAAA,SAJ/C,EAAE,KAKX,CACD,GACH;AAAA,IACC,UAAU,KAAK,oBAAC,OAAE,WAAW,OAAO,MAAM,gCAAkB;AAAA,KAC/D;AAEJ;","names":[]}

package/dist/admin/sales/growth-analysis.js

@@ -0,0 +1,78 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { SeriesBreakdown } from "@withpotter/components/charts";
+import { ViewSwitch } from "@withpotter/ui-kit";
+import { AdmLoading, Panel } from "../_ui";
+import { bucketSeries } from "./bucket";
+const GRAINS = [
+  { value: "daily", label: "Daily" },
+  { value: "weekly", label: "Weekly" },
+  { value: "monthly", label: "Monthly" }
+];
+const SERIES = [
+  { key: "merchants", label: "New businesses" },
+  { key: "accounts", label: "New accounts" },
+  { key: "lastActive", label: "Accounts last active" },
+  { key: "orders", label: "Paid orders" }
+];
+const dayFmt = new Intl.DateTimeFormat("en-US", {
+  month: "short",
+  day: "numeric",
+  timeZone: "UTC"
+});
+const monthFmt = new Intl.DateTimeFormat("en-US", {
+  month: "short",
+  year: "2-digit",
+  timeZone: "UTC"
+});
+function GrowthAnalysis({
+  leads,
+  people,
+  trend,
+  caption
+}) {
+  const [grain, setGrain] = useState("daily");
+  const points = useMemo(
+    () => bucketSeries(
+      {
+        merchants: leads?.onboardingSeries,
+        accounts: people?.signupSeries,
+        // Accounts by the day of their latest login, not every login.
+        lastActive: people?.activitySeries,
+        orders: trend?.performanceSeries.map((p) => ({
+          date: p.date,
+          count: p.orders
+        }))
+      },
+      grain
+    ),
+    [leads, people, trend, grain]
+  );
+  const loading = !leads || !people || !trend;
+  return /* @__PURE__ */ jsx(
+    Panel,
+    {
+      title: "Growth analysis",
+      caption,
+      action: /* @__PURE__ */ jsx(ViewSwitch, { options: GRAINS, value: grain, onChange: setGrain }),
+      children: loading ? /* @__PURE__ */ jsx(AdmLoading, { label: "Loading growth analysis\u2026" }) : /* @__PURE__ */ jsx(
+        SeriesBreakdown,
+        {
+          series: SERIES,
+          points,
+          headline: false,
+          dimensionLabel: "Measure",
+          formatDate: (t) => (grain === "monthly" ? monthFmt : dayFmt).format(new Date(t)),
+          exportName: `growth-${grain}`,
+          emptyMessage: "No activity in this period",
+          height: 300
+        }
+      )
+    }
+  );
+}
+export {
+  GrowthAnalysis
+};
+//# sourceMappingURL=growth-analysis.js.map

package/dist/admin/sales/growth-analysis.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sales/growth-analysis.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\nimport { SeriesBreakdown, type BreakdownSeries } from '@withpotter/components/charts';\nimport { ViewSwitch, type ViewOption } from '@withpotter/ui-kit';\nimport type { PlatformCockpit, TenantsAnalytics } from '@withpotter/lib/admin-api';\nimport type { AccountsAnalytics } from '@withpotter/lib/admin-account-types';\nimport { AdmLoading, Panel } from '../_ui';\nimport { bucketSeries, type Grain } from './bucket';\n\nconst GRAINS: ViewOption<Grain>[] = [\n  { value: 'daily', label: 'Daily' },\n  { value: 'weekly', label: 'Weekly' },\n  { value: 'monthly', label: 'Monthly' },\n];\n\nconst SERIES: BreakdownSeries[] = [\n  { key: 'merchants', label: 'New businesses' },\n  { key: 'accounts', label: 'New accounts' },\n  { key: 'lastActive', label: 'Accounts last active' },\n  { key: 'orders', label: 'Paid orders' },\n];\n\nconst dayFmt = new Intl.DateTimeFormat('en-US', {\n  month: 'short',\n  day: 'numeric',\n  timeZone: 'UTC',\n});\nconst monthFmt = new Intl.DateTimeFormat('en-US', {\n  month: 'short',\n  year: '2-digit',\n  timeZone: 'UTC',\n});\n\n/**\n * Growth measures side by side, one line each, with the table under the\n * chart as its legend: click a row to isolate it. Every series is a count\n * over the selected period, summed by day, week or month.\n */\nexport function GrowthAnalysis({\n  leads,\n  people,\n  trend,\n  caption,\n}: {\n  leads: TenantsAnalytics | undefined;\n  people: AccountsAnalytics | undefined;\n  trend: PlatformCockpit['trend'] | undefined;\n  caption: string;\n}) {\n  const [grain, setGrain] = useState<Grain>('daily');\n  const points = useMemo(\n    () =>\n      bucketSeries(\n        {\n          merchants: leads?.onboardingSeries,\n          accounts: people?.signupSeries,\n          // Accounts by the day of their latest login, not every login.\n          lastActive: people?.activitySeries,\n          orders: trend?.performanceSeries.map((p) => ({\n            date: p.date,\n            count: p.orders,\n          })),\n        },\n        grain,\n      ),\n    [leads, people, trend, grain],\n  );\n  const loading = !leads || !people || !trend;\n\n  return (\n    <Panel\n      title=\"Growth analysis\"\n      caption={caption}\n      action={<ViewSwitch options={GRAINS} value={grain} onChange={setGrain} />}\n    >\n      {loading ? (\n        <AdmLoading label=\"Loading growth analysis…\" />\n      ) : (\n        <SeriesBreakdown\n          series={SERIES}\n          points={points}\n          headline={false}\n          dimensionLabel=\"Measure\"\n          formatDate={(t) =>\n            (grain === 'monthly' ? monthFmt : dayFmt).format(new Date(t))\n          }\n          exportName={`growth-${grain}`}\n          emptyMessage=\"No activity in this period\"\n          height={300}\n        />\n      )}\n    </Panel>\n  );\n}\n"],"mappings":";AA0Ec;AAxEd,SAAS,SAAS,gBAAgB;AAClC,SAAS,uBAA6C;AACtD,SAAS,kBAAmC;AAG5C,SAAS,YAAY,aAAa;AAClC,SAAS,oBAAgC;AAEzC,MAAM,SAA8B;AAAA,EAClC,EAAE,OAAO,SAAS,OAAO,QAAQ;AAAA,EACjC,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,EACnC,EAAE,OAAO,WAAW,OAAO,UAAU;AACvC;AAEA,MAAM,SAA4B;AAAA,EAChC,EAAE,KAAK,aAAa,OAAO,iBAAiB;AAAA,EAC5C,EAAE,KAAK,YAAY,OAAO,eAAe;AAAA,EACzC,EAAE,KAAK,cAAc,OAAO,uBAAuB;AAAA,EACnD,EAAE,KAAK,UAAU,OAAO,cAAc;AACxC;AAEA,MAAM,SAAS,IAAI,KAAK,eAAe,SAAS;AAAA,EAC9C,OAAO;AAAA,EACP,KAAK;AAAA,EACL,UAAU;AACZ,CAAC;AACD,MAAM,WAAW,IAAI,KAAK,eAAe,SAAS;AAAA,EAChD,OAAO;AAAA,EACP,MAAM;AAAA,EACN,UAAU;AACZ,CAAC;AAOM,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAgB,OAAO;AACjD,QAAM,SAAS;AAAA,IACb,MACE;AAAA,MACE;AAAA,QACE,WAAW,OAAO;AAAA,QAClB,UAAU,QAAQ;AAAA;AAAA,QAElB,YAAY,QAAQ;AAAA,QACpB,QAAQ,OAAO,kBAAkB,IAAI,CAAC,OAAO;AAAA,UAC3C,MAAM,EAAE;AAAA,UACR,OAAO,EAAE;AAAA,QACX,EAAE;AAAA,MACJ;AAAA,MACA;AAAA,IACF;AAAA,IACF,CAAC,OAAO,QAAQ,OAAO,KAAK;AAAA,EAC9B;AACA,QAAM,UAAU,CAAC,SAAS,CAAC,UAAU,CAAC;AAEtC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA,QAAQ,oBAAC,cAAW,SAAS,QAAQ,OAAO,OAAO,UAAU,UAAU;AAAA,MAEtE,oBACC,oBAAC,cAAW,OAAM,iCAA2B,IAE7C;AAAA,QAAC;AAAA;AAAA,UACC,QAAQ;AAAA,UACR;AAAA,UACA,UAAU;AAAA,UACV,gBAAe;AAAA,UACf,YAAY,CAAC,OACV,UAAU,YAAY,WAAW,QAAQ,OAAO,IAAI,KAAK,CAAC,CAAC;AAAA,UAE9D,YAAY,UAAU,KAAK;AAAA,UAC3B,cAAa;AAAA,UACb,QAAQ;AAAA;AAAA,MACV;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/admin/sales/leads-tab.js

@@ -0,0 +1,134 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { OverflowItem, OverflowMenu, TableRow, Th } from "@withpotter/ui-kit";
+import { StatusPill } from "../audit/status-pill";
+import { toCsv } from "@withpotter/lib/csv";
+import { FilterSearch, Filters } from "../_ui";
+import { WithCountry } from "../_ui/country-label";
+import { ListCard } from "../_ui/list-card";
+import list from "../_ui/list-card.module.css";
+import { LeadDrawer } from "./pipeline/lead-drawer";
+import { SOURCES, STAGE, ago, isStalled } from "./stage-meta";
+import { useDebounced } from "./use-debounced";
+import { useSalesLeads } from "./use-sales";
+const day = (iso) => iso ? new Date(iso).toLocaleDateString("en-GB", {
+  day: "numeric",
+  month: "short",
+  year: "numeric"
+}) : "";
+function download(rows) {
+  const header = [
+    "Business",
+    "Stage",
+    "Owner",
+    "Source",
+    "Setup %",
+    "Last contact",
+    "Next follow-up",
+    "Signed up",
+    "Email",
+    "Phone"
+  ];
+  const body = rows.map((l) => [
+    l.businessName,
+    STAGE[l.stage].label,
+    l.ownerName ?? "",
+    SOURCES[l.source] ?? l.source,
+    l.setupPct === null ? "" : String(l.setupPct),
+    day(l.lastContactAt),
+    day(l.nextFollowUpAt),
+    day(l.createdAt),
+    l.email ?? "",
+    l.phone ?? ""
+  ]);
+  const url = URL.createObjectURL(
+    new Blob([toCsv([header, ...body])], { type: "text/csv" })
+  );
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = "sales-leads.csv";
+  a.click();
+  URL.revokeObjectURL(url);
+}
+function LeadsTab() {
+  const [search, setSearch] = useState("");
+  const [open, setOpen] = useState(null);
+  const settled = useDebounced(search);
+  const { data, isLoading, isError, refetch } = useSalesLeads({
+    search: settled || void 0
+  });
+  const rows = data?.rows ?? [];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ListCard,
+      {
+        title: "Leads",
+        count: rows.length,
+        columns: 7,
+        minWidth: 940,
+        isLoading,
+        isError,
+        onRetry: () => void refetch(),
+        errorTitle: "Failed to load leads.",
+        isEmpty: data?.rows.length === 0,
+        emptyTitle: "No leads found",
+        controls: /* @__PURE__ */ jsxs(Filters, { label: "Filter leads", children: [
+          /* @__PURE__ */ jsx(
+            FilterSearch,
+            {
+              value: search,
+              onChange: setSearch,
+              placeholder: "Search business or email\u2026"
+            }
+          ),
+          /* @__PURE__ */ jsx(OverflowMenu, { label: "Export", children: /* @__PURE__ */ jsx(
+            OverflowItem,
+            {
+              onClick: () => download(rows),
+              disabled: !rows.length,
+              children: "Export CSV"
+            }
+          ) })
+        ] }),
+        head: /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx(Th, { children: "Lead" }),
+          /* @__PURE__ */ jsx(Th, { children: "Stage" }),
+          /* @__PURE__ */ jsx(Th, { children: "Owner" }),
+          /* @__PURE__ */ jsx(Th, { children: "Source" }),
+          /* @__PURE__ */ jsx(Th, { align: "right", children: "Setup" }),
+          /* @__PURE__ */ jsx(Th, { children: "Last contact" }),
+          /* @__PURE__ */ jsx(Th, { children: "Follow-up" })
+        ] }),
+        children: rows.map((l) => /* @__PURE__ */ jsxs(
+          TableRow,
+          {
+            onClick: () => setOpen(l.id),
+            active: l.id === open,
+            children: [
+              /* @__PURE__ */ jsx("td", { className: list.nowrap, children: /* @__PURE__ */ jsx(WithCountry, { country: l.country, code: l.countryCode, children: /* @__PURE__ */ jsx("span", { children: l.businessName }) }) }),
+              /* @__PURE__ */ jsx("td", { className: list.nowrap, children: /* @__PURE__ */ jsx(
+                StatusPill,
+                {
+                  status: isStalled(l) ? "pending" : STAGE[l.stage].badge,
+                  label: isStalled(l) ? `${STAGE[l.stage].label} \xB7 stalled` : STAGE[l.stage].label
+                }
+              ) }),
+              /* @__PURE__ */ jsx("td", { className: `${list.nowrap} ${list.muted}`, children: l.ownerName ?? "No owner" }),
+              /* @__PURE__ */ jsx("td", { className: `${list.nowrap} ${list.muted}`, children: SOURCES[l.source] ?? l.source }),
+              /* @__PURE__ */ jsx("td", { className: list.num, children: l.setupPct === null ? "\u2013" : `${l.setupPct}%` }),
+              /* @__PURE__ */ jsx("td", { className: `${list.nowrap} ${list.muted}`, children: ago(l.lastContactAt) }),
+              /* @__PURE__ */ jsx("td", { className: `${list.nowrap} ${list.muted}`, children: day(l.nextFollowUpAt) || "\u2013" })
+            ]
+          },
+          l.id
+        ))
+      }
+    ),
+    /* @__PURE__ */ jsx(LeadDrawer, { leadId: open, onClose: () => setOpen(null) })
+  ] });
+}
+export {
+  LeadsTab
+};
+//# sourceMappingURL=leads-tab.js.map

package/dist/admin/sales/leads-tab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sales/leads-tab.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { OverflowItem, OverflowMenu, TableRow, Th } from '@withpotter/ui-kit';\nimport { StatusPill } from '../audit/status-pill';\nimport { toCsv } from '@withpotter/lib/csv';\nimport type { SalesLead } from '@withpotter/lib/admin-sales-api';\nimport { FilterSearch, Filters } from '../_ui';\nimport { WithCountry } from '../_ui/country-label';\nimport { ListCard } from '../_ui/list-card';\nimport list from '../_ui/list-card.module.css';\nimport { LeadDrawer } from './pipeline/lead-drawer';\nimport { SOURCES, STAGE, ago, isStalled } from './stage-meta';\nimport { useDebounced } from './use-debounced';\nimport { useSalesLeads } from './use-sales';\n\nconst day = (iso: string | null) =>\n  iso\n    ? new Date(iso).toLocaleDateString('en-GB', {\n        day: 'numeric',\n        month: 'short',\n        year: 'numeric',\n      })\n    : '';\n\nfunction download(rows: SalesLead[]) {\n  const header = [\n    'Business',\n    'Stage',\n    'Owner',\n    'Source',\n    'Setup %',\n    'Last contact',\n    'Next follow-up',\n    'Signed up',\n    'Email',\n    'Phone',\n  ];\n  const body = rows.map((l) => [\n    l.businessName,\n    STAGE[l.stage].label,\n    l.ownerName ?? '',\n    SOURCES[l.source] ?? l.source,\n    l.setupPct === null ? '' : String(l.setupPct),\n    day(l.lastContactAt),\n    day(l.nextFollowUpAt),\n    day(l.createdAt),\n    l.email ?? '',\n    l.phone ?? '',\n  ]);\n  const url = URL.createObjectURL(\n    new Blob([toCsv([header, ...body])], { type: 'text/csv' }),\n  );\n  const a = document.createElement('a');\n\n  a.href = url;\n  a.download = 'sales-leads.csv';\n  a.click();\n  URL.revokeObjectURL(url);\n}\n\n/** Every lead as a row: the same leads as the board, for scanning and export. */\nexport function LeadsTab() {\n  const [search, setSearch] = useState('');\n  const [open, setOpen] = useState<string | null>(null);\n  const settled = useDebounced(search);\n  const { data, isLoading, isError, refetch } = useSalesLeads({\n    search: settled || undefined,\n  });\n  const rows = data?.rows ?? [];\n\n  return (\n    <>\n      <ListCard\n        title=\"Leads\"\n        count={rows.length}\n        columns={7}\n        minWidth={940}\n        isLoading={isLoading}\n        isError={isError}\n        onRetry={() => void refetch()}\n        errorTitle=\"Failed to load leads.\"\n        isEmpty={data?.rows.length === 0}\n        emptyTitle=\"No leads found\"\n        controls={\n          <Filters label=\"Filter leads\">\n            <FilterSearch\n              value={search}\n              onChange={setSearch}\n              placeholder=\"Search business or email…\"\n            />\n            <OverflowMenu label=\"Export\">\n              <OverflowItem\n                onClick={() => download(rows)}\n                disabled={!rows.length}\n              >\n                Export CSV\n              </OverflowItem>\n            </OverflowMenu>\n          </Filters>\n        }\n        head={\n          <tr>\n            <Th>Lead</Th>\n            <Th>Stage</Th>\n            <Th>Owner</Th>\n            <Th>Source</Th>\n            <Th align=\"right\">Setup</Th>\n            <Th>Last contact</Th>\n            <Th>Follow-up</Th>\n          </tr>\n        }\n      >\n        {rows.map((l) => (\n          <TableRow\n            key={l.id}\n            onClick={() => setOpen(l.id)}\n            active={l.id === open}\n          >\n            <td className={list.nowrap}>\n              <WithCountry country={l.country} code={l.countryCode}>\n                <span>{l.businessName}</span>\n              </WithCountry>\n            </td>\n            <td className={list.nowrap}>\n              <StatusPill\n                status={isStalled(l) ? 'pending' : STAGE[l.stage].badge}\n                label={\n                  isStalled(l)\n                    ? `${STAGE[l.stage].label} · stalled`\n                    : STAGE[l.stage].label\n                }\n              />\n            </td>\n            <td className={`${list.nowrap} ${list.muted}`}>\n              {l.ownerName ?? 'No owner'}\n            </td>\n            <td className={`${list.nowrap} ${list.muted}`}>\n              {SOURCES[l.source] ?? l.source}\n            </td>\n            <td className={list.num}>\n              {l.setupPct === null ? '–' : `${l.setupPct}%`}\n            </td>\n            <td className={`${list.nowrap} ${list.muted}`}>\n              {ago(l.lastContactAt)}\n            </td>\n            <td className={`${list.nowrap} ${list.muted}`}>\n              {day(l.nextFollowUpAt) || '–'}\n            </td>\n          </TableRow>\n        ))}\n      </ListCard>\n      <LeadDrawer leadId={open} onClose={() => setOpen(null)} />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/sales/overview-tab.js

@@ -0,0 +1,92 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { TimeSeriesChart } from "@withpotter/components/charts";
+import {
+  Panel,
+  customRange,
+  periodPhrase,
+  rangeFromKey,
+  toTrend
+} from "../_ui";
+import { LoadFailed } from "../audit/load-failed";
+import { Tinted } from "../audit/tinted";
+import {
+  usePlatformAccountsAnalytics,
+  usePlatformCockpit,
+  usePlatformTenantsAnalytics
+} from "../hooks";
+import { ConversionPanel } from "./conversion-panel";
+import { GrowthAnalysis } from "./growth-analysis";
+import { SalesKpis } from "./sales-kpis";
+import { SourcesPanel } from "./sources-panel";
+function SalesOverview({
+  dates
+}) {
+  const { rangeKey, customStart, customEnd, compare } = dates;
+  const range = useMemo(
+    () => rangeKey === "custom" ? customRange(customStart, customEnd) : rangeFromKey(rangeKey),
+    [rangeKey, customStart, customEnd]
+  );
+  const period = { startDate: range.startDate, endDate: range.endDate };
+  const leads = usePlatformTenantsAnalytics(period);
+  const cockpit = usePlatformCockpit(period);
+  const people = usePlatformAccountsAnalytics(period);
+  const failed = [leads, cockpit, people].filter((q) => q.isError);
+  const span = periodPhrase(range);
+  const caption = `${span[0]?.toUpperCase()}${span.slice(1)}`;
+  const leadTrend = useMemo(
+    () => toTrend(leads.data?.onboardingSeries, "count"),
+    [leads.data]
+  );
+  const previousLeadTrend = useMemo(
+    () => toTrend(leads.data?.previousOnboardingSeries, "count"),
+    [leads.data]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    failed.length > 0 && /* @__PURE__ */ jsx(
+      LoadFailed,
+      {
+        message: "Some sales figures could not be loaded.",
+        onRetry: () => failed.forEach((q) => void q.refetch())
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      SalesKpis,
+      {
+        leads: leads.data,
+        activation: cockpit.data?.activation,
+        compare,
+        span
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "adm-grid", children: [
+      /* @__PURE__ */ jsx("div", { className: "adm-span-8", children: /* @__PURE__ */ jsx(Panel, { title: "New leads", caption, children: /* @__PURE__ */ jsx(Tinted, { tone: "brand", children: /* @__PURE__ */ jsx(
+        TimeSeriesChart,
+        {
+          data: leadTrend,
+          compare: compare ? previousLeadTrend : null,
+          compareLabel: `Previous ${span}`,
+          label: "New businesses",
+          emptyMessage: "No sign-ups in this window",
+          height: 284
+        }
+      ) }) }) }),
+      /* @__PURE__ */ jsx("div", { className: "adm-span-4", children: /* @__PURE__ */ jsx(ConversionPanel, { activation: cockpit.data?.activation }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "adm-grid", children: /* @__PURE__ */ jsx("div", { className: "adm-span-12", children: /* @__PURE__ */ jsx(
+      GrowthAnalysis,
+      {
+        leads: leads.data,
+        people: people.data,
+        trend: cockpit.data?.trend,
+        caption
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx("div", { className: "adm-grid", children: /* @__PURE__ */ jsx("div", { className: "adm-span-12", children: /* @__PURE__ */ jsx(SourcesPanel, { providers: people.data?.providerBreakdown }) }) })
+  ] });
+}
+export {
+  SalesOverview
+};
+//# sourceMappingURL=overview-tab.js.map

package/dist/admin/sales/overview-tab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sales/overview-tab.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo } from 'react';\nimport { TimeSeriesChart } from '@withpotter/components/charts';\nimport {\n  Panel,\n  customRange,\n  periodPhrase,\n  rangeFromKey,\n  toTrend,\n  usePersistedDateRange,\n} from '../_ui';\nimport { LoadFailed } from '../audit/load-failed';\nimport { Tinted } from '../audit/tinted';\nimport {\n  usePlatformAccountsAnalytics,\n  usePlatformCockpit,\n  usePlatformTenantsAnalytics,\n} from '../hooks';\nimport { ConversionPanel } from './conversion-panel';\nimport { GrowthAnalysis } from './growth-analysis';\nimport { SalesKpis } from './sales-kpis';\nimport { SourcesPanel } from './sources-panel';\n\n/**\n * Sales: who signed up, where from, and how far each has got toward a first\n * sale. A lead is a new business; conversion is the activation funnel.\n */\nexport function SalesOverview({\n  dates,\n}: {\n  dates: ReturnType<typeof usePersistedDateRange>;\n}) {\n  const { rangeKey, customStart, customEnd, compare } = dates;\n  const range = useMemo(\n    () =>\n      rangeKey === 'custom'\n        ? customRange(customStart, customEnd)\n        : rangeFromKey(rangeKey),\n    [rangeKey, customStart, customEnd],\n  );\n  const period = { startDate: range.startDate, endDate: range.endDate };\n  const leads = usePlatformTenantsAnalytics(period);\n  const cockpit = usePlatformCockpit(period);\n  const people = usePlatformAccountsAnalytics(period);\n  const failed = [leads, cockpit, people].filter((q) => q.isError);\n  const span = periodPhrase(range);\n  const caption = `${span[0]?.toUpperCase()}${span.slice(1)}`;\n\n  const leadTrend = useMemo(\n    () => toTrend(leads.data?.onboardingSeries, 'count'),\n    [leads.data],\n  );\n  const previousLeadTrend = useMemo(\n    () => toTrend(leads.data?.previousOnboardingSeries, 'count'),\n    [leads.data],\n  );\n\n  return (\n    <>\n      {/* A failed source would otherwise leave its panels loading forever. */}\n      {failed.length > 0 && (\n        <LoadFailed\n          message=\"Some sales figures could not be loaded.\"\n          onRetry={() => failed.forEach((q) => void q.refetch())}\n        />\n      )}\n\n      <SalesKpis\n        leads={leads.data}\n        activation={cockpit.data?.activation}\n        compare={compare}\n        span={span}\n      />\n\n      <div className=\"adm-grid\">\n        <div className=\"adm-span-8\">\n          <Panel title=\"New leads\" caption={caption}>\n            <Tinted tone=\"brand\">\n              <TimeSeriesChart\n                data={leadTrend}\n                compare={compare ? previousLeadTrend : null}\n                compareLabel={`Previous ${span}`}\n                label=\"New businesses\"\n                emptyMessage=\"No sign-ups in this window\"\n                height={284}\n              />\n            </Tinted>\n          </Panel>\n        </div>\n        <div className=\"adm-span-4\">\n          <ConversionPanel activation={cockpit.data?.activation} />\n        </div>\n      </div>\n\n      <div className=\"adm-grid\">\n        <div className=\"adm-span-12\">\n          <GrowthAnalysis\n            leads={leads.data}\n            people={people.data}\n            trend={cockpit.data?.trend}\n            caption={caption}\n          />\n        </div>\n      </div>\n\n      <div className=\"adm-grid\">\n        <div className=\"adm-span-12\">\n          <SourcesPanel providers={people.data?.providerBreakdown} />\n        </div>\n      </div>\n    </>\n  );\n}\n"],"mappings":";AA2DI,mBAGI,KAaF,YAhBF;AAzDJ,SAAS,eAAe;AACxB,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AAMtB,SAAS,cAAc;AAAA,EAC5B;AACF,GAEG;AACD,QAAM,EAAE,UAAU,aAAa,WAAW,QAAQ,IAAI;AACtD,QAAM,QAAQ;AAAA,IACZ,MACE,aAAa,WACT,YAAY,aAAa,SAAS,IAClC,aAAa,QAAQ;AAAA,IAC3B,CAAC,UAAU,aAAa,SAAS;AAAA,EACnC;AACA,QAAM,SAAS,EAAE,WAAW,MAAM,WAAW,SAAS,MAAM,QAAQ;AACpE,QAAM,QAAQ,4BAA4B,MAAM;AAChD,QAAM,UAAU,mBAAmB,MAAM;AACzC,QAAM,SAAS,6BAA6B,MAAM;AAClD,QAAM,SAAS,CAAC,OAAO,SAAS,MAAM,EAAE,OAAO,CAAC,MAAM,EAAE,OAAO;AAC/D,QAAM,OAAO,aAAa,KAAK;AAC/B,QAAM,UAAU,GAAG,KAAK,CAAC,GAAG,YAAY,CAAC,GAAG,KAAK,MAAM,CAAC,CAAC;AAEzD,QAAM,YAAY;AAAA,IAChB,MAAM,QAAQ,MAAM,MAAM,kBAAkB,OAAO;AAAA,IACnD,CAAC,MAAM,IAAI;AAAA,EACb;AACA,QAAM,oBAAoB;AAAA,IACxB,MAAM,QAAQ,MAAM,MAAM,0BAA0B,OAAO;AAAA,IAC3D,CAAC,MAAM,IAAI;AAAA,EACb;AAEA,SACE,iCAEG;AAAA,WAAO,SAAS,KACf;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,SAAS,MAAM,OAAO,QAAQ,CAAC,MAAM,KAAK,EAAE,QAAQ,CAAC;AAAA;AAAA,IACvD;AAAA,IAGF;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM;AAAA,QACb,YAAY,QAAQ,MAAM;AAAA,QAC1B;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IAEA,qBAAC,SAAI,WAAU,YACb;AAAA,0BAAC,SAAI,WAAU,cACb,8BAAC,SAAM,OAAM,aAAY,SACvB,8BAAC,UAAO,MAAK,SACX;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS,UAAU,oBAAoB;AAAA,UACvC,cAAc,YAAY,IAAI;AAAA,UAC9B,OAAM;AAAA,UACN,cAAa;AAAA,UACb,QAAQ;AAAA;AAAA,MACV,GACF,GACF,GACF;AAAA,MACA,oBAAC,SAAI,WAAU,cACb,8BAAC,mBAAgB,YAAY,QAAQ,MAAM,YAAY,GACzD;AAAA,OACF;AAAA,IAEA,oBAAC,SAAI,WAAU,YACb,8BAAC,SAAI,WAAU,eACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM;AAAA,QACb,QAAQ,OAAO;AAAA,QACf,OAAO,QAAQ,MAAM;AAAA,QACrB;AAAA;AAAA,IACF,GACF,GACF;AAAA,IAEA,oBAAC,SAAI,WAAU,YACb,8BAAC,SAAI,WAAU,eACb,8BAAC,gBAAa,WAAW,OAAO,MAAM,mBAAmB,GAC3D,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/sales/page.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Suspense } from "react";
+import { SalesWorkspace } from "./sales-workspace";
+function AdminSalesPage() {
+  return /* @__PURE__ */ jsx(Suspense, { children: /* @__PURE__ */ jsx(SalesWorkspace, {}) });
+}
+export {
+  AdminSalesPage as default
+};
+//# sourceMappingURL=page.js.map

package/dist/admin/sales/page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/sales/page.tsx"],"sourcesContent":["'use client';\n\nimport { Suspense } from 'react';\nimport { SalesWorkspace } from './sales-workspace';\n\n/** The period selector reads search params, so the page waits on them. */\nexport default function AdminSalesPage() {\n  return (\n    <Suspense>\n      <SalesWorkspace />\n    </Suspense>\n  );\n}\n"],"mappings":";AASM;AAPN,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAGhB,SAAR,iBAAkC;AACvC,SACE,oBAAC,YACC,8BAAC,kBAAe,GAClB;AAEJ;","names":[]}

package/dist/admin/sales/pipeline/add-lead-dialog.js

@@ -0,0 +1,143 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import {
+  Button,
+  Field,
+  FormDialog,
+  Input,
+  Select,
+  useToast
+} from "@withpotter/ui-kit";
+import { adminSalesApi } from "@withpotter/lib/admin-sales-api";
+import { SOURCES } from "../stage-meta";
+import { useSalesMutation, useSalesOwners } from "../use-sales";
+const SOURCE_OPTIONS = Object.entries(SOURCES).filter(([value]) => value !== "sign_up").map(([value, label]) => ({ value, label }));
+function AddLeadDialog({
+  open,
+  onClose
+}) {
+  const { toast } = useToast();
+  const { data: owners = [] } = useSalesOwners();
+  const [form, setForm] = useState({
+    businessName: "",
+    contactName: "",
+    email: "",
+    phone: "",
+    source: "outbound",
+    ownerAdminId: ""
+  });
+  const create = useSalesMutation(adminSalesApi.create, "Lead not added");
+  const set = (key) => (value) => setForm((f) => ({ ...f, [key]: value }));
+  const opt = (v) => v.trim() || void 0;
+  const save = async () => {
+    try {
+      await create.mutateAsync([
+        {
+          businessName: form.businessName.trim(),
+          contactName: opt(form.contactName),
+          email: opt(form.email),
+          phone: opt(form.phone),
+          source: form.source,
+          ownerAdminId: form.ownerAdminId || void 0
+        }
+      ]);
+    } catch {
+      return;
+    }
+    toast({ title: `${form.businessName.trim()} added` });
+    setForm((f) => ({
+      ...f,
+      businessName: "",
+      contactName: "",
+      email: "",
+      phone: ""
+    }));
+    onClose();
+  };
+  return /* @__PURE__ */ jsx(
+    FormDialog,
+    {
+      open,
+      title: "Add a lead",
+      description: "For a business that hasn't signed up yet.",
+      onClose,
+      footer: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onClose, children: "Cancel" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            loading: create.isPending,
+            disabled: form.businessName.trim().length < 2,
+            onClick: () => void save(),
+            children: "Add lead"
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Business name",
+            value: form.businessName,
+            onChange: (e) => set("businessName")(e.target.value),
+            maxLength: 200
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Contact name",
+            value: form.contactName,
+            onChange: (e) => set("contactName")(e.target.value),
+            maxLength: 200
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Email",
+            type: "email",
+            value: form.email,
+            onChange: (e) => set("email")(e.target.value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: "Phone",
+            type: "tel",
+            value: form.phone,
+            onChange: (e) => set("phone")(e.target.value),
+            maxLength: 40
+          }
+        ),
+        /* @__PURE__ */ jsx(Field, { label: "Source", children: /* @__PURE__ */ jsx(
+          Select,
+          {
+            value: form.source,
+            onChange: set("source"),
+            options: SOURCE_OPTIONS,
+            ariaLabel: "Source"
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Field, { label: "Owner", children: /* @__PURE__ */ jsx(
+          Select,
+          {
+            value: form.ownerAdminId,
+            onChange: set("ownerAdminId"),
+            options: [
+              { value: "", label: "Me" },
+              ...owners.map((o) => ({ value: o.id, label: o.name ?? o.email }))
+            ],
+            ariaLabel: "Owner"
+          }
+        ) })
+      ] })
+    }
+  );
+}
+export {
+  AddLeadDialog
+};
+//# sourceMappingURL=add-lead-dialog.js.map

package/dist/admin/sales/pipeline/add-lead-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/sales/pipeline/add-lead-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport {\n  Button,\n  Field,\n  FormDialog,\n  Input,\n  Select,\n  useToast,\n} from '@withpotter/ui-kit';\nimport { adminSalesApi } from '@withpotter/lib/admin-sales-api';\nimport { SOURCES } from '../stage-meta';\nimport { useSalesMutation, useSalesOwners } from '../use-sales';\n\nconst SOURCE_OPTIONS = Object.entries(SOURCES)\n  .filter(([value]) => value !== 'sign_up')\n  .map(([value, label]) => ({ value, label }));\n\n/** An outbound prospect who has not signed up yet. */\nexport function AddLeadDialog({\n  open,\n  onClose,\n}: {\n  open: boolean;\n  onClose: () => void;\n}) {\n  const { toast } = useToast();\n  const { data: owners = [] } = useSalesOwners();\n  const [form, setForm] = useState({\n    businessName: '',\n    contactName: '',\n    email: '',\n    phone: '',\n    source: 'outbound',\n    ownerAdminId: '',\n  });\n  const create = useSalesMutation(adminSalesApi.create, 'Lead not added');\n  const set = (key: keyof typeof form) => (value: string) =>\n    setForm((f) => ({ ...f, [key]: value }));\n  const opt = (v: string) => v.trim() || undefined;\n\n  const save = async () => {\n    try {\n      await create.mutateAsync([\n        {\n          businessName: form.businessName.trim(),\n          contactName: opt(form.contactName),\n          email: opt(form.email),\n          phone: opt(form.phone),\n          source: form.source,\n          ownerAdminId: form.ownerAdminId || undefined,\n        },\n      ]);\n    } catch {\n      return;\n    }\n\n    toast({ title: `${form.businessName.trim()} added` });\n    setForm((f) => ({\n      ...f,\n      businessName: '',\n      contactName: '',\n      email: '',\n      phone: '',\n    }));\n    onClose();\n  };\n\n  return (\n    <FormDialog\n      open={open}\n      title=\"Add a lead\"\n      description=\"For a business that hasn't signed up yet.\"\n      onClose={onClose}\n      footer={\n        <>\n          <Button variant=\"secondary\" onClick={onClose}>\n            Cancel\n          </Button>\n          <Button\n            loading={create.isPending}\n            disabled={form.businessName.trim().length < 2}\n            onClick={() => void save()}\n          >\n            Add lead\n          </Button>\n        </>\n      }\n    >\n      <div className=\"flex flex-col gap-4\">\n        <Input\n          label=\"Business name\"\n          value={form.businessName}\n          onChange={(e) => set('businessName')(e.target.value)}\n          maxLength={200}\n        />\n        <Input\n          label=\"Contact name\"\n          value={form.contactName}\n          onChange={(e) => set('contactName')(e.target.value)}\n          maxLength={200}\n        />\n        <Input\n          label=\"Email\"\n          type=\"email\"\n          value={form.email}\n          onChange={(e) => set('email')(e.target.value)}\n        />\n        <Input\n          label=\"Phone\"\n          type=\"tel\"\n          value={form.phone}\n          onChange={(e) => set('phone')(e.target.value)}\n          maxLength={40}\n        />\n        <Field label=\"Source\">\n          <Select\n            value={form.source}\n            onChange={set('source')}\n            options={SOURCE_OPTIONS}\n            ariaLabel=\"Source\"\n          />\n        </Field>\n        <Field label=\"Owner\">\n          <Select\n            value={form.ownerAdminId}\n            onChange={set('ownerAdminId')}\n            options={[\n              { value: '', label: 'Me' },\n              ...owners.map((o) => ({ value: o.id, label: o.name ?? o.email })),\n            ]}\n            ariaLabel=\"Owner\"\n          />\n        </Field>\n      </div>\n    </FormDialog>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/sales/pipeline/lead-card.js

@@ -0,0 +1,44 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { WithCountry } from "../../_ui/country-label";
+import { ago, daysSince, isStalled } from "../stage-meta";
+import styles from "./pipeline.module.css";
+function LeadCard({
+  lead,
+  selected,
+  onOpen
+}) {
+  const stalled = isStalled(lead);
+  const next = lead.stage === "first_sale" ? `Sold \xB7 ${ago(lead.stageChangedAt)}` : lead.setupPct !== null && lead.stage !== "new" ? `Setup ${lead.setupPct}%` : `Contact ${ago(lead.lastContactAt)}`;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: styles.card,
+      "data-selected": selected ? "" : void 0,
+      "data-stalled": stalled ? "" : void 0,
+      onClick: onOpen,
+      children: [
+        /* @__PURE__ */ jsx(
+          WithCountry,
+          {
+            className: styles.cardName,
+            country: lead.country,
+            code: lead.countryCode,
+            children: /* @__PURE__ */ jsx("span", { children: lead.businessName })
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: styles.cardMeta, children: [
+          daysSince(lead.stageChangedAt) ?? 0,
+          "d \xB7 ",
+          lead.ownerName ?? "No owner"
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: stalled ? styles.cardStalled : styles.cardMeta, children: stalled ? `Stalled ${daysSince(lead.lastContactAt ?? lead.stageChangedAt)}d` : next })
+      ]
+    }
+  );
+}
+export {
+  LeadCard
+};
+//# sourceMappingURL=lead-card.js.map

package/dist/admin/sales/pipeline/lead-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/admin/sales/pipeline/lead-card.tsx"],"sourcesContent":["'use client';\n\nimport type { SalesLead } from '@withpotter/lib/admin-sales-api';\nimport { WithCountry } from '../../_ui/country-label';\nimport { ago, daysSince, isStalled } from '../stage-meta';\nimport styles from './pipeline.module.css';\n\n/**\n * One lead on the board: who, how long in this stage, who owns it, and the\n * one fact that says what to do next. Amber edge = no contact for 14 days.\n */\nexport function LeadCard({\n  lead,\n  selected,\n  onOpen,\n}: {\n  lead: SalesLead;\n  selected: boolean;\n  onOpen: () => void;\n}) {\n  const stalled = isStalled(lead);\n  const next =\n    lead.stage === 'first_sale'\n      ? `Sold · ${ago(lead.stageChangedAt)}`\n      : lead.setupPct !== null && lead.stage !== 'new'\n        ? `Setup ${lead.setupPct}%`\n        : `Contact ${ago(lead.lastContactAt)}`;\n\n  return (\n    <button\n      type=\"button\"\n      className={styles.card}\n      data-selected={selected ? '' : undefined}\n      data-stalled={stalled ? '' : undefined}\n      onClick={onOpen}\n    >\n      <WithCountry\n        className={styles.cardName}\n        country={lead.country}\n        code={lead.countryCode}\n      >\n        <span>{lead.businessName}</span>\n      </WithCountry>\n      <span className={styles.cardMeta}>\n        {daysSince(lead.stageChangedAt) ?? 0}d · {lead.ownerName ?? 'No owner'}\n      </span>\n      <span className={stalled ? styles.cardStalled : styles.cardMeta}>\n        {stalled\n          ? `Stalled ${daysSince(lead.lastContactAt ?? lead.stageChangedAt)}d`\n          : next}\n      </span>\n    </button>\n  );\n}\n"],"mappings":";AAyCQ,cAEF,YAFE;AAtCR,SAAS,mBAAmB;AAC5B,SAAS,KAAK,WAAW,iBAAiB;AAC1C,OAAO,YAAY;AAMZ,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,UAAU,UAAU,IAAI;AAC9B,QAAM,OACJ,KAAK,UAAU,eACX,aAAU,IAAI,KAAK,cAAc,CAAC,KAClC,KAAK,aAAa,QAAQ,KAAK,UAAU,QACvC,SAAS,KAAK,QAAQ,MACtB,WAAW,IAAI,KAAK,aAAa,CAAC;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,OAAO;AAAA,MAClB,iBAAe,WAAW,KAAK;AAAA,MAC/B,gBAAc,UAAU,KAAK;AAAA,MAC7B,SAAS;AAAA,MAET;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,OAAO;AAAA,YAClB,SAAS,KAAK;AAAA,YACd,MAAM,KAAK;AAAA,YAEX,8BAAC,UAAM,eAAK,cAAa;AAAA;AAAA,QAC3B;AAAA,QACA,qBAAC,UAAK,WAAW,OAAO,UACrB;AAAA,oBAAU,KAAK,cAAc,KAAK;AAAA,UAAE;AAAA,UAAK,KAAK,aAAa;AAAA,WAC9D;AAAA,QACA,oBAAC,UAAK,WAAW,UAAU,OAAO,cAAc,OAAO,UACpD,oBACG,WAAW,UAAU,KAAK,iBAAiB,KAAK,cAAc,CAAC,MAC/D,MACN;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}