@withpotter/pages-admin 0.13.0-next.101

package/dist/admin/newsletters/retry-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/retry-selection.ts"],"sourcesContent":["import type { Delivery } from '@withpotter/lib/admin-newsletter-deliveries-api';\n\ntype Row = Pick<Delivery, 'id' | 'status'>;\n\n/** The most rows one retry request may name. */\nexport const RETRY_LIMIT = 500;\n\n/** Only a failed row can be sent again, so only a failed row can be ticked. */\nexport const canRetry = (row: Row) => row.status === 'failed';\n\n/** The ids on this page that can be ticked. */\nexport const retryableIds = (rows: Row[]) =>\n  rows.filter(canRetry).map((row) => row.id);\n\nexport function toggleOne(selected: ReadonlySet<string>, id: string) {\n  const next = new Set(selected);\n\n  if (!next.delete(id)) next.add(id);\n\n  return next;\n}\n\n/** The header box: ticks every failed row on the page, or clears them all. */\nexport function togglePage(selected: ReadonlySet<string>, rows: Row[]) {\n  const ids = retryableIds(rows);\n  const next = new Set(selected);\n  const all = ids.length > 0 && ids.every((id) => next.has(id));\n\n  for (const id of ids) {\n    if (all) next.delete(id);\n    else next.add(id);\n  }\n\n  return next;\n}\n\n/** How the header box reads against the rows on this page. */\nexport function pageState(selected: ReadonlySet<string>, rows: Row[]) {\n  const ids = retryableIds(rows);\n  const ticked = ids.filter((id) => selected.has(id)).length;\n\n  return {\n    selectable: ids.length > 0,\n    all: ids.length > 0 && ticked === ids.length,\n    some: ticked > 0 && ticked < ids.length,\n  };\n}\n\n/**\n * What a retry of the ticked rows sends. A row on screen that has stopped\n * being failed since it was ticked is dropped; a ticked row on another page\n * is kept, and the API ignores it if it is no longer failed.\n */\nexport function idsToRetry(selected: ReadonlySet<string>, rows: Row[]) {\n  const settled = new Set(\n    rows.filter((row) => !canRetry(row)).map((row) => row.id),\n  );\n\n  return [...selected].filter((id) => !settled.has(id)).slice(0, RETRY_LIMIT);\n}\n\n/** \"Retry 3 selected\". */\nexport const retryLabel = (n: number) =>\n  `Retry ${new Intl.NumberFormat('en').format(n)} selected`;\n"],"mappings":"AAKO,MAAM,cAAc;AAGpB,MAAM,WAAW,CAAC,QAAa,IAAI,WAAW;AAG9C,MAAM,eAAe,CAAC,SAC3B,KAAK,OAAO,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,EAAE;AAEpC,SAAS,UAAU,UAA+B,IAAY;AACnE,QAAM,OAAO,IAAI,IAAI,QAAQ;AAE7B,MAAI,CAAC,KAAK,OAAO,EAAE,EAAG,MAAK,IAAI,EAAE;AAEjC,SAAO;AACT;AAGO,SAAS,WAAW,UAA+B,MAAa;AACrE,QAAM,MAAM,aAAa,IAAI;AAC7B,QAAM,OAAO,IAAI,IAAI,QAAQ;AAC7B,QAAM,MAAM,IAAI,SAAS,KAAK,IAAI,MAAM,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;AAE5D,aAAW,MAAM,KAAK;AACpB,QAAI,IAAK,MAAK,OAAO,EAAE;AAAA,QAClB,MAAK,IAAI,EAAE;AAAA,EAClB;AAEA,SAAO;AACT;AAGO,SAAS,UAAU,UAA+B,MAAa;AACpE,QAAM,MAAM,aAAa,IAAI;AAC7B,QAAM,SAAS,IAAI,OAAO,CAAC,OAAO,SAAS,IAAI,EAAE,CAAC,EAAE;AAEpD,SAAO;AAAA,IACL,YAAY,IAAI,SAAS;AAAA,IACzB,KAAK,IAAI,SAAS,KAAK,WAAW,IAAI;AAAA,IACtC,MAAM,SAAS,KAAK,SAAS,IAAI;AAAA,EACnC;AACF;AAOO,SAAS,WAAW,UAA+B,MAAa;AACrE,QAAM,UAAU,IAAI;AAAA,IAClB,KAAK,OAAO,CAAC,QAAQ,CAAC,SAAS,GAAG,CAAC,EAAE,IAAI,CAAC,QAAQ,IAAI,EAAE;AAAA,EAC1D;AAEA,SAAO,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,OAAO,CAAC,QAAQ,IAAI,EAAE,CAAC,EAAE,MAAM,GAAG,WAAW;AAC5E;AAGO,MAAM,aAAa,CAAC,MACzB,SAAS,IAAI,KAAK,aAAa,IAAI,EAAE,OAAO,CAAC,CAAC;","names":[]}

package/dist/admin/newsletters/review-dialog.js

@@ -0,0 +1,95 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Banner, Button, FormDialog, Input, Skeleton } from "@withpotter/ui-kit";
+import { titleOf } from "./labels";
+import { findProblems } from "./problems";
+import { leftOffLine, recipientsLine, sendLabel } from "./sending";
+import { chosenSignature, signedLine } from "./signatures";
+import { useAudience } from "./use-newsletters";
+import { useSignatures } from "./use-signatures";
+const WORD = "SEND";
+function ReviewDialog({
+  open,
+  draft,
+  carried,
+  send,
+  onClose
+}) {
+  const [typed, setTyped] = useState("");
+  const [refused, setRefused] = useState([]);
+  const audience = useAudience(open);
+  const { data: signatures = [] } = useSignatures();
+  const signature = chosenSignature(draft.signatureId, signatures, carried);
+  const found = findProblems(draft);
+  const problems = [
+    ...found.map((p) => `${p.field}: ${p.message}`),
+    ...refused
+  ];
+  const nobody = audience.data?.recipients === 0;
+  const ready = Boolean(audience.data) && !nobody && found.length === 0 && typed === WORD;
+  const close = () => {
+    setTyped("");
+    setRefused([]);
+    onClose();
+  };
+  const submit = async () => {
+    const stopped = await send.sendToAll();
+    if (stopped.length) setRefused(stopped);
+    else close();
+  };
+  return /* @__PURE__ */ jsx(
+    FormDialog,
+    {
+      open,
+      title: "Review and send",
+      onClose: close,
+      footer: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: close, children: "Cancel" }),
+        /* @__PURE__ */ jsx(Button, { disabled: !ready, loading: send.sending, onClick: submit, children: audience.data ? sendLabel(audience.data) : "Send" })
+      ] }),
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-tertiary)]", children: "Subject" }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[var(--text-primary)]", children: titleOf(draft) }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--text-secondary)]", children: signedLine(signature) })
+        ] }),
+        audience.isError ? /* @__PURE__ */ jsx(
+          Banner,
+          {
+            tone: "error",
+            title: "The recipient count did not load",
+            action: /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "sm",
+                variant: "secondary",
+                onClick: () => void audience.refetch(),
+                children: "Try again"
+              }
+            )
+          }
+        ) : audience.data ? /* @__PURE__ */ jsxs("div", { className: "text-sm", children: [
+          /* @__PURE__ */ jsx("p", { className: "font-medium text-[var(--text-primary)]", children: recipientsLine(audience.data) }),
+          /* @__PURE__ */ jsx("p", { className: "text-[var(--text-secondary)]", children: leftOffLine(audience.data.skipped) })
+        ] }) : /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-2/3" }),
+        audience.data?.mode === "admins_only" && /* @__PURE__ */ jsx(Banner, { tone: "info", children: "This environment only sends to admin addresses. No merchants will receive it." }),
+        problems.length > 0 && /* @__PURE__ */ jsx(Banner, { tone: "error", title: "Fix these before sending", children: /* @__PURE__ */ jsx("ul", { className: "list-disc pl-4", children: problems.map((line) => /* @__PURE__ */ jsx("li", { children: line }, line)) }) }),
+        nobody ? /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--text-secondary)]", children: "There is no one to send to, so this cannot be sent." }) : /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: `Type ${WORD} to confirm`,
+            value: typed,
+            autoComplete: "off",
+            spellCheck: false,
+            onChange: (e) => setTyped(e.target.value)
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  ReviewDialog
+};
+//# sourceMappingURL=review-dialog.js.map

