@btst/stack 5.0.0 → 5.2.0

package/dist/packages/stack/src/plugins/newsletter/client/components/pages/subscribers-page.internal.mjs

@@ -0,0 +1,501 @@
+"use client";
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useId, useState, useRef, useEffect } from 'react';
+import { usePluginOverrides, PermissionAccess } from '@btst/stack/context';
+import { Button } from '../../../../../../../ui/src/components/button.mjs';
+import { Input } from '../../../../../../../ui/src/components/input.mjs';
+import { Textarea } from '../../../../../../../ui/src/components/textarea.mjs';
+import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from '../../../../../../../ui/src/components/alert-dialog.mjs';
+import { useSubscribers, useCreateSubscriber, useUpdateSubscriber, useDeleteSubscriber, useImportSubscribers, useSubscriberExport, useSubscriberGrowth } from '../../../../../../../../plugins/newsletter/client/hooks/index.mjs';
+import { newsletterPermissions } from '../../../../../../../../plugins/newsletter/permissions.mjs';
+import { NEWSLETTER_PLUGIN_ID } from '../../constants.mjs';
+import { NewsletterPage, Field, selectClass, Status, Pagination } from '../shared.mjs';
+
+function SubscribersPage() {
+  const id = useId();
+  const [query, setQuery] = useState("");
+  const [status, setStatus] = useState("");
+  const [tag, setTag] = useState("");
+  const [offset, setOffset] = useState(0);
+  const [editing, setEditing] = useState();
+  const [deleting, setDeleting] = useState();
+  const [importing, setImporting] = useState(false);
+  const [message, setMessage] = useState("");
+  const [error, setError] = useState("");
+  const { data } = useSubscribers({
+    query: query || void 0,
+    status: status || void 0,
+    tag: tag || void 0,
+    offset,
+    limit: 25
+  });
+  const formRef = useRef(null);
+  useEffect(() => {
+    if (editing !== void 0)
+      formRef.current?.querySelector("input")?.focus();
+  }, [editing]);
+  const create = useCreateSubscriber();
+  const update = useUpdateSubscriber();
+  const remove = useDeleteSubscriber();
+  const importCSV = useImportSubscribers();
+  const exportCSV = useSubscriberExport();
+  const { localization } = usePluginOverrides(NEWSLETTER_PLUGIN_ID);
+  const pending = create.isPending || update.isPending || remove.isPending || importCSV.isPending || exportCSV.isFetching;
+  const run = async (action) => {
+    setError("");
+    setMessage("");
+    try {
+      await action();
+    } catch (caught) {
+      setError(
+        caught instanceof Error ? caught.message : "The subscriber change failed. Try again."
+      );
+    }
+  };
+  const save = (event) => {
+    event.preventDefault();
+    const fields = new FormData(event.currentTarget);
+    const input = {
+      email: String(fields.get("email")),
+      name: String(fields.get("name") || ""),
+      tags: String(fields.get("tags") || "").split(",").map((tag2) => tag2.trim()).filter(Boolean),
+      status: String(fields.get("status"))
+    };
+    void run(async () => {
+      if (editing) await update.mutateAsync({ id: editing.id, data: input });
+      else await create.mutateAsync(input);
+      setEditing(void 0);
+      setMessage("Subscriber saved");
+    });
+  };
+  return /* @__PURE__ */ jsxs(
+    NewsletterPage,
+    {
+      title: localization?.subscribers ?? "Subscribers",
+      description: "Keep your audience up to date. Target a campaign with the tags you assign here.",
+      action: /* @__PURE__ */ jsx(
+        PermissionAccess,
+        {
+          permission: newsletterPermissions.subscriber.create(),
+          children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              onClick: () => {
+                setEditing(null);
+                setImporting(false);
+              },
+              children: "Add subscriber"
+            }
+          )
+        }
+      ),
+      children: [
+        /* @__PURE__ */ jsx(PermissionAccess, { permission: newsletterPermissions.analytics.read(), children: /* @__PURE__ */ jsx(SubscriberGrowthSection, {}) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3", children: [
+          /* @__PURE__ */ jsx(
+            PermissionAccess,
+            {
+              permission: newsletterPermissions.subscriber.import(),
+              children: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "outline",
+                  disabled: pending,
+                  onClick: () => {
+                    setImporting(!importing);
+                    setEditing(void 0);
+                  },
+                  children: "Import CSV"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            PermissionAccess,
+            {
+              permission: newsletterPermissions.subscriber.export(),
+              children: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "outline",
+                  disabled: pending,
+                  onClick: () => void run(async () => {
+                    const result = await exportCSV.refetch();
+                    if (result.error) throw result.error;
+                    const csv = result.data?.csv;
+                    if (csv === void 0)
+                      throw new Error("CSV could not be exported. Try again.");
+                    const url = URL.createObjectURL(
+                      new Blob([csv], { type: "text/csv;charset=utf-8" })
+                    );
+                    const anchor = document.createElement("a");
+                    anchor.href = url;
+                    anchor.download = "subscribers.csv";
+                    anchor.click();
+                    URL.revokeObjectURL(url);
+                    setMessage("Subscribers exported");
+                  }),
+                  children: "Export CSV"
+                }
+              )
+            }
+          )
+        ] }),
+        error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-destructive", children: error }),
+        message && /* @__PURE__ */ jsx("p", { role: "status", className: "text-sm", children: message }),
+        editing !== void 0 && /* @__PURE__ */ jsxs(
+          "form",
+          {
+            ref: formRef,
+            className: "space-y-5 rounded-lg border p-5",
+            onSubmit: save,
+            children: [
+              /* @__PURE__ */ jsx("h2", { className: "text-xl font-medium", children: editing ? "Edit subscriber" : "Add subscriber" }),
+              /* @__PURE__ */ jsxs("div", { className: "grid gap-4 sm:grid-cols-2", children: [
+                /* @__PURE__ */ jsx(Field, { id: `${id}-email`, label: "Email", children: /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: `${id}-email`,
+                    name: "email",
+                    type: "email",
+                    required: true,
+                    maxLength: 254,
+                    defaultValue: editing?.email
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(Field, { id: `${id}-name`, label: "Name", children: /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    id: `${id}-name`,
+                    name: "name",
+                    maxLength: 200,
+                    defaultValue: editing?.name ?? ""
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(
+                  Field,
+                  {
+                    id: `${id}-tags`,
+                    label: "Tags",
+                    hint: "Separate tags with commas.",
+                    children: /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        id: `${id}-tags`,
+                        name: "tags",
+                        defaultValue: editing?.tags.join(", ")
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(Field, { id: `${id}-status`, label: "Status", children: /* @__PURE__ */ jsxs(
+                  "select",
+                  {
+                    id: `${id}-status`,
+                    name: "status",
+                    className: selectClass,
+                    defaultValue: editing?.status ?? "subscribed",
+                    children: [
+                      /* @__PURE__ */ jsx("option", { value: "subscribed", children: "Subscribed" }),
+                      /* @__PURE__ */ jsx("option", { value: "unsubscribed", children: "Unsubscribed" }),
+                      /* @__PURE__ */ jsx("option", { value: "bounced", children: "Bounced" })
+                    ]
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
+                /* @__PURE__ */ jsx(Button, { type: "submit", disabled: pending, children: "Save subscriber" }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "outline",
+                    onClick: () => setEditing(void 0),
+                    children: "Cancel"
+                  }
+                )
+              ] })
+            ]
+          },
+          editing?.id ?? "new"
+        ),
+        importing && /* @__PURE__ */ jsxs(
+          "form",
+          {
+            className: "space-y-4 rounded-lg border p-5",
+            onSubmit: (event) => {
+              event.preventDefault();
+              const csv = String(new FormData(event.currentTarget).get("csv"));
+              void run(async () => {
+                const result = await importCSV.mutateAsync(csv);
+                setMessage(`${result.imported} subscribers imported`);
+                setImporting(false);
+              });
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                Field,
+                {
+                  id: `${id}-csv`,
+                  label: "CSV data",
+                  hint: "Use email, name, status and tags columns. Tags are a JSON array in a quoted CSV cell.",
+                  children: /* @__PURE__ */ jsx(
+                    Textarea,
+                    {
+                      id: `${id}-csv`,
+                      name: "csv",
+                      rows: 6,
+                      required: true,
+                      placeholder: "email,name,status,tags\nreader@example.com,Alex,subscribed,"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { type: "submit", disabled: pending, children: "Import subscribers" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "grid gap-4 sm:grid-cols-3", children: [
+          /* @__PURE__ */ jsx(Field, { id: `${id}-search`, label: "Search subscribers", children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: `${id}-search`,
+              type: "search",
+              value: query,
+              onChange: (e) => {
+                setQuery(e.target.value);
+                setOffset(0);
+              },
+              placeholder: "Email or name"
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Field, { id: `${id}-filter-status`, label: "Filter by status", children: /* @__PURE__ */ jsxs(
+            "select",
+            {
+              id: `${id}-filter-status`,
+              className: selectClass,
+              value: status,
+              onChange: (e) => {
+                setStatus(e.target.value);
+                setOffset(0);
+              },
+              children: [
+                /* @__PURE__ */ jsx("option", { value: "", children: "All statuses" }),
+                /* @__PURE__ */ jsx("option", { value: "subscribed", children: "Subscribed" }),
+                /* @__PURE__ */ jsx("option", { value: "unsubscribed", children: "Unsubscribed" }),
+                /* @__PURE__ */ jsx("option", { value: "bounced", children: "Bounced" })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Field, { id: `${id}-filter-tag`, label: "Filter by tag", children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: `${id}-filter-tag`,
+              value: tag,
+              onChange: (e) => {
+                setTag(e.target.value);
+                setOffset(0);
+              },
+              placeholder: "Any tag"
+            }
+          ) })
+        ] }),
+        data.items.length === 0 ? /* @__PURE__ */ jsx("p", { className: "py-8 text-muted-foreground", children: "No subscribers match. Add a subscriber or adjust your filters." }) : /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-lg border", children: /* @__PURE__ */ jsxs("table", { className: "w-full min-w-[650px] text-left text-sm", children: [
+          /* @__PURE__ */ jsx("caption", { className: "sr-only", children: "Newsletter subscribers" }),
+          /* @__PURE__ */ jsx("thead", { className: "border-b bg-muted/40", children: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx("th", { className: "p-4 font-medium", children: "Email" }),
+            /* @__PURE__ */ jsx("th", { className: "p-4 font-medium", children: "Status" }),
+            /* @__PURE__ */ jsx("th", { className: "p-4 font-medium", children: "Tags" }),
+            /* @__PURE__ */ jsx("th", { className: "p-4 font-medium", children: "Actions" })
+          ] }) }),
+          /* @__PURE__ */ jsx("tbody", { children: data.items.map((subscriber) => /* @__PURE__ */ jsxs("tr", { className: "border-b last:border-0", children: [
+            /* @__PURE__ */ jsxs("td", { className: "p-4", children: [
+              subscriber.email,
+              subscriber.name && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: subscriber.name })
+            ] }),
+            /* @__PURE__ */ jsx("td", { className: "p-4", children: /* @__PURE__ */ jsx(Status, { value: subscriber.status }) }),
+            /* @__PURE__ */ jsx("td", { className: "p-4", children: subscriber.tags.join(", ") || "\u2014" }),
+            /* @__PURE__ */ jsx("td", { className: "p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ jsx(
+                PermissionAccess,
+                {
+                  permission: newsletterPermissions.subscriber.update({
+                    subscriberId: subscriber.id,
+                    status: subscriber.status
+                  }),
+                  children: /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      className: "min-h-11",
+                      variant: "outline",
+                      "aria-label": `Edit ${subscriber.email}`,
+                      onClick: () => {
+                        setEditing(subscriber);
+                        setImporting(false);
+                      },
+                      children: "Edit"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                PermissionAccess,
+                {
+                  permission: newsletterPermissions.subscriber.delete({
+                    subscriberId: subscriber.id,
+                    status: subscriber.status
+                  }),
+                  children: /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      className: "min-h-11",
+                      variant: "outline",
+                      "aria-label": `Delete ${subscriber.email}`,
+                      disabled: pending,
+                      onClick: () => setDeleting(subscriber),
+                      children: "Delete"
+                    }
+                  )
+                }
+              )
+            ] }) })
+          ] }, subscriber.id)) })
+        ] }) }),
+        /* @__PURE__ */ jsx(Pagination, { offset, total: data.total, onChange: setOffset }),
+        /* @__PURE__ */ jsx(
+          AlertDialog,
+          {
+            open: !!deleting,
+            onOpenChange: (open) => {
+              if (!open) setDeleting(void 0);
+            },
+            children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [
+              /* @__PURE__ */ jsxs(AlertDialogHeader, { children: [
+                /* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete subscriber?" }),
+                /* @__PURE__ */ jsxs(AlertDialogDescription, { children: [
+                  deleting?.email,
+                  " will be removed from your subscriber list."
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [
+                /* @__PURE__ */ jsx(AlertDialogCancel, { children: "Cancel" }),
+                /* @__PURE__ */ jsx(
+                  AlertDialogAction,
+                  {
+                    onClick: () => {
+                      const subscriber = deleting;
+                      if (subscriber)
+                        void run(async () => {
+                          await remove.mutateAsync(subscriber.id);
+                          setMessage("Subscriber deleted");
+                          if (data.items.length === 1 && offset > 0)
+                            setOffset(offset - 25);
+                        });
+                    },
+                    children: "Delete subscriber"
+                  }
+                )
+              ] })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+function SubscriberGrowthSection() {
+  const { data: growth } = useSubscriberGrowth();
+  return /* @__PURE__ */ jsx(SubscriberGrowthChart, { growth });
+}
+function SubscriberGrowthChart({ growth }) {
+  const max = Math.max(1, ...growth.points.map((point) => point.count));
+  const points = growth.points.map(
+    (point, index) => `${growth.points.length === 1 ? 300 : 20 + index / (growth.points.length - 1) * 560},${130 - point.count / max * 110}`
+  ).join(" ");
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-labelledby": "newsletter-growth-title",
+      className: "grid gap-6 border-b pb-6 sm:grid-cols-[1fr_2fr]",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsx("h2", { id: "newsletter-growth-title", className: "text-lg font-medium", children: "Subscriber growth" }),
+          /* @__PURE__ */ jsxs("p", { className: "text-3xl font-semibold tabular-nums", children: [
+            growth.total.toLocaleString(),
+            " ",
+            /* @__PURE__ */ jsx("span", { className: "text-base font-normal text-muted-foreground", children: "total subscribers" })
+          ] }),
+          /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+            growth.subscribed,
+            " subscribed, ",
+            growth.unsubscribed,
+            " unsubscribed,",
+            " ",
+            growth.bounced,
+            " bounced"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-w-0", children: growth.points.length ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              viewBox: "0 0 600 150",
+              role: "img",
+              "aria-label": "Cumulative subscribers over time",
+              className: "h-32 w-full text-primary",
+              children: [
+                /* @__PURE__ */ jsx("title", { children: "Cumulative subscribers over time" }),
+                /* @__PURE__ */ jsx(
+                  "line",
+                  {
+                    x1: "20",
+                    y1: "130",
+                    x2: "580",
+                    y2: "130",
+                    stroke: "currentColor",
+                    opacity: "0.2"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "polyline",
+                  {
+                    points,
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "3"
+                  }
+                ),
+                growth.points.length === 1 && /* @__PURE__ */ jsx(
+                  "circle",
+                  {
+                    cx: "300",
+                    cy: 130 - growth.points[0].count / max * 110,
+                    r: "4",
+                    fill: "currentColor"
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex justify-between gap-4 text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("span", { children: growth.points[0]?.date }),
+            /* @__PURE__ */ jsx("span", { children: growth.points.at(-1)?.date })
+          ] }),
+          /* @__PURE__ */ jsxs("details", { className: "mt-2 text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("summary", { className: "cursor-pointer", children: "View growth data" }),
+            /* @__PURE__ */ jsx("ul", { className: "mt-2 space-y-1", children: growth.points.map((point) => /* @__PURE__ */ jsxs("li", { children: [
+              point.date,
+              ": ",
+              point.count,
+              " subscribers"
+            ] }, point.date)) })
+          ] })
+        ] }) : /* @__PURE__ */ jsx("p", { className: "py-8 text-sm text-muted-foreground", children: "Growth appears after your first subscriber joins." }) })
+      ]
+    }
+  );
+}
+
+export { SubscribersPage };

package/dist/packages/stack/src/plugins/newsletter/client/components/pages.cjs

@@ -0,0 +1,91 @@
+"use client";
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const React = require('react');
+const components = require('@btst/stack/client/components');
+const plugins_newsletter_permissions = require('../../../../../../../plugins/newsletter/permissions.cjs');
+const shared = require('./shared.cjs');
+
+const Subscribers = React.lazy(
+  () => import('./pages/subscribers-page.internal.cjs').then((m) => ({
+    default: m.SubscribersPage
+  }))
+);
+const Campaigns = React.lazy(
+  () => import('./pages/campaigns-page.internal.cjs').then((m) => ({
+    default: m.CampaignsPage
+  }))
+);
+const Editor = React.lazy(
+  () => import('./pages/edit-campaign-page.internal.cjs').then((m) => ({
+    default: m.EditCampaignPage
+  }))
+);
+const Stats = React.lazy(
+  () => import('./pages/campaign-stats-page.internal.cjs').then((m) => ({
+    default: m.CampaignStatsPage
+  }))
+);
+const boundary = {
+  ErrorComponent: shared.NewsletterError,
+  LoadingComponent: shared.NewsletterLoading,
+  NotFoundComponent: shared.NewsletterNotFound,
+  onError: (error) => console.error("[btst/newsletter]", error)
+};
+function SubscribersPageComponent() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    components.ComposedRoute,
+    {
+      ...boundary,
+      path: "/newsletter/subscribers",
+      permission: plugins_newsletter_permissions.newsletterPermissions.subscriber.read({
+        scope: "collection"
+      }),
+      PageComponent: Subscribers
+    }
+  );
+}
+function CampaignsPageComponent() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    components.ComposedRoute,
+    {
+      ...boundary,
+      path: "/newsletter/campaigns",
+      permission: plugins_newsletter_permissions.newsletterPermissions.campaign.read({ scope: "collection" }),
+      PageComponent: Campaigns
+    }
+  );
+}
+function EditCampaignPageComponent({ id }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    components.ComposedRoute,
+    {
+      ...boundary,
+      path: id ? `/newsletter/campaigns/${id}` : "/newsletter/campaigns/new",
+      permission: id ? plugins_newsletter_permissions.newsletterPermissions.campaign.read({
+        scope: "record",
+        campaignId: id
+      }) : plugins_newsletter_permissions.newsletterPermissions.campaign.create(),
+      PageComponent: Editor,
+      props: { id }
+    }
+  );
+}
+function CampaignStatsPageComponent({ id }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    components.ComposedRoute,
+    {
+      ...boundary,
+      path: `/newsletter/campaigns/${id}/stats`,
+      permission: plugins_newsletter_permissions.newsletterPermissions.analytics.read(),
+      PageComponent: Stats,
+      props: { id }
+    }
+  );
+}
+
+exports.CampaignStatsPageComponent = CampaignStatsPageComponent;
+exports.CampaignsPageComponent = CampaignsPageComponent;
+exports.EditCampaignPageComponent = EditCampaignPageComponent;
+exports.SubscribersPageComponent = SubscribersPageComponent;