package/dist/admin/newsletters/review-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/review-dialog.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Banner, Button, FormDialog, Input, Skeleton } from '@withpotter/ui-kit';\nimport type { NewsletterSignature } from '@withpotter/lib/admin-newsletters-api';\nimport type { EditorDraft } from './content';\nimport { titleOf } from './labels';\nimport { findProblems } from './problems';\nimport { leftOffLine, recipientsLine, sendLabel } from './sending';\nimport { chosenSignature, signedLine } from './signatures';\nimport { useAudience } from './use-newsletters';\nimport type { SendActions } from './use-send-actions';\nimport { useSignatures } from './use-signatures';\n\nconst WORD = 'SEND';\n\n/**\n * The last look before a newsletter goes to everyone: who gets it, who is\n * left off, anything that would stop it, and a typed confirmation.\n */\nexport function ReviewDialog({\n  open,\n  draft,\n  carried,\n  send,\n  onClose,\n}: {\n  open: boolean;\n  draft: EditorDraft;\n  /** The signature the saved newsletter carries. */\n  carried: NewsletterSignature | null;\n  send: SendActions;\n  onClose: () => void;\n}) {\n  const [typed, setTyped] = useState('');\n  const [refused, setRefused] = useState<string[]>([]);\n  const audience = useAudience(open);\n  const { data: signatures = [] } = useSignatures();\n  const signature = chosenSignature(draft.signatureId, signatures, carried);\n  const found = findProblems(draft);\n  const problems = [\n    ...found.map((p) => `${p.field}: ${p.message}`),\n    ...refused,\n  ];\n  const nobody = audience.data?.recipients === 0;\n  const ready =\n    Boolean(audience.data) && !nobody && found.length === 0 && typed === WORD;\n  const close = () => {\n    setTyped('');\n    setRefused([]);\n    onClose();\n  };\n  const submit = async () => {\n    const stopped = await send.sendToAll();\n\n    if (stopped.length) setRefused(stopped);\n    else close();\n  };\n\n  return (\n    <FormDialog\n      open={open}\n      title=\"Review and send\"\n      onClose={close}\n      footer={\n        <>\n          <Button variant=\"secondary\" onClick={close}>\n            Cancel\n          </Button>\n          <Button disabled={!ready} loading={send.sending} onClick={submit}>\n            {audience.data ? sendLabel(audience.data) : 'Send'}\n          </Button>\n        </>\n      }\n    >\n      <div className=\"flex flex-col gap-4\">\n        <div>\n          <p className=\"text-xs text-[var(--text-tertiary)]\">Subject</p>\n          <p className=\"text-sm font-medium text-[var(--text-primary)]\">\n            {titleOf(draft)}\n          </p>\n          <p className=\"text-sm text-[var(--text-secondary)]\">\n            {signedLine(signature)}\n          </p>\n        </div>\n        {audience.isError ? (\n          <Banner\n            tone=\"error\"\n            title=\"The recipient count did not load\"\n            action={\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                onClick={() => void audience.refetch()}\n              >\n                Try again\n              </Button>\n            }\n          />\n        ) : audience.data ? (\n          <div className=\"text-sm\">\n            <p className=\"font-medium text-[var(--text-primary)]\">\n              {recipientsLine(audience.data)}\n            </p>\n            <p className=\"text-[var(--text-secondary)]\">\n              {leftOffLine(audience.data.skipped)}\n            </p>\n          </div>\n        ) : (\n          <Skeleton className=\"h-10 w-2/3\" />\n        )}\n        {audience.data?.mode === 'admins_only' && (\n          <Banner tone=\"info\">\n            This environment only sends to admin addresses. No merchants will\n            receive it.\n          </Banner>\n        )}\n        {problems.length > 0 && (\n          <Banner tone=\"error\" title=\"Fix these before sending\">\n            <ul className=\"list-disc pl-4\">\n              {problems.map((line) => (\n                <li key={line}>{line}</li>\n              ))}\n            </ul>\n          </Banner>\n        )}\n        {nobody ? (\n          <p className=\"text-sm text-[var(--text-secondary)]\">\n            There is no one to send to, so this cannot be sent.\n          </p>\n        ) : (\n          <Input\n            label={`Type ${WORD} to confirm`}\n            value={typed}\n            autoComplete=\"off\"\n            spellCheck={false}\n            onChange={(e) => setTyped(e.target.value)}\n          />\n        )}\n      </div>\n    </FormDialog>\n  );\n}\n"],"mappings":";AAiEQ,mBACE,KADF;AA/DR,SAAS,gBAAgB;AACzB,SAAS,QAAQ,QAAQ,YAAY,OAAO,gBAAgB;AAG5D,SAAS,eAAe;AACxB,SAAS,oBAAoB;AAC7B,SAAS,aAAa,gBAAgB,iBAAiB;AACvD,SAAS,iBAAiB,kBAAkB;AAC5C,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAE9B,MAAM,OAAO;AAMN,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOG;AACD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAmB,CAAC,CAAC;AACnD,QAAM,WAAW,YAAY,IAAI;AACjC,QAAM,EAAE,MAAM,aAAa,CAAC,EAAE,IAAI,cAAc;AAChD,QAAM,YAAY,gBAAgB,MAAM,aAAa,YAAY,OAAO;AACxE,QAAM,QAAQ,aAAa,KAAK;AAChC,QAAM,WAAW;AAAA,IACf,GAAG,MAAM,IAAI,CAAC,MAAM,GAAG,EAAE,KAAK,KAAK,EAAE,OAAO,EAAE;AAAA,IAC9C,GAAG;AAAA,EACL;AACA,QAAM,SAAS,SAAS,MAAM,eAAe;AAC7C,QAAM,QACJ,QAAQ,SAAS,IAAI,KAAK,CAAC,UAAU,MAAM,WAAW,KAAK,UAAU;AACvE,QAAM,QAAQ,MAAM;AAClB,aAAS,EAAE;AACX,eAAW,CAAC,CAAC;AACb,YAAQ;AAAA,EACV;AACA,QAAM,SAAS,YAAY;AACzB,UAAM,UAAU,MAAM,KAAK,UAAU;AAErC,QAAI,QAAQ,OAAQ,YAAW,OAAO;AAAA,QACjC,OAAM;AAAA,EACb;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAM;AAAA,MACN,SAAS;AAAA,MACT,QACE,iCACE;AAAA,4BAAC,UAAO,SAAQ,aAAY,SAAS,OAAO,oBAE5C;AAAA,QACA,oBAAC,UAAO,UAAU,CAAC,OAAO,SAAS,KAAK,SAAS,SAAS,QACvD,mBAAS,OAAO,UAAU,SAAS,IAAI,IAAI,QAC9C;AAAA,SACF;AAAA,MAGF,+BAAC,SAAI,WAAU,uBACb;AAAA,6BAAC,SACC;AAAA,8BAAC,OAAE,WAAU,uCAAsC,qBAAO;AAAA,UAC1D,oBAAC,OAAE,WAAU,kDACV,kBAAQ,KAAK,GAChB;AAAA,UACA,oBAAC,OAAE,WAAU,wCACV,qBAAW,SAAS,GACvB;AAAA,WACF;AAAA,QACC,SAAS,UACR;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAM;AAAA,YACN,QACE;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS,MAAM,KAAK,SAAS,QAAQ;AAAA,gBACtC;AAAA;AAAA,YAED;AAAA;AAAA,QAEJ,IACE,SAAS,OACX,qBAAC,SAAI,WAAU,WACb;AAAA,8BAAC,OAAE,WAAU,0CACV,yBAAe,SAAS,IAAI,GAC/B;AAAA,UACA,oBAAC,OAAE,WAAU,gCACV,sBAAY,SAAS,KAAK,OAAO,GACpC;AAAA,WACF,IAEA,oBAAC,YAAS,WAAU,cAAa;AAAA,QAElC,SAAS,MAAM,SAAS,iBACvB,oBAAC,UAAO,MAAK,QAAO,2FAGpB;AAAA,QAED,SAAS,SAAS,KACjB,oBAAC,UAAO,MAAK,SAAQ,OAAM,4BACzB,8BAAC,QAAG,WAAU,kBACX,mBAAS,IAAI,CAAC,SACb,oBAAC,QAAe,kBAAP,IAAY,CACtB,GACH,GACF;AAAA,QAED,SACC,oBAAC,OAAE,WAAU,wCAAuC,iEAEpD,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,QAAQ,IAAI;AAAA,YACnB,OAAO;AAAA,YACP,cAAa;AAAA,YACb,YAAY;AAAA,YACZ,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA;AAAA,QAC1C;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/newsletters/save-file.js

@@ -0,0 +1,12 @@
+function saveCsv(text, name) {
+  const url = URL.createObjectURL(new Blob([text], { type: "text/csv" }));
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = name;
+  link.click();
+  URL.revokeObjectURL(url);
+}
+export {
+  saveCsv
+};
+//# sourceMappingURL=save-file.js.map

package/dist/admin/newsletters/save-file.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/save-file.ts"],"sourcesContent":["/** Hands the browser a CSV to save, under `name`. */\nexport function saveCsv(text: string, name: string) {\n  const url = URL.createObjectURL(new Blob([text], { type: 'text/csv' }));\n  const link = document.createElement('a');\n\n  link.href = url;\n  link.download = name;\n  link.click();\n  URL.revokeObjectURL(url);\n}\n"],"mappings":"AACO,SAAS,QAAQ,MAAc,MAAc;AAClD,QAAM,MAAM,IAAI,gBAAgB,IAAI,KAAK,CAAC,IAAI,GAAG,EAAE,MAAM,WAAW,CAAC,CAAC;AACtE,QAAM,OAAO,SAAS,cAAc,GAAG;AAEvC,OAAK,OAAO;AACZ,OAAK,WAAW;AAChB,OAAK,MAAM;AACX,MAAI,gBAAgB,GAAG;AACzB;","names":[]}

package/dist/admin/newsletters/save-indicator.js

@@ -0,0 +1,28 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@withpotter/ui-kit";
+import { saveLabel } from "./autosave";
+function SaveIndicator({
+  status,
+  onRetry
+}) {
+  const label = saveLabel(status);
+  if (!label) return null;
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      role: "status",
+      className: "flex items-center gap-1 whitespace-nowrap text-xs text-[var(--text-tertiary)]",
+      children: [
+        label,
+        status === "failed" && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\xB7" }),
+          /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", onClick: onRetry, children: "Retry" })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  SaveIndicator
+};
+//# sourceMappingURL=save-indicator.js.map

package/dist/admin/newsletters/save-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/save-indicator.tsx"],"sourcesContent":["import { Button } from '@withpotter/ui-kit';\nimport { saveLabel, type SaveStatus } from './autosave';\n\n/** Saving, Saved, or Not saved with a way to try again. Quiet on purpose. */\nexport function SaveIndicator({\n  status,\n  onRetry,\n}: {\n  status: SaveStatus;\n  onRetry: () => void;\n}) {\n  const label = saveLabel(status);\n\n  if (!label) return null;\n\n  return (\n    <span\n      role=\"status\"\n      className=\"flex items-center gap-1 whitespace-nowrap text-xs text-[var(--text-tertiary)]\"\n    >\n      {label}\n      {status === 'failed' && (\n        <>\n          <span aria-hidden>·</span>\n          <Button size=\"sm\" variant=\"ghost\" onClick={onRetry}>\n            Retry\n          </Button>\n        </>\n      )}\n    </span>\n  );\n}\n"],"mappings":"AAsBQ,mBACE,KADF;AAtBR,SAAS,cAAc;AACvB,SAAS,iBAAkC;AAGpC,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AACF,GAGG;AACD,QAAM,QAAQ,UAAU,MAAM;AAE9B,MAAI,CAAC,MAAO,QAAO;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAET;AAAA;AAAA,QACA,WAAW,YACV,iCACE;AAAA,8BAAC,UAAK,eAAW,MAAC,kBAAC;AAAA,UACnB,oBAAC,UAAO,MAAK,MAAK,SAAQ,SAAQ,SAAS,SAAS,mBAEpD;AAAA,WACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}

package/dist/admin/newsletters/section-tabs.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useRouter } from "next/navigation";
+import { PageTabs } from "../_ui";
+const TABS = [
+  { id: "campaigns", label: "Campaigns", href: "/admin/newsletters" },
+  { id: "audience", label: "Audience", href: "/admin/newsletters/audience" }
+];
+function NewsletterTabs({ active }) {
+  const router = useRouter();
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Newsletters", children: /* @__PURE__ */ jsx(
+    PageTabs,
+    {
+      tabs: TABS.map(({ id, label }) => ({ id, label })),
+      active,
+      onChange: (id) => {
+        const tab = TABS.find((t) => t.id === id);
+        if (tab && id !== active) router.push(tab.href);
+      }
+    }
+  ) });
+}
+export {
+  NewsletterTabs
+};
+//# sourceMappingURL=section-tabs.js.map

package/dist/admin/newsletters/section-tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/section-tabs.tsx"],"sourcesContent":["'use client';\n\nimport { useRouter } from 'next/navigation';\nimport { PageTabs } from '../_ui';\n\nconst TABS = [\n  { id: 'campaigns', label: 'Campaigns', href: '/admin/newsletters' },\n  { id: 'audience', label: 'Audience', href: '/admin/newsletters/audience' },\n] as const;\n\ntype TabId = (typeof TABS)[number]['id'];\n\n/** The pages of Newsletters: what was written and sent, and who it can go to. */\nexport function NewsletterTabs({ active }: { active: TabId }) {\n  const router = useRouter();\n\n  return (\n    <nav aria-label=\"Newsletters\">\n      <PageTabs\n        tabs={TABS.map(({ id, label }) => ({ id, label }))}\n        active={active}\n        onChange={(id) => {\n          const tab = TABS.find((t) => t.id === id);\n\n          if (tab && id !== active) router.push(tab.href);\n        }}\n      />\n    </nav>\n  );\n}\n"],"mappings":";AAkBM;AAhBN,SAAS,iBAAiB;AAC1B,SAAS,gBAAgB;AAEzB,MAAM,OAAO;AAAA,EACX,EAAE,IAAI,aAAa,OAAO,aAAa,MAAM,qBAAqB;AAAA,EAClE,EAAE,IAAI,YAAY,OAAO,YAAY,MAAM,8BAA8B;AAC3E;AAKO,SAAS,eAAe,EAAE,OAAO,GAAsB;AAC5D,QAAM,SAAS,UAAU;AAEzB,SACE,oBAAC,SAAI,cAAW,eACd;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,KAAK,IAAI,CAAC,EAAE,IAAI,MAAM,OAAO,EAAE,IAAI,MAAM,EAAE;AAAA,MACjD;AAAA,MACA,UAAU,CAAC,OAAO;AAChB,cAAM,MAAM,KAAK,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE;AAExC,YAAI,OAAO,OAAO,OAAQ,QAAO,KAAK,IAAI,IAAI;AAAA,MAChD;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}

package/dist/admin/newsletters/sending.js

@@ -0,0 +1,36 @@
+const count = (n) => new Intl.NumberFormat("en").format(n);
+function sendProgress(counts) {
+  const total = Math.max(0, counts.total);
+  const handled = Math.max(0, counts.sent + counts.failed + counts.skipped);
+  const done = Math.min(handled, total);
+  return {
+    done,
+    total,
+    percent: total === 0 ? 0 : Math.floor(done / total * 100)
+  };
+}
+const REASONS = [
+  ["unsubscribed", "unsubscribed"],
+  ["unverified", "unverified email"],
+  ["inactive", "inactive account"]
+];
+function leftOffLine(skipped) {
+  const parts = REASONS.filter(([key]) => skipped[key] > 0).map(
+    ([key, label]) => `${count(skipped[key])} ${label}`
+  );
+  const total = REASONS.reduce((sum, [key]) => sum + skipped[key], 0);
+  return total === 0 ? "No one is left off." : `${count(total)} left off: ${parts.join(", ")}.`;
+}
+const noun = (mode, n) => {
+  const word = mode === "admins_only" ? "admin" : "merchant";
+  return `${count(n)} ${n === 1 ? word : `${word}s`}`;
+};
+const sendLabel = (audience) => `Send to ${noun(audience.mode, audience.recipients)}`;
+const recipientsLine = (audience) => `Goes to ${noun(audience.mode, audience.recipients)}.`;
+export {
+  leftOffLine,
+  recipientsLine,
+  sendLabel,
+  sendProgress
+};
+//# sourceMappingURL=sending.js.map

package/dist/admin/newsletters/sending.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/sending.ts"],"sourcesContent":["import type {\n  NewsletterAudience,\n  NewsletterCounts,\n} from '@withpotter/lib/admin-newsletters-api';\n\nconst count = (n: number) => new Intl.NumberFormat('en').format(n);\n\n/** How far a send has got: every address handled, over every address. */\nexport function sendProgress(counts: NewsletterCounts) {\n  const total = Math.max(0, counts.total);\n  const handled = Math.max(0, counts.sent + counts.failed + counts.skipped);\n  const done = Math.min(handled, total);\n\n  return {\n    done,\n    total,\n    percent: total === 0 ? 0 : Math.floor((done / total) * 100),\n  };\n}\n\nconst REASONS: Array<[keyof NewsletterAudience['skipped'], string]> = [\n  ['unsubscribed', 'unsubscribed'],\n  ['unverified', 'unverified email'],\n  ['inactive', 'inactive account'],\n];\n\n/** \"12 left off: 8 unsubscribed, 3 unverified email, 1 inactive account\". */\nexport function leftOffLine(skipped: NewsletterAudience['skipped']) {\n  const parts = REASONS.filter(([key]) => skipped[key] > 0).map(\n    ([key, label]) => `${count(skipped[key])} ${label}`,\n  );\n  const total = REASONS.reduce((sum, [key]) => sum + skipped[key], 0);\n\n  return total === 0\n    ? 'No one is left off.'\n    : `${count(total)} left off: ${parts.join(', ')}.`;\n}\n\nconst noun = (mode: NewsletterAudience['mode'], n: number) => {\n  const word = mode === 'admins_only' ? 'admin' : 'merchant';\n\n  return `${count(n)} ${n === 1 ? word : `${word}s`}`;\n};\n\n/** \"Send to 1,204 merchants\", or \"Send to 3 admins\" where only admins get it. */\nexport const sendLabel = (audience: NewsletterAudience) =>\n  `Send to ${noun(audience.mode, audience.recipients)}`;\n\nexport const recipientsLine = (audience: NewsletterAudience) =>\n  `Goes to ${noun(audience.mode, audience.recipients)}.`;\n"],"mappings":"AAKA,MAAM,QAAQ,CAAC,MAAc,IAAI,KAAK,aAAa,IAAI,EAAE,OAAO,CAAC;AAG1D,SAAS,aAAa,QAA0B;AACrD,QAAM,QAAQ,KAAK,IAAI,GAAG,OAAO,KAAK;AACtC,QAAM,UAAU,KAAK,IAAI,GAAG,OAAO,OAAO,OAAO,SAAS,OAAO,OAAO;AACxE,QAAM,OAAO,KAAK,IAAI,SAAS,KAAK;AAEpC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,SAAS,UAAU,IAAI,IAAI,KAAK,MAAO,OAAO,QAAS,GAAG;AAAA,EAC5D;AACF;AAEA,MAAM,UAAgE;AAAA,EACpE,CAAC,gBAAgB,cAAc;AAAA,EAC/B,CAAC,cAAc,kBAAkB;AAAA,EACjC,CAAC,YAAY,kBAAkB;AACjC;AAGO,SAAS,YAAY,SAAwC;AAClE,QAAM,QAAQ,QAAQ,OAAO,CAAC,CAAC,GAAG,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE;AAAA,IACxD,CAAC,CAAC,KAAK,KAAK,MAAM,GAAG,MAAM,QAAQ,GAAG,CAAC,CAAC,IAAI,KAAK;AAAA,EACnD;AACA,QAAM,QAAQ,QAAQ,OAAO,CAAC,KAAK,CAAC,GAAG,MAAM,MAAM,QAAQ,GAAG,GAAG,CAAC;AAElE,SAAO,UAAU,IACb,wBACA,GAAG,MAAM,KAAK,CAAC,cAAc,MAAM,KAAK,IAAI,CAAC;AACnD;AAEA,MAAM,OAAO,CAAC,MAAkC,MAAc;AAC5D,QAAM,OAAO,SAAS,gBAAgB,UAAU;AAEhD,SAAO,GAAG,MAAM,CAAC,CAAC,IAAI,MAAM,IAAI,OAAO,GAAG,IAAI,GAAG;AACnD;AAGO,MAAM,YAAY,CAAC,aACxB,WAAW,KAAK,SAAS,MAAM,SAAS,UAAU,CAAC;AAE9C,MAAM,iBAAiB,CAAC,aAC7B,WAAW,KAAK,SAAS,MAAM,SAAS,UAAU,CAAC;","names":[]}

package/dist/admin/newsletters/sent-summary.js

@@ -0,0 +1,77 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { Card, Fact, FactList, Progress } from "@withpotter/ui-kit";
+import { StatusBadge } from "@withpotter/components/shared/status-badge";
+import { countLinks, recipientsHref, sendModeLine } from "./deliveries";
+import { STATUS } from "./labels";
+import { sendProgress } from "./sending";
+import { signatureLabel } from "./signatures";
+import { formatMoment } from "./format-date";
+const count = (n) => new Intl.NumberFormat("en").format(n);
+function SentSummary({ newsletter }) {
+  const { status, counts } = newsletter;
+  const state = STATUS[status];
+  const progress = sendProgress(counts);
+  const mode = sendModeLine(newsletter.sendMode);
+  return /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+    status === "sending" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-[var(--text-primary)]", children: "Sending" }),
+        /* @__PURE__ */ jsxs("span", { className: "tabular-nums text-[var(--text-secondary)]", children: [
+          count(progress.done),
+          " of ",
+          count(progress.total)
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Progress, { value: progress.done, max: progress.total || 1 })
+    ] }),
+    /* @__PURE__ */ jsxs(FactList, { columns: 1, children: [
+      /* @__PURE__ */ jsx(
+        Fact,
+        {
+          label: "Status",
+          value: /* @__PURE__ */ jsx(
+            StatusBadge,
+            {
+              status: state.key,
+              label: state.label,
+              neutral: state.quiet
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(Fact, { label: "Sent by", value: newsletter.sentBy?.name }),
+      /* @__PURE__ */ jsx(Fact, { label: "Sent on", value: formatMoment(newsletter.sentAt) }),
+      mode && /* @__PURE__ */ jsx(Fact, { label: "Send type", value: mode }),
+      /* @__PURE__ */ jsx(
+        Fact,
+        {
+          label: "Signature",
+          value: newsletter.signature ? signatureLabel(newsletter.signature) : "None"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(FactList, { className: "grid-cols-2 sm:grid-cols-4", children: countLinks(newsletter).map((item) => /* @__PURE__ */ jsx(
+      Fact,
+      {
+        label: item.label,
+        value: /* @__PURE__ */ jsx(
+          Link,
+          {
+            href: recipientsHref(newsletter.id, item.status),
+            className: "tabular-nums underline underline-offset-2 hover:text-[var(--accent-ink,var(--accent-primary))]",
+            "aria-label": `${item.label}: ${count(
+              item.value
+            )}. Show these addresses`,
+            children: count(item.value)
+          }
+        )
+      },
+      item.label
+    )) })
+  ] }) });
+}
+export {
+  SentSummary
+};
+//# sourceMappingURL=sent-summary.js.map

package/dist/admin/newsletters/sent-summary.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/sent-summary.tsx"],"sourcesContent":["import Link from \"next/link\";\nimport { Card, Fact, FactList, Progress } from \"@withpotter/ui-kit\";\nimport { StatusBadge } from \"@withpotter/components/shared/status-badge\";\nimport type { Newsletter } from \"@withpotter/lib/admin-newsletters-api\";\nimport { countLinks, recipientsHref, sendModeLine } from \"./deliveries\";\nimport { STATUS } from \"./labels\";\nimport { sendProgress } from \"./sending\";\nimport { signatureLabel } from \"./signatures\";\nimport { formatMoment } from \"./format-date\";\n\nconst count = (n: number) => new Intl.NumberFormat(\"en\").format(n);\n\n/**\n * The facts of a send: where it stands, who sent it and when, who it went\n * to, and its four counts, each a link to those addresses.\n */\nexport function SentSummary({ newsletter }: { newsletter: Newsletter }) {\n  const { status, counts } = newsletter;\n  const state = STATUS[status];\n  const progress = sendProgress(counts);\n  const mode = sendModeLine(newsletter.sendMode);\n\n  return (\n    <Card>\n      <div className=\"flex flex-col gap-4\">\n        {status === \"sending\" && (\n          <div className=\"flex flex-col gap-2\">\n            <div className=\"flex justify-between text-sm\">\n              <span className=\"font-medium text-[var(--text-primary)]\">\n                Sending\n              </span>\n              <span className=\"tabular-nums text-[var(--text-secondary)]\">\n                {count(progress.done)} of {count(progress.total)}\n              </span>\n            </div>\n            <Progress value={progress.done} max={progress.total || 1} />\n          </div>\n        )}\n        <FactList columns={1}>\n          <Fact\n            label=\"Status\"\n            value={\n              <StatusBadge\n                status={state.key}\n                label={state.label}\n                neutral={state.quiet}\n              />\n            }\n          />\n          <Fact label=\"Sent by\" value={newsletter.sentBy?.name} />\n          <Fact label=\"Sent on\" value={formatMoment(newsletter.sentAt)} />\n          {mode && <Fact label=\"Send type\" value={mode} />}\n          <Fact\n            label=\"Signature\"\n            value={\n              newsletter.signature\n                ? signatureLabel(newsletter.signature)\n                : \"None\"\n            }\n          />\n        </FactList>\n        <FactList className=\"grid-cols-2 sm:grid-cols-4\">\n          {countLinks(newsletter).map((item) => (\n            <Fact\n              key={item.label}\n              label={item.label}\n              value={\n                <Link\n                  href={recipientsHref(newsletter.id, item.status)}\n                  className=\"tabular-nums underline underline-offset-2 hover:text-[var(--accent-ink,var(--accent-primary))]\"\n                  aria-label={`${item.label}: ${count(\n                    item.value\n                  )}. Show these addresses`}\n                >\n                  {count(item.value)}\n                </Link>\n              }\n            />\n          ))}\n        </FactList>\n      </div>\n    </Card>\n  );\n}\n"],"mappings":"AA4Bc,cAGA,YAHA;AA5Bd,OAAO,UAAU;AACjB,SAAS,MAAM,MAAM,UAAU,gBAAgB;AAC/C,SAAS,mBAAmB;AAE5B,SAAS,YAAY,gBAAgB,oBAAoB;AACzD,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAE7B,MAAM,QAAQ,CAAC,MAAc,IAAI,KAAK,aAAa,IAAI,EAAE,OAAO,CAAC;AAM1D,SAAS,YAAY,EAAE,WAAW,GAA+B;AACtE,QAAM,EAAE,QAAQ,OAAO,IAAI;AAC3B,QAAM,QAAQ,OAAO,MAAM;AAC3B,QAAM,WAAW,aAAa,MAAM;AACpC,QAAM,OAAO,aAAa,WAAW,QAAQ;AAE7C,SACE,oBAAC,QACC,+BAAC,SAAI,WAAU,uBACZ;AAAA,eAAW,aACV,qBAAC,SAAI,WAAU,uBACb;AAAA,2BAAC,SAAI,WAAU,gCACb;AAAA,4BAAC,UAAK,WAAU,0CAAyC,qBAEzD;AAAA,QACA,qBAAC,UAAK,WAAU,6CACb;AAAA,gBAAM,SAAS,IAAI;AAAA,UAAE;AAAA,UAAK,MAAM,SAAS,KAAK;AAAA,WACjD;AAAA,SACF;AAAA,MACA,oBAAC,YAAS,OAAO,SAAS,MAAM,KAAK,SAAS,SAAS,GAAG;AAAA,OAC5D;AAAA,IAEF,qBAAC,YAAS,SAAS,GACjB;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,OACE;AAAA,YAAC;AAAA;AAAA,cACC,QAAQ,MAAM;AAAA,cACd,OAAO,MAAM;AAAA,cACb,SAAS,MAAM;AAAA;AAAA,UACjB;AAAA;AAAA,MAEJ;AAAA,MACA,oBAAC,QAAK,OAAM,WAAU,OAAO,WAAW,QAAQ,MAAM;AAAA,MACtD,oBAAC,QAAK,OAAM,WAAU,OAAO,aAAa,WAAW,MAAM,GAAG;AAAA,MAC7D,QAAQ,oBAAC,QAAK,OAAM,aAAY,OAAO,MAAM;AAAA,MAC9C;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,OACE,WAAW,YACP,eAAe,WAAW,SAAS,IACnC;AAAA;AAAA,MAER;AAAA,OACF;AAAA,IACA,oBAAC,YAAS,WAAU,8BACjB,qBAAW,UAAU,EAAE,IAAI,CAAC,SAC3B;AAAA,MAAC;AAAA;AAAA,QAEC,OAAO,KAAK;AAAA,QACZ,OACE;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,eAAe,WAAW,IAAI,KAAK,MAAM;AAAA,YAC/C,WAAU;AAAA,YACV,cAAY,GAAG,KAAK,KAAK,KAAK;AAAA,cAC5B,KAAK;AAAA,YACP,CAAC;AAAA,YAEA,gBAAM,KAAK,KAAK;AAAA;AAAA,QACnB;AAAA;AAAA,MAXG,KAAK;AAAA,IAaZ,CACD,GACH;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/admin/newsletters/sent-view.js

@@ -0,0 +1,60 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, DetailColumns } from "@withpotter/ui-kit";
+import { PageTabs, useTabParam } from "../_ui";
+import { titleOf } from "./labels";
+import { PreviewPane } from "./preview-pane";
+import { RecipientsTab } from "./recipients-tab";
+import { RecordHeader } from "./record-header";
+import { SentSummary } from "./sent-summary";
+import { useNewsletterActions } from "./use-newsletter-actions";
+import { useNewsletterAccess } from "./use-newsletters";
+import { useSendActions } from "./use-send-actions";
+const TABS = [
+  { id: "email", label: "Email" },
+  { id: "recipients", label: "Recipients" }
+];
+const KEYS = TABS.map((t) => t.id);
+function SentView({ newsletter }) {
+  const { canManage, email } = useNewsletterAccess();
+  const actions = useNewsletterActions();
+  const send = useSendActions(newsletter.id, email);
+  const [tab, setTab] = useTabParam(KEYS);
+  const { status } = newsletter;
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx(RecordHeader, { title: titleOf(newsletter), children: canManage && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          loading: actions.duplicating,
+          onClick: () => void actions.duplicateAsDraft(newsletter.id),
+          children: "Duplicate as draft"
+        }
+      ),
+      status === "sending" && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "danger",
+          loading: send.stopping,
+          onClick: () => void send.stop(),
+          children: "Stop sending"
+        }
+      ),
+      status === "failed" && /* @__PURE__ */ jsx(
+        Button,
+        {
+          loading: send.retrying,
+          onClick: () => void send.retryFailed(),
+          children: "Retry failed"
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx(PageTabs, { tabs: TABS, active: tab, onChange: setTab }),
+    tab === "recipients" ? /* @__PURE__ */ jsx(RecipientsTab, { newsletter }) : /* @__PURE__ */ jsx(DetailColumns, { aside: /* @__PURE__ */ jsx(SentSummary, { newsletter }), children: /* @__PURE__ */ jsx(PreviewPane, { id: newsletter.id, version: "sent" }) })
+  ] });
+}
+export {
+  SentView
+};
+//# sourceMappingURL=sent-view.js.map