package/dist/packages/stack/src/plugins/newsletter/client/components/pages.mjs

@@ -0,0 +1,86 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { lazy } from 'react';
+import { ComposedRoute } from '@btst/stack/client/components';
+import { newsletterPermissions } from '../../../../../../../plugins/newsletter/permissions.mjs';
+import { NewsletterNotFound, NewsletterLoading, NewsletterError } from './shared.mjs';
+
+const Subscribers = lazy(
+  () => import('./pages/subscribers-page.internal.mjs').then((m) => ({
+    default: m.SubscribersPage
+  }))
+);
+const Campaigns = lazy(
+  () => import('./pages/campaigns-page.internal.mjs').then((m) => ({
+    default: m.CampaignsPage
+  }))
+);
+const Editor = lazy(
+  () => import('./pages/edit-campaign-page.internal.mjs').then((m) => ({
+    default: m.EditCampaignPage
+  }))
+);
+const Stats = lazy(
+  () => import('./pages/campaign-stats-page.internal.mjs').then((m) => ({
+    default: m.CampaignStatsPage
+  }))
+);
+const boundary = {
+  ErrorComponent: NewsletterError,
+  LoadingComponent: NewsletterLoading,
+  NotFoundComponent: NewsletterNotFound,
+  onError: (error) => console.error("[btst/newsletter]", error)
+};
+function SubscribersPageComponent() {
+  return /* @__PURE__ */ jsx(
+    ComposedRoute,
+    {
+      ...boundary,
+      path: "/newsletter/subscribers",
+      permission: newsletterPermissions.subscriber.read({
+        scope: "collection"
+      }),
+      PageComponent: Subscribers
+    }
+  );
+}
+function CampaignsPageComponent() {
+  return /* @__PURE__ */ jsx(
+    ComposedRoute,
+    {
+      ...boundary,
+      path: "/newsletter/campaigns",
+      permission: newsletterPermissions.campaign.read({ scope: "collection" }),
+      PageComponent: Campaigns
+    }
+  );
+}
+function EditCampaignPageComponent({ id }) {
+  return /* @__PURE__ */ jsx(
+    ComposedRoute,
+    {
+      ...boundary,
+      path: id ? `/newsletter/campaigns/${id}` : "/newsletter/campaigns/new",
+      permission: id ? newsletterPermissions.campaign.read({
+        scope: "record",
+        campaignId: id
+      }) : newsletterPermissions.campaign.create(),
+      PageComponent: Editor,
+      props: { id }
+    }
+  );
+}
+function CampaignStatsPageComponent({ id }) {
+  return /* @__PURE__ */ jsx(
+    ComposedRoute,
+    {
+      ...boundary,
+      path: `/newsletter/campaigns/${id}/stats`,
+      permission: newsletterPermissions.analytics.read(),
+      PageComponent: Stats,
+      props: { id }
+    }
+  );
+}
+
+export { CampaignStatsPageComponent, CampaignsPageComponent, EditCampaignPageComponent, SubscribersPageComponent };