package/dist/admin/newsletters/sent-view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/sent-view.tsx"],"sourcesContent":["'use client';\n\nimport { Button, DetailColumns } from '@withpotter/ui-kit';\nimport type { Newsletter } from '@withpotter/lib/admin-newsletters-api';\nimport { PageTabs, useTabParam } from '../_ui';\nimport { titleOf } from './labels';\nimport { PreviewPane } from './preview-pane';\nimport { RecipientsTab } from './recipients-tab';\nimport { RecordHeader } from './record-header';\nimport { SentSummary } from './sent-summary';\nimport { useNewsletterActions } from './use-newsletter-actions';\nimport { useNewsletterAccess } from './use-newsletters';\nimport { useSendActions } from './use-send-actions';\n\nconst TABS = [\n  { id: 'email', label: 'Email' },\n  { id: 'recipients', label: 'Recipients' },\n] as const;\n\nconst KEYS = TABS.map((t) => t.id);\n\n/**\n * A newsletter that has left. Email: the message as it went, beside who sent\n * it and how the send ended. Recipients: every address, one row each.\n */\nexport function SentView({ newsletter }: { newsletter: Newsletter }) {\n  const { canManage, email } = useNewsletterAccess();\n  const actions = useNewsletterActions();\n  const send = useSendActions(newsletter.id, email);\n  const [tab, setTab] = useTabParam(KEYS);\n  const { status } = newsletter;\n\n  return (\n    <div>\n      <RecordHeader title={titleOf(newsletter)}>\n        {canManage && (\n          <>\n            <Button\n              variant=\"secondary\"\n              loading={actions.duplicating}\n              onClick={() => void actions.duplicateAsDraft(newsletter.id)}\n            >\n              Duplicate as draft\n            </Button>\n            {status === 'sending' && (\n              <Button\n                variant=\"danger\"\n                loading={send.stopping}\n                onClick={() => void send.stop()}\n              >\n                Stop sending\n              </Button>\n            )}\n            {status === 'failed' && (\n              <Button\n                loading={send.retrying}\n                onClick={() => void send.retryFailed()}\n              >\n                Retry failed\n              </Button>\n            )}\n          </>\n        )}\n      </RecordHeader>\n      <PageTabs tabs={TABS} active={tab} onChange={setTab} />\n      {tab === 'recipients' ? (\n        <RecipientsTab newsletter={newsletter} />\n      ) : (\n        <DetailColumns aside={<SentSummary newsletter={newsletter} />}>\n          <PreviewPane id={newsletter.id} version=\"sent\" />\n        </DetailColumns>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAoCU,mBACE,KADF;AAlCV,SAAS,QAAQ,qBAAqB;AAEtC,SAAS,UAAU,mBAAmB;AACtC,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,sBAAsB;AAE/B,MAAM,OAAO;AAAA,EACX,EAAE,IAAI,SAAS,OAAO,QAAQ;AAAA,EAC9B,EAAE,IAAI,cAAc,OAAO,aAAa;AAC1C;AAEA,MAAM,OAAO,KAAK,IAAI,CAAC,MAAM,EAAE,EAAE;AAM1B,SAAS,SAAS,EAAE,WAAW,GAA+B;AACnE,QAAM,EAAE,WAAW,MAAM,IAAI,oBAAoB;AACjD,QAAM,UAAU,qBAAqB;AACrC,QAAM,OAAO,eAAe,WAAW,IAAI,KAAK;AAChD,QAAM,CAAC,KAAK,MAAM,IAAI,YAAY,IAAI;AACtC,QAAM,EAAE,OAAO,IAAI;AAEnB,SACE,qBAAC,SACC;AAAA,wBAAC,gBAAa,OAAO,QAAQ,UAAU,GACpC,uBACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,QAAQ;AAAA,UACjB,SAAS,MAAM,KAAK,QAAQ,iBAAiB,WAAW,EAAE;AAAA,UAC3D;AAAA;AAAA,MAED;AAAA,MACC,WAAW,aACV;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,KAAK;AAAA,UACd,SAAS,MAAM,KAAK,KAAK,KAAK;AAAA,UAC/B;AAAA;AAAA,MAED;AAAA,MAED,WAAW,YACV;AAAA,QAAC;AAAA;AAAA,UACC,SAAS,KAAK;AAAA,UACd,SAAS,MAAM,KAAK,KAAK,YAAY;AAAA,UACtC;AAAA;AAAA,MAED;AAAA,OAEJ,GAEJ;AAAA,IACA,oBAAC,YAAS,MAAM,MAAM,QAAQ,KAAK,UAAU,QAAQ;AAAA,IACpD,QAAQ,eACP,oBAAC,iBAAc,YAAwB,IAEvC,oBAAC,iBAAc,OAAO,oBAAC,eAAY,YAAwB,GACzD,8BAAC,eAAY,IAAI,WAAW,IAAI,SAAQ,QAAO,GACjD;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/admin/newsletters/signature-editor-fields.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Input } from "@withpotter/ui-kit";
+import { BrandImageField } from "./brand-image-field";
+import { SIGNATURE_LIMITS } from "./signature-values";
+import { DEFAULT_CLOSING } from "./signatures";
+function SignatureEditorFields({
+  values,
+  errors,
+  logo,
+  banner,
+  onChange
+}) {
+  const field = (key) => ({
+    value: values[key],
+    error: errors[key],
+    maxLength: SIGNATURE_LIMITS[key],
+    onChange: (e) => onChange({ [key]: e.target.value })
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "grid min-w-0 gap-3 sm:grid-cols-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "sm:col-span-2", children: /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: "Signature name (optional)",
+        placeholder: "What it is called in your list",
+        ...field("label")
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Input, { label: "Name", autoFocus: true, ...field("name") }),
+    /* @__PURE__ */ jsx(Input, { label: "Role or title", ...field("title") }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: "Closing line",
+        placeholder: DEFAULT_CLOSING,
+        ...field("closing")
+      }
+    ),
+    /* @__PURE__ */ jsx(Input, { label: "Email", type: "email", ...field("email") }),
+    /* @__PURE__ */ jsx(Input, { label: "Link label", ...field("linkLabel") }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: "Link address",
+        type: "url",
+        placeholder: "https://",
+        ...field("linkUrl")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BrandImageField,
+      {
+        label: "Logo",
+        shape: "square",
+        value: values.logoUrl,
+        upload: logo,
+        onRemove: () => onChange({ logoUrl: "" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      BrandImageField,
+      {
+        label: "Banner",
+        shape: "wide",
+        value: values.bannerUrl,
+        upload: banner,
+        onRemove: () => onChange({ bannerUrl: "" })
+      }
+    )
+  ] });
+}
+export {
+  SignatureEditorFields
+};
+//# sourceMappingURL=signature-editor-fields.js.map

package/dist/admin/newsletters/signature-editor-fields.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/signature-editor-fields.tsx"],"sourcesContent":["'use client';\n\nimport { Input } from '@withpotter/ui-kit';\nimport type { SignatureFields } from '@withpotter/lib/admin-signatures-api';\nimport { BrandImageField } from './brand-image-field';\nimport type { ImageUpload } from './image-picker';\nimport { SIGNATURE_LIMITS } from './signature-values';\nimport { DEFAULT_CLOSING } from './signatures';\n\ntype Errors = Partial<Record<keyof SignatureFields, string>>;\n\n/**\n * The signature's fields, in the order they read in the email, two to a row\n * so the whole form fits in the dialog without scrolling.\n */\nexport function SignatureEditorFields({\n  values,\n  errors,\n  logo,\n  banner,\n  onChange,\n}: {\n  values: SignatureFields;\n  errors: Errors;\n  logo: ImageUpload;\n  banner: ImageUpload;\n  onChange: (patch: Partial<SignatureFields>) => void;\n}) {\n  const field = (key: keyof SignatureFields) => ({\n    value: values[key],\n    error: errors[key],\n    maxLength: SIGNATURE_LIMITS[key],\n    onChange: (e: React.ChangeEvent<HTMLInputElement>) =>\n      onChange({ [key]: e.target.value }),\n  });\n\n  return (\n    <div className=\"grid min-w-0 gap-3 sm:grid-cols-2\">\n      <div className=\"sm:col-span-2\">\n        <Input\n          label=\"Signature name (optional)\"\n          placeholder=\"What it is called in your list\"\n          {...field('label')}\n        />\n      </div>\n      <Input label=\"Name\" autoFocus {...field('name')} />\n      <Input label=\"Role or title\" {...field('title')} />\n      <Input\n        label=\"Closing line\"\n        placeholder={DEFAULT_CLOSING}\n        {...field('closing')}\n      />\n      <Input label=\"Email\" type=\"email\" {...field('email')} />\n      <Input label=\"Link label\" {...field('linkLabel')} />\n      <Input\n        label=\"Link address\"\n        type=\"url\"\n        placeholder=\"https://\"\n        {...field('linkUrl')}\n      />\n      <BrandImageField\n        label=\"Logo\"\n        shape=\"square\"\n        value={values.logoUrl}\n        upload={logo}\n        onRemove={() => onChange({ logoUrl: '' })}\n      />\n      <BrandImageField\n        label=\"Banner\"\n        shape=\"wide\"\n        value={values.bannerUrl}\n        upload={banner}\n        onRemove={() => onChange({ bannerUrl: '' })}\n      />\n    </div>\n  );\n}\n"],"mappings":";AAqCI,SAEI,KAFJ;AAnCJ,SAAS,aAAa;AAEtB,SAAS,uBAAuB;AAEhC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAQzB,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,QAAM,QAAQ,CAAC,SAAgC;AAAA,IAC7C,OAAO,OAAO,GAAG;AAAA,IACjB,OAAO,OAAO,GAAG;AAAA,IACjB,WAAW,iBAAiB,GAAG;AAAA,IAC/B,UAAU,CAAC,MACT,SAAS,EAAE,CAAC,GAAG,GAAG,EAAE,OAAO,MAAM,CAAC;AAAA,EACtC;AAEA,SACE,qBAAC,SAAI,WAAU,qCACb;AAAA,wBAAC,SAAI,WAAU,iBACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,aAAY;AAAA,QACX,GAAG,MAAM,OAAO;AAAA;AAAA,IACnB,GACF;AAAA,IACA,oBAAC,SAAM,OAAM,QAAO,WAAS,MAAE,GAAG,MAAM,MAAM,GAAG;AAAA,IACjD,oBAAC,SAAM,OAAM,iBAAiB,GAAG,MAAM,OAAO,GAAG;AAAA,IACjD;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,aAAa;AAAA,QACZ,GAAG,MAAM,SAAS;AAAA;AAAA,IACrB;AAAA,IACA,oBAAC,SAAM,OAAM,SAAQ,MAAK,SAAS,GAAG,MAAM,OAAO,GAAG;AAAA,IACtD,oBAAC,SAAM,OAAM,cAAc,GAAG,MAAM,WAAW,GAAG;AAAA,IAClD;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,MAAK;AAAA,QACL,aAAY;AAAA,QACX,GAAG,MAAM,SAAS;AAAA;AAAA,IACrB;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAM;AAAA,QACN,OAAO,OAAO;AAAA,QACd,QAAQ;AAAA,QACR,UAAU,MAAM,SAAS,EAAE,SAAS,GAAG,CAAC;AAAA;AAAA,IAC1C;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAM;AAAA,QACN,OAAO,OAAO;AAAA,QACd,QAAQ;AAAA,QACR,UAAU,MAAM,SAAS,EAAE,WAAW,GAAG,CAAC;AAAA;AAAA,IAC5C;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/newsletters/signature-editor.js

@@ -0,0 +1,63 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { ArrowLeft } from "lucide-react";
+import { Button } from "@withpotter/ui-kit";
+import { useImageUpload } from "./image-picker";
+import { SignatureEditorFields } from "./signature-editor-fields";
+import { SignaturePreview } from "./signature-preview";
+import { signatureErrors } from "./signature-values";
+function SignatureEditor({
+  initial,
+  submitLabel,
+  busy,
+  onSubmit,
+  onBack
+}) {
+  const [values, setValues] = useState(initial);
+  const [tried, setTried] = useState(false);
+  const change = (patch) => setValues((current) => ({ ...current, ...patch }));
+  const logo = useImageUpload((logoUrl) => change({ logoUrl }));
+  const banner = useImageUpload((bannerUrl) => change({ bannerUrl }));
+  const errors = signatureErrors(values);
+  const uploading = logo.uploading || banner.uploading;
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      className: "flex flex-col gap-4",
+      noValidate: true,
+      onSubmit: (e) => {
+        e.preventDefault();
+        setTried(true);
+        if (!uploading && Object.keys(errors).length === 0) onSubmit(values);
+      },
+      children: [
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: onBack, children: [
+          /* @__PURE__ */ jsx(ArrowLeft, { "aria-hidden": true }),
+          "Back to signatures"
+        ] }) }),
+        /* @__PURE__ */ jsxs("div", { className: "grid items-start gap-6 lg:grid-cols-2", children: [
+          /* @__PURE__ */ jsx(
+            SignatureEditorFields,
+            {
+              values,
+              errors: tried ? errors : {},
+              logo,
+              banner,
+              onChange: change
+            }
+          ),
+          /* @__PURE__ */ jsx(SignaturePreview, { form: values })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
+          /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: onBack, children: "Cancel" }),
+          /* @__PURE__ */ jsx(Button, { type: "submit", loading: busy, disabled: uploading, children: submitLabel })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  SignatureEditor
+};
+//# sourceMappingURL=signature-editor.js.map

package/dist/admin/newsletters/signature-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/signature-editor.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { ArrowLeft } from 'lucide-react';\nimport { Button } from '@withpotter/ui-kit';\nimport type { SignatureFields } from '@withpotter/lib/admin-signatures-api';\nimport { useImageUpload } from './image-picker';\nimport { SignatureEditorFields } from './signature-editor-fields';\nimport { SignaturePreview } from './signature-preview';\nimport { signatureErrors } from './signature-values';\n\n/**\n * One signature being written: its fields on the left, the signature as the\n * email will draw it on the right. Below `lg` the preview sits under the form.\n */\nexport function SignatureEditor({\n  initial,\n  submitLabel,\n  busy,\n  onSubmit,\n  onBack,\n}: {\n  initial: SignatureFields;\n  submitLabel: string;\n  busy: boolean;\n  onSubmit: (values: SignatureFields) => void;\n  /** Leave without saving, back to the list. */\n  onBack: () => void;\n}) {\n  const [values, setValues] = useState(initial);\n  const [tried, setTried] = useState(false);\n  const change = (patch: Partial<SignatureFields>) =>\n    setValues((current) => ({ ...current, ...patch }));\n  const logo = useImageUpload((logoUrl) => change({ logoUrl }));\n  const banner = useImageUpload((bannerUrl) => change({ bannerUrl }));\n  const errors = signatureErrors(values);\n  const uploading = logo.uploading || banner.uploading;\n\n  return (\n    <form\n      className=\"flex flex-col gap-4\"\n      noValidate\n      onSubmit={(e) => {\n        e.preventDefault();\n        setTried(true);\n\n        if (!uploading && Object.keys(errors).length === 0) onSubmit(values);\n      }}\n    >\n      <div>\n        <Button size=\"sm\" variant=\"ghost\" onClick={onBack}>\n          <ArrowLeft aria-hidden />\n          Back to signatures\n        </Button>\n      </div>\n      <div className=\"grid items-start gap-6 lg:grid-cols-2\">\n        <SignatureEditorFields\n          values={values}\n          errors={tried ? errors : {}}\n          logo={logo}\n          banner={banner}\n          onChange={change}\n        />\n        <SignaturePreview form={values} />\n      </div>\n      <div className=\"flex justify-end gap-2\">\n        <Button variant=\"secondary\" onClick={onBack}>\n          Cancel\n        </Button>\n        <Button type=\"submit\" loading={busy} disabled={uploading}>\n          {submitLabel}\n        </Button>\n      </div>\n    </form>\n  );\n}\n"],"mappings":";AAkDQ,SACE,KADF;AAhDR,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AAEvB,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAMzB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOG;AACD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,OAAO;AAC5C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,KAAK;AACxC,QAAM,SAAS,CAAC,UACd,UAAU,CAAC,aAAa,EAAE,GAAG,SAAS,GAAG,MAAM,EAAE;AACnD,QAAM,OAAO,eAAe,CAAC,YAAY,OAAO,EAAE,QAAQ,CAAC,CAAC;AAC5D,QAAM,SAAS,eAAe,CAAC,cAAc,OAAO,EAAE,UAAU,CAAC,CAAC;AAClE,QAAM,SAAS,gBAAgB,MAAM;AACrC,QAAM,YAAY,KAAK,aAAa,OAAO;AAE3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,YAAU;AAAA,MACV,UAAU,CAAC,MAAM;AACf,UAAE,eAAe;AACjB,iBAAS,IAAI;AAEb,YAAI,CAAC,aAAa,OAAO,KAAK,MAAM,EAAE,WAAW,EAAG,UAAS,MAAM;AAAA,MACrE;AAAA,MAEA;AAAA,4BAAC,SACC,+BAAC,UAAO,MAAK,MAAK,SAAQ,SAAQ,SAAS,QACzC;AAAA,8BAAC,aAAU,eAAW,MAAC;AAAA,UAAE;AAAA,WAE3B,GACF;AAAA,QACA,qBAAC,SAAI,WAAU,yCACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA,QAAQ,QAAQ,SAAS,CAAC;AAAA,cAC1B;AAAA,cACA;AAAA,cACA,UAAU;AAAA;AAAA,UACZ;AAAA,UACA,oBAAC,oBAAiB,MAAM,QAAQ;AAAA,WAClC;AAAA,QACA,qBAAC,SAAI,WAAU,0BACb;AAAA,8BAAC,UAAO,SAAQ,aAAY,SAAS,QAAQ,oBAE7C;AAAA,UACA,oBAAC,UAAO,MAAK,UAAS,SAAS,MAAM,UAAU,WAC5C,uBACH;AAAA,WACF;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/admin/newsletters/signature-field.js

@@ -0,0 +1,44 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Button, Field, Select } from "@withpotter/ui-kit";
+import { NO_SIGNATURE, signatureOptions } from "./signatures";
+import { SignaturesDialog } from "./signatures-dialog";
+import { useNewsletterAccess } from "./use-newsletters";
+import { useSignatures } from "./use-signatures";
+function SignatureField({
+  value,
+  carried,
+  disabled,
+  onChange
+}) {
+  const { canManage } = useNewsletterAccess();
+  const { data: saved = [] } = useSignatures();
+  const [managing, setManaging] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start gap-1", children: [
+    /* @__PURE__ */ jsx("div", { className: "w-full", children: /* @__PURE__ */ jsx(Field, { label: "Signature", children: /* @__PURE__ */ jsx(
+      Select,
+      {
+        ariaLabel: "Signature",
+        value: value ?? NO_SIGNATURE,
+        options: signatureOptions(saved, carried),
+        disabled,
+        onChange: (next) => onChange(next === NO_SIGNATURE ? null : next)
+      }
+    ) }) }),
+    canManage && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Button, { size: "sm", variant: "ghost", onClick: () => setManaging(true), children: "Manage signatures" }),
+      /* @__PURE__ */ jsx(
+        SignaturesDialog,
+        {
+          open: managing,
+          onClose: () => setManaging(false)
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  SignatureField
+};
+//# sourceMappingURL=signature-field.js.map

package/dist/admin/newsletters/signature-field.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/admin/newsletters/signature-field.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Button, Field, Select } from '@withpotter/ui-kit';\nimport type { NewsletterSignature } from '@withpotter/lib/admin-newsletters-api';\nimport { NO_SIGNATURE, signatureOptions } from './signatures';\nimport { SignaturesDialog } from './signatures-dialog';\nimport { useNewsletterAccess } from './use-newsletters';\nimport { useSignatures } from './use-signatures';\n\n/**\n * Which saved signature closes the email. Choosing one copies it into the\n * draft on the next save; the copy stays even if the saved one is deleted.\n */\nexport function SignatureField({\n  value,\n  carried,\n  disabled,\n  onChange,\n}: {\n  /** The chosen signature's id, or null for none. */\n  value: string | null;\n  /** The copy the newsletter already carries, if any. */\n  carried: NewsletterSignature | null;\n  disabled: boolean;\n  onChange: (signatureId: string | null) => void;\n}) {\n  const { canManage } = useNewsletterAccess();\n  const { data: saved = [] } = useSignatures();\n  const [managing, setManaging] = useState(false);\n\n  return (\n    <div className=\"flex flex-col items-start gap-1\">\n      <div className=\"w-full\">\n        <Field label=\"Signature\">\n          <Select\n            ariaLabel=\"Signature\"\n            value={value ?? NO_SIGNATURE}\n            options={signatureOptions(saved, carried)}\n            disabled={disabled}\n            onChange={(next) => onChange(next === NO_SIGNATURE ? null : next)}\n          />\n        </Field>\n      </div>\n      {canManage && (\n        <>\n          <Button size=\"sm\" variant=\"ghost\" onClick={() => setManaging(true)}>\n            Manage signatures\n          </Button>\n          <SignaturesDialog\n            open={managing}\n            onClose={() => setManaging(false)}\n          />\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":";AAmCU,SAUF,UAVE,KAUF,YAVE;AAjCV,SAAS,gBAAgB;AACzB,SAAS,QAAQ,OAAO,cAAc;AAEtC,SAAS,cAAc,wBAAwB;AAC/C,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAMvB,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAOG;AACD,QAAM,EAAE,UAAU,IAAI,oBAAoB;AAC1C,QAAM,EAAE,MAAM,QAAQ,CAAC,EAAE,IAAI,cAAc;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,SACE,qBAAC,SAAI,WAAU,mCACb;AAAA,wBAAC,SAAI,WAAU,UACb,8BAAC,SAAM,OAAM,aACX;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,SAAS;AAAA,QAChB,SAAS,iBAAiB,OAAO,OAAO;AAAA,QACxC;AAAA,QACA,UAAU,CAAC,SAAS,SAAS,SAAS,eAAe,OAAO,IAAI;AAAA;AAAA,IAClE,GACF,GACF;AAAA,IACC,aACC,iCACE;AAAA,0BAAC,UAAO,MAAK,MAAK,SAAQ,SAAQ,SAAS,MAAM,YAAY,IAAI,GAAG,+BAEpE;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,SAAS,MAAM,YAAY,KAAK;AAAA;AAAA,MAClC;AAAA,OACF;AAAA,KAEJ;AAEJ;","names":[]}