@fonderie/vue-admin-screens 1.1.0 → 1.2.0

package/dist/index.cjs

@@ -29,6 +29,7 @@ __export(index_exports, {
   EnvironmentScreen: () => EnvironmentScreen,
   MigrationsScreen: () => MigrationsScreen,
   ModulesScreen: () => ModulesScreen,
+  OperatorsScreen: () => OperatorsScreen,
   RoutesScreen: () => RoutesScreen,
   SubscriberScreen: () => SubscriberScreen,
   TokensScreen: () => TokensScreen,
@@ -39,7 +40,7 @@ module.exports = __toCommonJS(index_exports);
 // src/screens/AdminShell.ts
 var import_vue_config_admin_screens = require("@fonderie/vue-config-admin-screens");
 var import_vue_courier_admin_screens = require("@fonderie/vue-courier-admin-screens");
-var import_vue15 = require("vue");
+var import_vue16 = require("vue");
 
 // src/styles.ts
 var t = {
@@ -1205,42 +1206,319 @@ var MigrationsScreen = (0, import_vue9.defineComponent)({
   }
 });
 
-// src/screens/TokensScreen.ts
+// src/screens/OperatorsScreen.ts
 var import_vue_admin8 = require("@fonderie/vue-admin");
 var import_vue10 = require("vue");
+var LEVELS = [
+  { label: "Read only", scopes: ["read"], hint: "look around, change nothing" },
+  { label: "Editor", scopes: ["read", "write"], hint: "change config, templates, users" },
+  {
+    label: "Owner",
+    scopes: ["read", "write", "secrets"],
+    hint: "secrets, tokens and operators too"
+  }
+];
+var levelOf = (scopes) => scopes.includes("secrets") ? "Owner" : scopes.includes("write") ? "Editor" : "Read only";
+var scopesFor = (label) => LEVELS.find((l) => l.label === label)?.scopes ?? ["read"];
+var small = { height: "28px" };
+var OperatorsScreen = (0, import_vue10.defineComponent)({
+  name: "FonderieOperatorsScreen",
+  props: {
+    client: { type: Object, required: true },
+    // The signed-in operator's email: their own row offers no disable or
+    // recovery (the server refuses both for yourself anyway).
+    me: { type: String, default: void 0 }
+  },
+  setup(props) {
+    const { report, isLoading, error, invite, recover, update, revokeLink } = (0, import_vue_admin8.useAdminOperators)(
+      props.client
+    );
+    const email = (0, import_vue10.ref)("");
+    const level = (0, import_vue10.ref)("Editor");
+    const minted = (0, import_vue10.ref)(null);
+    const copied = (0, import_vue10.ref)(false);
+    const status = (o) => o.disabledAt ? pill("neutral", "disabled") : o.locked ? pill("warn", "locked") : !o.enrolled ? pill("warn", "setting up") : pill("ok", "active");
+    const mintedNotice = (link) => {
+      const url = `${window.location.origin}${link.url}`;
+      return (0, import_vue10.h)(
+        "div",
+        {
+          style: {
+            ...styles.notice,
+            background: "color-mix(in srgb, var(--fonderie-accent,#00d294) 10%, transparent)",
+            borderColor: "color-mix(in srgb, var(--fonderie-accent,#00d294) 35%, transparent)"
+          }
+        },
+        [
+          (0, import_vue10.h)("strong", `Send this link to ${link.email}. It is shown once.`),
+          ` It works once and expires ${new Date(link.expiresAt).toLocaleString()}.`,
+          (0, import_vue10.h)(
+            "div",
+            { style: { display: "flex", gap: "8px", marginTop: "8px", alignItems: "center" } },
+            [
+              (0, import_vue10.h)(
+                "code",
+                { style: { ...styles.code, flex: 1, padding: "7px 10px", wordBreak: "break-all" } },
+                url
+              ),
+              (0, import_vue10.h)(
+                "button",
+                {
+                  type: "button",
+                  style: styles.button,
+                  onClick: () => {
+                    void navigator.clipboard?.writeText(url);
+                    copied.value = true;
+                  }
+                },
+                copied.value ? "Copied" : "Copy"
+              ),
+              (0, import_vue10.h)(
+                "button",
+                {
+                  type: "button",
+                  style: styles.buttonGhost,
+                  "aria-label": "Dismiss",
+                  onClick: () => {
+                    minted.value = null;
+                    copied.value = false;
+                  }
+                },
+                [icon("close", 14)]
+              )
+            ]
+          )
+        ]
+      );
+    };
+    const setMinted = (l) => {
+      copied.value = false;
+      minted.value = l;
+    };
+    return () => {
+      const r = report.value;
+      const e = error.value;
+      return (0, import_vue10.h)("div", { style: styles.container }, [
+        pageHeader(
+          "Operators",
+          "The people who can sign in to this console. Each one uses a password and an authenticator app; there is no sign-up."
+        ),
+        e ? (0, import_vue10.h)(
+          "p",
+          { style: styles.error, role: "alert" },
+          e.status === 403 && e.reason === "FORBIDDEN" ? "Managing operators needs the Owner level." : e.explanation
+        ) : null,
+        minted.value ? mintedNotice(minted.value) : null,
+        (0, import_vue10.h)(
+          "form",
+          {
+            style: {
+              ...styles.card,
+              display: "flex",
+              gap: "8px",
+              alignItems: "center",
+              flexWrap: "wrap",
+              marginBottom: "20px"
+            },
+            onSubmit: (ev) => {
+              ev.preventDefault();
+              void invite({ email: email.value.trim(), scopes: scopesFor(level.value) }).then((l) => {
+                setMinted(l);
+                email.value = "";
+              }).catch(() => {
+              });
+            }
+          },
+          [
+            icon("users", 16),
+            (0, import_vue10.h)("strong", { style: { fontSize: "13.5px", marginRight: "4px" } }, "Invite"),
+            (0, import_vue10.h)("input", {
+              type: "email",
+              required: true,
+              value: email.value,
+              onInput: (ev) => email.value = ev.target.value,
+              placeholder: "teammate@company.com",
+              style: { ...styles.input, flex: 1, minWidth: "220px" },
+              "aria-label": "Email to invite"
+            }),
+            (0, import_vue10.h)(
+              "select",
+              {
+                value: level.value,
+                onChange: (ev) => level.value = ev.target.value,
+                style: styles.input,
+                "aria-label": "Access level"
+              },
+              LEVELS.map(
+                (l) => (0, import_vue10.h)("option", { key: l.label, value: l.label }, `${l.label} \u2014 ${l.hint}`)
+              )
+            ),
+            (0, import_vue10.h)(
+              "button",
+              { type: "submit", style: styles.buttonPrimary, disabled: !email.value.trim() },
+              [icon("plus", 14), "Create invite link"]
+            )
+          ]
+        ),
+        isLoading.value && !r ? (0, import_vue10.h)("p", { style: styles.status }, "Loading\u2026") : r && r.operators.length === 0 ? empty("No operators yet", void 0, "users") : r ? table(
+          ["Operator", "Access", "Status", "Last sign-in", ""],
+          r.operators.map((o) => {
+            const mine = o.email === props.me;
+            return (0, import_vue10.h)("tr", { key: o.id }, [
+              td([
+                (0, import_vue10.h)("div", { style: { fontWeight: 600 } }, o.name || o.email),
+                o.name ? (0, import_vue10.h)("div", { style: styles.muted }, o.email) : null
+              ]),
+              td(
+                (0, import_vue10.h)(
+                  "select",
+                  {
+                    value: levelOf(o.scopes),
+                    disabled: mine,
+                    onChange: (ev) => void update(o.id, {
+                      scopes: scopesFor(ev.target.value)
+                    }).catch(() => {
+                    }),
+                    style: { ...styles.input, ...small, fontSize: "12.5px" },
+                    "aria-label": `Access level for ${o.email}`
+                  },
+                  LEVELS.map((l) => (0, import_vue10.h)("option", { key: l.label, value: l.label }, l.label))
+                )
+              ),
+              td([
+                status(o),
+                o.enrolled && o.backupCodesLeft <= 2 && !o.disabledAt ? (0, import_vue10.h)(
+                  "div",
+                  { style: { ...styles.muted, marginTop: "4px" } },
+                  `${o.backupCodesLeft} backup code(s) left`
+                ) : null
+              ]),
+              td(o.lastLoginAt ? new Date(o.lastLoginAt).toLocaleString() : "never", {
+                ...styles.muted,
+                whiteSpace: "nowrap"
+              }),
+              td(
+                mine ? (0, import_vue10.h)("span", { style: styles.muted }, "you") : [
+                  (0, import_vue10.h)(
+                    "button",
+                    {
+                      type: "button",
+                      style: { ...styles.button, ...small, marginRight: "6px" },
+                      onClick: () => {
+                        if (window.confirm(
+                          `Create a recovery link for ${o.email}? It signs them out everywhere; the link sets a new password and a new authenticator.`
+                        ))
+                          void recover(o.id).then(setMinted).catch(() => {
+                          });
+                      }
+                    },
+                    "Recovery link"
+                  ),
+                  (0, import_vue10.h)(
+                    "button",
+                    {
+                      type: "button",
+                      style: {
+                        ...o.disabledAt ? styles.button : styles.buttonDanger,
+                        ...small
+                      },
+                      onClick: () => {
+                        if (o.disabledAt || window.confirm(
+                          `Disable ${o.email}? They are signed out immediately.`
+                        ))
+                          void update(o.id, { disabled: !o.disabledAt }).catch(
+                            () => {
+                            }
+                          );
+                      }
+                    },
+                    o.disabledAt ? "Enable" : "Disable"
+                  )
+                ],
+                { textAlign: "right", whiteSpace: "nowrap" }
+              )
+            ]);
+          })
+        ) : null,
+        r && r.links.length > 0 ? [
+          (0, import_vue10.h)("h2", { style: styles.subtitle }, "Pending links"),
+          (0, import_vue10.h)(
+            "ul",
+            { style: styles.list },
+            r.links.map(
+              (l) => (0, import_vue10.h)(
+                "li",
+                {
+                  key: l.id,
+                  style: { ...styles.row, display: "flex", gap: "12px", alignItems: "center" }
+                },
+                [
+                  pill(l.kind === "invite" ? "info" : "warn", l.kind, false),
+                  (0, import_vue10.h)("span", { style: { flex: 1 } }, [
+                    l.email,
+                    l.kind === "invite" ? (0, import_vue10.h)("span", { style: styles.muted }, ` \xB7 ${levelOf(l.scopes)}`) : null
+                  ]),
+                  (0, import_vue10.h)(
+                    "span",
+                    { style: styles.muted },
+                    `expires ${new Date(l.expiresAt).toLocaleString()}`
+                  ),
+                  (0, import_vue10.h)(
+                    "button",
+                    {
+                      type: "button",
+                      style: { ...styles.buttonDanger, ...small },
+                      onClick: () => void revokeLink(l.id).catch(() => {
+                      })
+                    },
+                    "Revoke"
+                  )
+                ]
+              )
+            )
+          )
+        ] : null
+      ]);
+    };
+  }
+});
+
+// src/screens/TokensScreen.ts
+var import_vue_admin9 = require("@fonderie/vue-admin");
+var import_vue11 = require("vue");
 var ALL = ["read", "write", "secrets"];
-var TokensScreen = (0, import_vue10.defineComponent)({
+var TokensScreen = (0, import_vue11.defineComponent)({
   name: "FonderieTokensScreen",
   props: { client: { type: Object, required: true } },
   setup(props) {
-    const { report, isLoading, error, issue, revoke } = (0, import_vue_admin8.useAdminTokens)(props.client);
-    const name = (0, import_vue10.ref)("");
-    const scopes = (0, import_vue10.ref)(["read"]);
-    const days = (0, import_vue10.ref)("");
-    const minted = (0, import_vue10.ref)(null);
+    const { report, isLoading, error, issue, revoke } = (0, import_vue_admin9.useAdminTokens)(props.client);
+    const name = (0, import_vue11.ref)("");
+    const scopes = (0, import_vue11.ref)(["read"]);
+    const days = (0, import_vue11.ref)("");
+    const minted = (0, import_vue11.ref)(null);
     const toggle = (s) => scopes.value = scopes.value.includes(s) ? scopes.value.filter((x) => x !== s) : [...scopes.value, s];
     return () => {
       const r = report.value;
-      return (0, import_vue10.h)("div", { style: styles.container }, [
+      return (0, import_vue11.h)("div", { style: styles.container }, [
         pageHeader(
-          "Access",
-          "Who can open this surface: the root token's strength, scoped tokens you have issued, and any legacy per-module tokens."
+          "Tokens",
+          "Credentials for machines: the root token's strength, scoped tokens for the CLI and CI, and any legacy per-module tokens. People sign in as operators."
         ),
-        error.value ? (0, import_vue10.h)(
+        error.value ? (0, import_vue11.h)(
           "p",
           { style: styles.error, role: "alert" },
           error.value.status === 401 ? "Issuing and revoking need the root token (the one in your deployment config)." : error.value.explanation
         ) : null,
-        (0, import_vue10.h)("h2", { style: { ...styles.subtitle, marginTop: 0 } }, "Root token"),
-        r ? (0, import_vue10.h)(
+        (0, import_vue11.h)("h2", { style: { ...styles.subtitle, marginTop: 0 } }, "Root token"),
+        r ? (0, import_vue11.h)(
           "div",
           { style: { ...styles.card, display: "flex", gap: "12px", alignItems: "flex-start" } },
           [
             icon("lock", 18, { marginTop: "2px" }),
-            (0, import_vue10.h)("div", [
+            (0, import_vue11.h)("div", [
               pill(r.admin.ok ? "ok" : "bad", r.admin.ok ? "strong" : "weak"),
               ...r.admin.problems.map(
-                (p) => (0, import_vue10.h)(
+                (p) => (0, import_vue11.h)(
                   "div",
                   {
                     key: p.message,
@@ -1256,13 +1534,13 @@ var TokensScreen = (0, import_vue10.defineComponent)({
             ])
           ]
         ) : null,
-        (0, import_vue10.h)("h2", { style: styles.subtitle }, "Issued tokens"),
-        r?.issued === null ? (0, import_vue10.h)(
+        (0, import_vue11.h)("h2", { style: styles.subtitle }, "Issued tokens"),
+        r?.issued === null ? (0, import_vue11.h)(
           "p",
           { style: styles.muted },
           "Issuing is off \u2014 give AdminModule a store and run its migrations."
         ) : [
-          minted.value ? (0, import_vue10.h)(
+          minted.value ? (0, import_vue11.h)(
             "div",
             {
               style: {
@@ -1272,9 +1550,9 @@ var TokensScreen = (0, import_vue10.defineComponent)({
               }
             },
             [
-              (0, import_vue10.h)("strong", "Copy this now \u2014 it is never shown again."),
+              (0, import_vue11.h)("strong", "Copy this now \u2014 it is never shown again."),
               ` (${minted.value.name})`,
-              (0, import_vue10.h)(
+              (0, import_vue11.h)(
                 "div",
                 {
                   style: {
@@ -1289,7 +1567,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
               )
             ]
           ) : null,
-          (0, import_vue10.h)(
+          (0, import_vue11.h)(
             "form",
             {
               style: styles.toolbar,
@@ -1309,7 +1587,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
               }
             },
             [
-              (0, import_vue10.h)("input", {
+              (0, import_vue11.h)("input", {
                 value: name.value,
                 onInput: (e) => name.value = e.target.value,
                 placeholder: "name",
@@ -1317,7 +1595,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
                 "aria-label": "Name"
               }),
               ...ALL.map(
-                (s) => (0, import_vue10.h)(
+                (s) => (0, import_vue11.h)(
                   "label",
                   {
                     key: s,
@@ -1331,7 +1609,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
                     }
                   },
                   [
-                    (0, import_vue10.h)("input", {
+                    (0, import_vue11.h)("input", {
                       type: "checkbox",
                       checked: scopes.value.includes(s),
                       onChange: () => toggle(s)
@@ -1340,14 +1618,14 @@ var TokensScreen = (0, import_vue10.defineComponent)({
                   ]
                 )
               ),
-              (0, import_vue10.h)("input", {
+              (0, import_vue11.h)("input", {
                 value: days.value,
                 onInput: (e) => days.value = e.target.value,
                 placeholder: "days (optional)",
                 style: { ...styles.input, width: "140px" },
                 "aria-label": "Days"
               }),
-              (0, import_vue10.h)(
+              (0, import_vue11.h)(
                 "button",
                 {
                   type: "submit",
@@ -1361,7 +1639,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
           r?.issued && r.issued.length > 0 ? table(
             ["Name", "Scopes", "Created", "Expires", "Last used", ""],
             r.issued.map(
-              (t2) => (0, import_vue10.h)("tr", { key: t2.id }, [
+              (t2) => (0, import_vue11.h)("tr", { key: t2.id }, [
                 td([t2.name, t2.revokedAt ? [" ", pill("neutral", "revoked")] : ""]),
                 td(t2.scopes.join(", "), styles.mono),
                 td(
@@ -1377,7 +1655,7 @@ var TokensScreen = (0, import_vue10.defineComponent)({
                   styles.muted
                 ),
                 td(
-                  t2.revokedAt ? "" : (0, import_vue10.h)(
+                  t2.revokedAt ? "" : (0, import_vue11.h)(
                     "button",
                     {
                       type: "button",
@@ -1401,19 +1679,19 @@ var TokensScreen = (0, import_vue10.defineComponent)({
             "tokens"
           )
         ],
-        (0, import_vue10.h)("h2", { style: styles.subtitle }, "Legacy per-brick tokens"),
-        r && r.legacy.length === 0 ? (0, import_vue10.h)(
+        (0, import_vue11.h)("h2", { style: styles.subtitle }, "Legacy per-brick tokens"),
+        r && r.legacy.length === 0 ? (0, import_vue11.h)(
           "p",
           { style: styles.muted },
           "None \u2014 every brick's admin surface goes through this token."
-        ) : (0, import_vue10.h)(
+        ) : (0, import_vue11.h)(
           "ul",
           { style: styles.list },
           (r?.legacy ?? []).map(
-            (l) => (0, import_vue10.h)("li", { key: l.module, style: styles.row }, [
-              (0, import_vue10.h)("span", { style: styles.mono }, l.module),
+            (l) => (0, import_vue11.h)("li", { key: l.module, style: styles.row }, [
+              (0, import_vue11.h)("span", { style: styles.mono }, l.module),
               " ",
-              (0, import_vue10.h)(
+              (0, import_vue11.h)(
                 "span",
                 { style: styles.muted },
                 "still registers its standalone routes with its own token (deprecated)"
@@ -1428,29 +1706,29 @@ var TokensScreen = (0, import_vue10.defineComponent)({
 
 // src/screens/UsersScreen.ts
 var import_client = require("@fonderie/client");
-var import_vue_admin9 = require("@fonderie/vue-admin");
-var import_vue11 = require("vue");
-var UsersScreen = (0, import_vue11.defineComponent)({
+var import_vue_admin10 = require("@fonderie/vue-admin");
+var import_vue12 = require("vue");
+var UsersScreen = (0, import_vue12.defineComponent)({
   name: "FonderieUsersScreen",
   props: {
     client: { type: Object, required: true },
     pageSize: { type: Number, default: 50 }
   },
   setup(props) {
-    const input = (0, import_vue11.ref)("");
-    const email = (0, import_vue11.ref)("");
-    const selectedId = (0, import_vue11.ref)("");
-    const list = (0, import_vue_admin9.useAdminUsers)(props.client, { limit: props.pageSize });
-    const { user, isLoading, error, suspend, unsuspend, revokeSessions } = (0, import_vue_admin9.useAdminUser)(
+    const input = (0, import_vue12.ref)("");
+    const email = (0, import_vue12.ref)("");
+    const selectedId = (0, import_vue12.ref)("");
+    const list = (0, import_vue_admin10.useAdminUsers)(props.client, { limit: props.pageSize });
+    const { user, isLoading, error, suspend, unsuspend, revokeSessions } = (0, import_vue_admin10.useAdminUser)(
       props.client,
       { email, id: selectedId }
     );
-    const userId = (0, import_vue11.computed)(() => user.value?.id ?? null);
-    const sessions = (0, import_vue_admin9.useAdminUserSessions)(props.client, userId);
-    const history = (0, import_vue_admin9.useAdminLoginHistory)(props.client, userId, { limit: 20 });
-    const showList = (0, import_vue11.computed)(() => !email.value && !selectedId.value);
+    const userId = (0, import_vue12.computed)(() => user.value?.id ?? null);
+    const sessions = (0, import_vue_admin10.useAdminUserSessions)(props.client, userId);
+    const history = (0, import_vue_admin10.useAdminLoginHistory)(props.client, userId, { limit: 20 });
+    const showList = (0, import_vue12.computed)(() => !email.value && !selectedId.value);
     const yesNo = (v) => v ? pill("ok", "yes") : pill("neutral", "no");
-    const row = (k, v) => (0, import_vue11.h)("tr", [td(k), td(v)]);
+    const row = (k, v) => (0, import_vue12.h)("tr", [td(k), td(v)]);
     const clear = () => {
       email.value = "";
       selectedId.value = "";
@@ -1458,12 +1736,12 @@ var UsersScreen = (0, import_vue11.defineComponent)({
     };
     return () => {
       const u = user.value;
-      return (0, import_vue11.h)("div", { style: styles.container }, [
+      return (0, import_vue12.h)("div", { style: styles.container }, [
         pageHeader(
           "Users",
           "Everyone signed up. Open an account for its sessions, sign-ins and the suspend and sign-out controls."
         ),
-        (0, import_vue11.h)(
+        (0, import_vue12.h)(
           "form",
           {
             style: styles.toolbar,
@@ -1474,7 +1752,7 @@ var UsersScreen = (0, import_vue11.defineComponent)({
             }
           },
           [
-            (0, import_vue11.h)("input", {
+            (0, import_vue12.h)("input", {
               type: "email",
               value: input.value,
               onInput: (e) => input.value = e.target.value,
@@ -1482,7 +1760,7 @@ var UsersScreen = (0, import_vue11.defineComponent)({
               style: { ...styles.input, minWidth: "280px" },
               "aria-label": "Email"
             }),
-            (0, import_vue11.h)(
+            (0, import_vue12.h)(
               "button",
               { type: "submit", style: styles.buttonPrimary, disabled: isLoading.value },
               [icon("search", 14), "Look up"]
@@ -1490,14 +1768,14 @@ var UsersScreen = (0, import_vue11.defineComponent)({
             showList.value ? refreshButton("Refresh", list.isLoading.value, () => void list.refresh()) : actionButton([icon("back", 14), "All users"], false, clear, styles.buttonGhost)
           ]
         ),
-        showList.value ? (0, import_vue11.h)("div", [
-          list.error.value ? (0, import_vue11.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
+        showList.value ? (0, import_vue12.h)("div", [
+          list.error.value ? (0, import_vue12.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
           list.users.value.length === 0 && !list.isLoading.value ? empty("No users yet", "Sign-ups appear here as they happen.", "users") : table(
             ["Email", "Name", "Created", "Status"],
             list.users.value.map(
-              (u2) => (0, import_vue11.h)("tr", { key: u2.id }, [
+              (u2) => (0, import_vue12.h)("tr", { key: u2.id }, [
                 td(
-                  (0, import_vue11.h)(
+                  (0, import_vue12.h)(
                     "button",
                     {
                       type: "button",
@@ -1508,7 +1786,7 @@ var UsersScreen = (0, import_vue11.defineComponent)({
                   )
                 ),
                 td(
-                  `${u2.firstName ?? ""} ${u2.lastName ?? ""}`.trim() || (0, import_vue11.h)("span", { style: styles.muted }, "\u2014")
+                  `${u2.firstName ?? ""} ${u2.lastName ?? ""}`.trim() || (0, import_vue12.h)("span", { style: styles.muted }, "\u2014")
                 ),
                 td(new Date(u2.createdAt).toLocaleDateString()),
                 td(
@@ -1517,24 +1795,24 @@ var UsersScreen = (0, import_vue11.defineComponent)({
               ])
             )
           ),
-          list.isLoading.value ? (0, import_vue11.h)("p", { style: styles.status }, "Loading\u2026") : null,
+          list.isLoading.value ? (0, import_vue12.h)("p", { style: styles.status }, "Loading\u2026") : null,
           list.hasMore.value && !list.isLoading.value ? loadMoreButton(() => void list.loadMore()) : null
         ]) : null,
-        error.value ? (0, import_vue11.h)(
+        error.value ? (0, import_vue12.h)(
           "p",
           { style: styles.error, role: "alert" },
           error.value.status === 404 ? "No user with that email." : error.value.explanation
         ) : null,
         u ? [
-          (0, import_vue11.h)("h2", { style: styles.subtitle }, [
+          (0, import_vue12.h)("h2", { style: styles.subtitle }, [
             u.firstName || u.lastName ? `${u.firstName} ${u.lastName}`.trim() : u.email,
             " ",
             u.suspended ? pill("warn", "suspended") : null,
             u.deletedAt ? pill("neutral", "deleted") : null
           ]),
-          (0, import_vue11.h)("table", { style: styles.table }, [
-            (0, import_vue11.h)("tbody", [
-              row("id", (0, import_vue11.h)("span", { style: styles.mono }, u.id)),
+          (0, import_vue12.h)("table", { style: styles.table }, [
+            (0, import_vue12.h)("tbody", [
+              row("id", (0, import_vue12.h)("span", { style: styles.mono }, u.id)),
               row("email", [u.email, " \xB7 verified ", yesNo(u.isEmailVerified)]),
               row("MFA", yesNo(u.mfaEnabled)),
               row(
@@ -1543,12 +1821,12 @@ var UsersScreen = (0, import_vue11.defineComponent)({
               ),
               row(
                 "last login",
-                u.lastLogin ? new Date(u.lastLogin).toLocaleString() : (0, import_vue11.h)("span", { style: styles.muted }, "never")
+                u.lastLogin ? new Date(u.lastLogin).toLocaleString() : (0, import_vue12.h)("span", { style: styles.muted }, "never")
               ),
               row("created", new Date(u.createdAt).toLocaleString())
             ])
           ]),
-          (0, import_vue11.h)("div", { style: { ...styles.toolbar, marginTop: "12px" } }, [
+          (0, import_vue12.h)("div", { style: { ...styles.toolbar, marginTop: "12px" } }, [
             u.suspended ? actionButton("Unsuspend", isLoading.value, () => void unsuspend()) : actionButton(
               "Suspend",
               isLoading.value,
@@ -1561,19 +1839,19 @@ var UsersScreen = (0, import_vue11.defineComponent)({
               () => void revokeSessions().then(() => sessions.refresh())
             )
           ]),
-          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Live sessions"),
-          sessions.sessions.value.length === 0 ? (0, import_vue11.h)("p", { style: styles.muted }, "None.") : (0, import_vue11.h)(
+          (0, import_vue12.h)("h2", { style: styles.subtitle }, "Live sessions"),
+          sessions.sessions.value.length === 0 ? (0, import_vue12.h)("p", { style: styles.muted }, "None.") : (0, import_vue12.h)(
             "ul",
             { style: styles.list },
             sessions.sessions.value.map(
-              (s) => (0, import_vue11.h)("li", { key: s.id, style: styles.row }, [
-                (0, import_vue11.h)("span", { style: styles.mono }, s.ipAddress ?? "\u2014"),
+              (s) => (0, import_vue12.h)("li", { key: s.id, style: styles.row }, [
+                (0, import_vue12.h)("span", { style: styles.mono }, s.ipAddress ?? "\u2014"),
                 " ",
-                (0, import_vue11.h)("span", { style: styles.muted }, (0, import_client.describeLocation)(s.location) ?? ""),
+                (0, import_vue12.h)("span", { style: styles.muted }, (0, import_client.describeLocation)(s.location) ?? ""),
                 " ",
-                (0, import_vue11.h)("span", { style: styles.muted }, s.userAgent ?? ""),
+                (0, import_vue12.h)("span", { style: styles.muted }, s.userAgent ?? ""),
                 " ",
-                (0, import_vue11.h)(
+                (0, import_vue12.h)(
                   "span",
                   { style: styles.muted },
                   `since ${new Date(s.createdAt).toLocaleString()}`
@@ -1581,22 +1859,22 @@ var UsersScreen = (0, import_vue11.defineComponent)({
               ])
             )
           ),
-          (0, import_vue11.h)("h2", { style: styles.subtitle }, "Recent sign-ins"),
-          history.events.value.length === 0 && !history.isLoading.value ? (0, import_vue11.h)("p", { style: styles.muted }, "None recorded.") : (0, import_vue11.h)(
+          (0, import_vue12.h)("h2", { style: styles.subtitle }, "Recent sign-ins"),
+          history.events.value.length === 0 && !history.isLoading.value ? (0, import_vue12.h)("p", { style: styles.muted }, "None recorded.") : (0, import_vue12.h)(
             "ul",
             { style: styles.list },
             history.events.value.map(
-              (e) => (0, import_vue11.h)("li", { key: e.id, style: styles.row }, [
+              (e) => (0, import_vue12.h)("li", { key: e.id, style: styles.row }, [
                 pill(e.outcome === "success" ? "ok" : "bad", e.outcome),
                 " ",
-                (0, import_vue11.h)("span", { style: styles.muted }, e.method),
+                (0, import_vue12.h)("span", { style: styles.muted }, e.method),
                 " ",
-                (0, import_vue11.h)("span", { style: styles.mono }, e.ipAddress ?? "\u2014"),
+                (0, import_vue12.h)("span", { style: styles.mono }, e.ipAddress ?? "\u2014"),
                 " ",
-                (0, import_vue11.h)("span", { style: styles.muted }, (0, import_client.describeLocation)(e.location) ?? ""),
+                (0, import_vue12.h)("span", { style: styles.muted }, (0, import_client.describeLocation)(e.location) ?? ""),
                 e.location?.proxy || e.location?.hosting ? [" ", pill("warn", e.location.proxy ? "proxy/VPN" : "hosting")] : "",
                 " ",
-                (0, import_vue11.h)("span", { style: styles.muted }, new Date(e.createdAt).toLocaleString())
+                (0, import_vue12.h)("span", { style: styles.muted }, new Date(e.createdAt).toLocaleString())
               ])
             )
           ),
@@ -1608,27 +1886,27 @@ var UsersScreen = (0, import_vue11.defineComponent)({
 });
 
 // src/screens/CatalogScreen.ts
-var import_vue_admin10 = require("@fonderie/vue-admin");
-var import_vue12 = require("vue");
-var CatalogScreen = (0, import_vue12.defineComponent)({
+var import_vue_admin11 = require("@fonderie/vue-admin");
+var import_vue13 = require("vue");
+var CatalogScreen = (0, import_vue13.defineComponent)({
   name: "FonderieCatalogScreen",
   props: { client: { type: Object, required: true } },
   setup(props) {
-    const { catalog, isLoading, error, refresh, deletePlan } = (0, import_vue_admin10.useAdminCatalog)(props.client);
+    const { catalog, isLoading, error, refresh, deletePlan } = (0, import_vue_admin11.useAdminCatalog)(props.client);
     const money = (v) => v == null ? "\u2014" : (v / 100).toFixed(2);
     return () => {
       const c = catalog.value;
-      return (0, import_vue12.h)("div", { style: styles.container }, [
+      return (0, import_vue13.h)("div", { style: styles.container }, [
         pageHeader(
           "Catalog",
           "What you sell: plans as configured in code, and as stored in the database, side by side.",
           [refreshButton("Refresh", isLoading.value, () => void refresh())]
         ),
-        error.value ? (0, import_vue12.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
-        isLoading.value && !c ? (0, import_vue12.h)("p", { style: styles.status }, "Loading\u2026") : null,
+        error.value ? (0, import_vue13.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+        isLoading.value && !c ? (0, import_vue13.h)("p", { style: styles.status }, "Loading\u2026") : null,
         c ? [
-          (0, import_vue12.h)("h2", { style: { ...styles.subtitle, marginTop: 0 } }, "Configured (code)"),
-          (0, import_vue12.h)(
+          (0, import_vue13.h)("h2", { style: { ...styles.subtitle, marginTop: 0 } }, "Configured (code)"),
+          (0, import_vue13.h)(
             "pre",
             {
               style: {
@@ -1642,7 +1920,7 @@ var CatalogScreen = (0, import_vue12.defineComponent)({
             },
             JSON.stringify(c.configured, null, 2)
           ),
-          (0, import_vue12.h)("h2", { style: styles.subtitle }, "Stored (database)"),
+          (0, import_vue13.h)("h2", { style: styles.subtitle }, "Stored (database)"),
           c.stored.length === 0 ? empty(
             "No stored plans",
             "Plans are configured in code; nothing has been written to the database.",
@@ -1650,10 +1928,10 @@ var CatalogScreen = (0, import_vue12.defineComponent)({
           ) : table(
             ["Plan", "Tier", "Seats", "Monthly", "Yearly", "Trial", ""],
             c.stored.map(
-              (p) => (0, import_vue12.h)("tr", { key: p.id }, [
+              (p) => (0, import_vue13.h)("tr", { key: p.id }, [
                 td([
-                  (0, import_vue12.h)("strong", p.name),
-                  p.description ? (0, import_vue12.h)("div", { style: styles.muted }, p.description) : ""
+                  (0, import_vue13.h)("strong", p.name),
+                  p.description ? (0, import_vue13.h)("div", { style: styles.muted }, p.description) : ""
                 ]),
                 td(String(p.tier)),
                 td(p.seats == null ? "\u221E" : String(p.seats)),
@@ -1661,7 +1939,7 @@ var CatalogScreen = (0, import_vue12.defineComponent)({
                 td(money(p.pricing?.yearly)),
                 td(p.trialDays ? `${p.trialDays} d` : "\u2014"),
                 td(
-                  (0, import_vue12.h)(
+                  (0, import_vue13.h)(
                     "button",
                     {
                       type: "button",
@@ -1685,30 +1963,30 @@ var CatalogScreen = (0, import_vue12.defineComponent)({
 });
 
 // src/screens/SubscriberScreen.ts
-var import_vue_admin11 = require("@fonderie/vue-admin");
-var import_vue13 = require("vue");
-var SubscriberScreen = (0, import_vue13.defineComponent)({
+var import_vue_admin12 = require("@fonderie/vue-admin");
+var import_vue14 = require("vue");
+var SubscriberScreen = (0, import_vue14.defineComponent)({
   name: "FonderieSubscriberScreen",
   props: {
     client: { type: Object, required: true },
     pageSize: { type: Number, default: 50 }
   },
   setup(props) {
-    const type = (0, import_vue13.ref)("user");
-    const idInput = (0, import_vue13.ref)("");
-    const subscriber = (0, import_vue13.ref)(null);
-    const list = (0, import_vue_admin11.useAdminSubscribers)(props.client, { limit: props.pageSize });
-    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin11.useAdminSubscriber)(props.client, subscriber, { limit: 20 });
+    const type = (0, import_vue14.ref)("user");
+    const idInput = (0, import_vue14.ref)("");
+    const subscriber = (0, import_vue14.ref)(null);
+    const list = (0, import_vue_admin12.useAdminSubscribers)(props.client, { limit: props.pageSize });
+    const { subscription, wallet, ledger, hasMoreLedger, isLoading, error, loadMoreLedger, grant } = (0, import_vue_admin12.useAdminSubscriber)(props.client, subscriber, { limit: 20 });
     const open = (t2, id) => {
       granted.value = null;
       type.value = t2;
       idInput.value = id;
       subscriber.value = { type: t2, id };
     };
-    const amount = (0, import_vue13.ref)("");
-    const note = (0, import_vue13.ref)("");
-    const granted = (0, import_vue13.ref)(null);
-    const input = (model, placeholder, extra = {}) => (0, import_vue13.h)("input", {
+    const amount = (0, import_vue14.ref)("");
+    const note = (0, import_vue14.ref)("");
+    const granted = (0, import_vue14.ref)(null);
+    const input = (model, placeholder, extra = {}) => (0, import_vue14.h)("input", {
       value: model.value,
       onInput: (e) => model.value = e.target.value,
       placeholder,
@@ -1718,12 +1996,12 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
     return () => {
       const s = subscription.value;
       const w = wallet.value;
-      return (0, import_vue13.h)("div", { style: styles.container }, [
+      return (0, import_vue14.h)("div", { style: styles.container }, [
         pageHeader(
           "Subscribers",
           "Who is subscribed. Open one for their plan, wallet and ledger, and to grant credit."
         ),
-        (0, import_vue13.h)(
+        (0, import_vue14.h)(
           "form",
           {
             style: styles.toolbar,
@@ -1734,7 +2012,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
             }
           },
           [
-            (0, import_vue13.h)(
+            (0, import_vue14.h)(
               "select",
               {
                 value: type.value,
@@ -1743,17 +2021,17 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                 "aria-label": "Type"
               },
               [
-                (0, import_vue13.h)("option", { value: "user" }, "user"),
-                (0, import_vue13.h)("option", { value: "workspace" }, "workspace")
+                (0, import_vue14.h)("option", { value: "user" }, "user"),
+                (0, import_vue14.h)("option", { value: "workspace" }, "workspace")
               ]
             ),
             input(idInput, "subscriber id", { minWidth: "280px" }),
-            (0, import_vue13.h)(
+            (0, import_vue14.h)(
               "button",
               { type: "submit", style: styles.buttonPrimary, disabled: isLoading.value },
               [icon("search", 14), "Look up"]
             ),
-            subscriber.value ? (0, import_vue13.h)(
+            subscriber.value ? (0, import_vue14.h)(
               "button",
               {
                 type: "button",
@@ -1765,7 +2043,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                 }
               },
               [icon("back", 14), "All subscribers"]
-            ) : (0, import_vue13.h)(
+            ) : (0, import_vue14.h)(
               "button",
               {
                 type: "button",
@@ -1777,8 +2055,8 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
             )
           ]
         ),
-        !subscriber.value ? (0, import_vue13.h)("div", [
-          list.error.value ? (0, import_vue13.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
+        !subscriber.value ? (0, import_vue14.h)("div", [
+          list.error.value ? (0, import_vue14.h)("p", { style: styles.error, role: "alert" }, list.error.value.explanation) : null,
           list.subscriptions.value.length === 0 && !list.isLoading.value ? empty(
             "No subscribers yet",
             "Subscriptions appear here once someone checks out.",
@@ -1786,9 +2064,9 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
           ) : table(
             ["Subscriber", "Plan", "Status", "Renews"],
             list.subscriptions.value.map(
-              (sub) => (0, import_vue13.h)("tr", { key: sub.id }, [
+              (sub) => (0, import_vue14.h)("tr", { key: sub.id }, [
                 td(
-                  (0, import_vue13.h)(
+                  (0, import_vue14.h)(
                     "button",
                     {
                       type: "button",
@@ -1807,13 +2085,13 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                   sub.cancelAtPeriodEnd ? [" ", pill("warn", "cancels", false)] : null
                 ]),
                 td(
-                  sub.currentPeriodEnd ? new Date(sub.currentPeriodEnd).toLocaleDateString() : (0, import_vue13.h)("span", { style: styles.muted }, "\u2014")
+                  sub.currentPeriodEnd ? new Date(sub.currentPeriodEnd).toLocaleDateString() : (0, import_vue14.h)("span", { style: styles.muted }, "\u2014")
                 )
               ])
             )
           ),
-          list.isLoading.value ? (0, import_vue13.h)("p", { style: styles.status }, "Loading\u2026") : null,
-          list.hasMore.value && !list.isLoading.value ? (0, import_vue13.h)(
+          list.isLoading.value ? (0, import_vue14.h)("p", { style: styles.status }, "Loading\u2026") : null,
+          list.hasMore.value && !list.isLoading.value ? (0, import_vue14.h)(
             "button",
             {
               type: "button",
@@ -1823,28 +2101,28 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
             "Load more"
           ) : null
         ]) : null,
-        error.value ? (0, import_vue13.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+        error.value ? (0, import_vue14.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
         subscriber.value && !isLoading.value ? [
-          (0, import_vue13.h)("h2", { style: styles.subtitle }, "Subscription"),
-          s ? (0, import_vue13.h)("table", { style: styles.table }, [
-            (0, import_vue13.h)("tbody", [
-              (0, import_vue13.h)("tr", [td("plan"), td([(0, import_vue13.h)("strong", s.plan), ` \xB7 ${s.interval}`])]),
-              (0, import_vue13.h)("tr", [
+          (0, import_vue14.h)("h2", { style: styles.subtitle }, "Subscription"),
+          s ? (0, import_vue14.h)("table", { style: styles.table }, [
+            (0, import_vue14.h)("tbody", [
+              (0, import_vue14.h)("tr", [td("plan"), td([(0, import_vue14.h)("strong", s.plan), ` \xB7 ${s.interval}`])]),
+              (0, import_vue14.h)("tr", [
                 td("status"),
                 td(`${s.status}${s.cancelAtPeriodEnd ? " \xB7 cancels at period end" : ""}`)
               ]),
-              (0, import_vue13.h)("tr", [
+              (0, import_vue14.h)("tr", [
                 td("period"),
                 td(
                   `${s.currentPeriodStart ? new Date(s.currentPeriodStart).toLocaleDateString() : "\u2014"} \u2192 ${s.currentPeriodEnd ? new Date(s.currentPeriodEnd).toLocaleDateString() : "\u2014"}`
                 )
               ]),
-              (0, import_vue13.h)("tr", [td("provider"), td(s.providerSubscriptionId ?? "\u2014", styles.mono)])
+              (0, import_vue14.h)("tr", [td("provider"), td(s.providerSubscriptionId ?? "\u2014", styles.mono)])
             ])
-          ]) : (0, import_vue13.h)("p", { style: styles.muted }, "No subscription."),
-          (0, import_vue13.h)("h2", { style: styles.subtitle }, "Wallet"),
+          ]) : (0, import_vue14.h)("p", { style: styles.muted }, "No subscription."),
+          (0, import_vue14.h)("h2", { style: styles.subtitle }, "Wallet"),
           w ? [
-            (0, import_vue13.h)(
+            (0, import_vue14.h)(
               "p",
               {
                 style: {
@@ -1856,7 +2134,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                 }
               },
               [
-                (0, import_vue13.h)(
+                (0, import_vue14.h)(
                   "strong",
                   {
                     style: {
@@ -1867,14 +2145,14 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                   w.balance
                 ),
                 ` ${w.currency} `,
-                (0, import_vue13.h)(
+                (0, import_vue14.h)(
                   "span",
                   { style: styles.muted },
                   `(granted ${w.granted ?? "0"} \xB7 purchased ${w.purchased ?? "0"}) \xB7 minor units, precision ${w.precision}`
                 )
               ]
             ),
-            (0, import_vue13.h)(
+            (0, import_vue14.h)(
               "form",
               {
                 style: styles.toolbar,
@@ -1899,7 +2177,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
               [
                 input(amount, "amount (minor units)"),
                 input(note, "reason (optional)", { minWidth: "220px" }),
-                (0, import_vue13.h)(
+                (0, import_vue14.h)(
                   "button",
                   {
                     type: "submit",
@@ -1908,14 +2186,14 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                   },
                   [icon("plus", 14), "Grant"]
                 ),
-                granted.value ? (0, import_vue13.h)("span", { style: styles.ok }, granted.value) : null
+                granted.value ? (0, import_vue14.h)("span", { style: styles.ok }, granted.value) : null
               ]
             ),
-            (0, import_vue13.h)("h2", { style: styles.subtitle }, "Ledger"),
+            (0, import_vue14.h)("h2", { style: styles.subtitle }, "Ledger"),
             ledger.value.length === 0 ? empty("Nothing moved yet", void 0, "subscriber") : table(
               ["When", "Kind", "Amount", "Note"],
               ledger.value.map(
-                (t2) => (0, import_vue13.h)("tr", { key: t2.id }, [
+                (t2) => (0, import_vue14.h)("tr", { key: t2.id }, [
                   td(new Date(t2.createdAt).toLocaleString(), styles.muted),
                   td(t2.type),
                   td(t2.amount, styles.mono),
@@ -1923,7 +2201,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
                 ])
               )
             ),
-            hasMoreLedger.value ? (0, import_vue13.h)(
+            hasMoreLedger.value ? (0, import_vue14.h)(
               "button",
               {
                 type: "button",
@@ -1932,7 +2210,7 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
               },
               "Load more"
             ) : null
-          ] : (0, import_vue13.h)(
+          ] : (0, import_vue14.h)(
             "p",
             { style: styles.muted },
             "No wallet \u2014 billing has no wallet configuration."
@@ -1944,34 +2222,34 @@ var SubscriberScreen = (0, import_vue13.defineComponent)({
 });
 
 // src/screens/AuditScreen.ts
-var import_vue_admin12 = require("@fonderie/vue-admin");
-var import_vue14 = require("vue");
-var AuditScreen = (0, import_vue14.defineComponent)({
+var import_vue_admin13 = require("@fonderie/vue-admin");
+var import_vue15 = require("vue");
+var AuditScreen = (0, import_vue15.defineComponent)({
   name: "FonderieAuditScreen",
   props: {
     client: { type: Object, required: true },
     pageSize: { type: Number, default: 50 }
   },
   setup(props) {
-    const draft = (0, import_vue14.ref)({ workspaceId: "", type: "", actorId: "" });
-    const query = (0, import_vue14.ref)({ limit: props.pageSize });
-    const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_vue_admin12.useAdminAudit)(
+    const draft = (0, import_vue15.ref)({ workspaceId: "", type: "", actorId: "" });
+    const query = (0, import_vue15.ref)({ limit: props.pageSize });
+    const { events, hasMore, isLoading, error, refresh, loadMore } = (0, import_vue_admin13.useAdminAudit)(
       props.client,
       query
     );
-    const field = (key, placeholder) => (0, import_vue14.h)("input", {
+    const field = (key, placeholder) => (0, import_vue15.h)("input", {
       value: draft.value[key],
       onInput: (e) => draft.value = { ...draft.value, [key]: e.target.value },
       placeholder,
       style: styles.input,
       "aria-label": placeholder
     });
-    return () => (0, import_vue14.h)("div", { style: styles.container }, [
+    return () => (0, import_vue15.h)("div", { style: styles.container }, [
       pageHeader(
         "Audit",
         "What happened, across every workspace unless you name one. The chain's integrity verdict is on the Doctor page."
       ),
-      (0, import_vue14.h)(
+      (0, import_vue15.h)(
         "form",
         {
           style: styles.toolbar,
@@ -1990,7 +2268,7 @@ var AuditScreen = (0, import_vue14.defineComponent)({
           field("workspaceId", "workspace id (all if empty)"),
           field("type", "event type"),
           field("actorId", "actor id"),
-          (0, import_vue14.h)(
+          (0, import_vue15.h)(
             "button",
             { type: "submit", style: styles.buttonPrimary, disabled: isLoading.value },
             [icon("search", 14), "Filter"]
@@ -1998,11 +2276,11 @@ var AuditScreen = (0, import_vue14.defineComponent)({
           refreshButton("Refresh", isLoading.value, () => void refresh())
         ]
       ),
-      error.value ? (0, import_vue14.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
+      error.value ? (0, import_vue15.h)("p", { style: styles.error, role: "alert" }, error.value.explanation) : null,
       events.value.length === 0 && !isLoading.value ? empty("Nothing recorded for this filter", void 0, "audit") : table(
         ["When", "Type", "Workspace", "Actor", "Request"],
         events.value.map(
-          (e) => (0, import_vue14.h)("tr", { key: e.id }, [
+          (e) => (0, import_vue15.h)("tr", { key: e.id }, [
             td(new Date(e.createdAt).toLocaleString(), styles.muted),
             td(e.type, styles.mono),
             td(String(e.payload["workspaceId"] ?? "\u2014"), styles.mono),
@@ -2011,7 +2289,7 @@ var AuditScreen = (0, import_vue14.defineComponent)({
           ])
         )
       ),
-      isLoading.value ? (0, import_vue14.h)("p", { style: styles.status }, "Loading\u2026") : null,
+      isLoading.value ? (0, import_vue15.h)("p", { style: styles.status }, "Loading\u2026") : null,
       hasMore.value && !isLoading.value ? loadMoreButton(() => void loadMore()) : null
     ]);
   }
@@ -2044,7 +2322,8 @@ var NAV = [
     items: [
       { page: "audit", label: "Audit", needs: "audit" },
       { page: "log", label: "Admin log" },
-      { page: "tokens", label: "Access" },
+      { page: "operators", label: "Operators", needs: "operators" },
+      { page: "tokens", label: "Tokens" },
       { page: "migrations", label: "Migrations" }
     ]
   }
@@ -2063,10 +2342,11 @@ var ICON = {
   audit: "audit",
   log: "log",
   tokens: "tokens",
+  operators: "users",
   migrations: "migrations"
 };
 var NARROW = "(max-width: 820px)";
-var AdminShell = (0, import_vue15.defineComponent)({
+var AdminShell = (0, import_vue16.defineComponent)({
   name: "FonderieAdminShell",
   props: {
     client: { type: Object, required: true },
@@ -2088,62 +2368,72 @@ var AdminShell = (0, import_vue15.defineComponent)({
     appName: { type: String, default: "Admin" },
     // A badge beside the name — the deployment's environment ("production").
     // Production is tinted so an operator always knows where their clicks land.
-    envLabel: { type: String, default: void 0 }
+    envLabel: { type: String, default: void 0 },
+    // The deployment has operator accounts (@fonderie/admin with a store):
+    // shows the Operators page.
+    operators: { type: Boolean, default: false },
+    // The signed-in operator's email, when a person (not a token) is signed in.
+    currentOperator: { type: String, default: void 0 }
   },
   // `footer` slot: pinned to the bottom of the sidebar — session controls
   // (theme, sign out). The React shell takes the same thing as a `footer` prop.
   emits: { navigate: (_page) => true },
   setup(props, { emit, slots }) {
     const query = typeof window !== "undefined" && window.matchMedia ? window.matchMedia(NARROW) : null;
-    const narrow = (0, import_vue15.ref)(query?.matches ?? false);
-    const drawer = (0, import_vue15.ref)(false);
+    const narrow = (0, import_vue16.ref)(query?.matches ?? false);
+    const drawer = (0, import_vue16.ref)(false);
     const onMedia = (e) => narrow.value = e.matches;
-    (0, import_vue15.onMounted)(() => query?.addEventListener("change", onMedia));
-    (0, import_vue15.onBeforeUnmount)(() => query?.removeEventListener("change", onMedia));
-    const own = (0, import_vue15.ref)("attention");
-    const current = (0, import_vue15.computed)(() => props.page ?? own.value);
-    const editing = (0, import_vue15.ref)(null);
+    (0, import_vue16.onMounted)(() => query?.addEventListener("change", onMedia));
+    (0, import_vue16.onBeforeUnmount)(() => query?.removeEventListener("change", onMedia));
+    const own = (0, import_vue16.ref)("attention");
+    const current = (0, import_vue16.computed)(() => props.page ?? own.value);
+    const editing = (0, import_vue16.ref)(null);
     const go = (p) => {
       editing.value = null;
       emit("navigate", p);
       if (props.page === void 0) own.value = p;
       drawer.value = false;
     };
-    const back = (label) => (0, import_vue15.h)("div", { style: { padding: "24px 40px 0" } }, [
-      (0, import_vue15.h)(
+    const back = (label) => (0, import_vue16.h)("div", { style: { padding: "24px 40px 0" } }, [
+      (0, import_vue16.h)(
         "button",
         { type: "button", style: styles.buttonGhost, onClick: () => editing.value = null },
         [icon("back", 14), label]
       )
     ]);
-    const missing = (text) => (0, import_vue15.h)("p", { style: { ...styles.status, padding: "32px 40px" } }, text);
+    const missing = (text) => (0, import_vue16.h)("p", { style: { ...styles.status, padding: "32px 40px" } }, text);
     const body = () => {
       const c = props.client;
       switch (current.value) {
         case "attention":
-          return (0, import_vue15.h)(AttentionScreen, { client: c });
+          return (0, import_vue16.h)(AttentionScreen, { client: c });
         case "modules":
-          return (0, import_vue15.h)(ModulesScreen, { client: c });
+          return (0, import_vue16.h)(ModulesScreen, { client: c });
         case "doctor":
-          return (0, import_vue15.h)(DoctorScreen, { client: c });
+          return (0, import_vue16.h)(DoctorScreen, { client: c });
         case "environment":
-          return (0, import_vue15.h)(EnvironmentScreen, { client: c });
+          return (0, import_vue16.h)(EnvironmentScreen, { client: c });
         case "routes":
-          return (0, import_vue15.h)(RoutesScreen, { client: c });
+          return (0, import_vue16.h)(RoutesScreen, { client: c });
         case "tokens":
-          return (0, import_vue15.h)(TokensScreen, { client: c });
+          return (0, import_vue16.h)(TokensScreen, { client: c });
+        case "operators":
+          return (0, import_vue16.h)(OperatorsScreen, {
+            client: c,
+            ...props.currentOperator ? { me: props.currentOperator } : {}
+          });
         case "migrations":
-          return (0, import_vue15.h)(MigrationsScreen, { client: c });
+          return (0, import_vue16.h)(MigrationsScreen, { client: c });
         case "log":
-          return (0, import_vue15.h)(AdminLogScreen, { client: c });
+          return (0, import_vue16.h)(AdminLogScreen, { client: c });
         case "catalog":
-          return props.billingClient ? (0, import_vue15.h)(CatalogScreen, { client: props.billingClient }) : missing("Pass a BillingAdminClient to see the catalog here.");
+          return props.billingClient ? (0, import_vue16.h)(CatalogScreen, { client: props.billingClient }) : missing("Pass a BillingAdminClient to see the catalog here.");
         case "subscriber":
-          return props.billingClient ? (0, import_vue15.h)(SubscriberScreen, { client: props.billingClient }) : missing("Pass a BillingAdminClient to look up subscribers here.");
+          return props.billingClient ? (0, import_vue16.h)(SubscriberScreen, { client: props.billingClient }) : missing("Pass a BillingAdminClient to look up subscribers here.");
         case "audit":
-          return props.auditClient ? (0, import_vue15.h)(AuditScreen, { client: props.auditClient }) : missing("Pass an AuditAdminClient to see the audit trail here.");
+          return props.auditClient ? (0, import_vue16.h)(AuditScreen, { client: props.auditClient }) : missing("Pass an AuditAdminClient to see the audit trail here.");
         case "users":
-          return props.authClient ? (0, import_vue15.h)(UsersScreen, { client: props.authClient }) : missing("Pass an AuthAdminClient to look up users here.");
+          return props.authClient ? (0, import_vue16.h)(UsersScreen, { client: props.authClient }) : missing("Pass an AuthAdminClient to look up users here.");
         case "settings": {
           const cc = props.configClient;
           if (!cc) return missing("Pass a ConfigAdminClient to manage config and secrets here.");
@@ -2151,7 +2441,7 @@ var AdminShell = (0, import_vue15.defineComponent)({
           if (e && e.kind !== "template")
             return [
               back("Config & secrets"),
-              (0, import_vue15.h)(import_vue_config_admin_screens.ConfigEditorScreen, {
+              (0, import_vue16.h)(import_vue_config_admin_screens.ConfigEditorScreen, {
                 client: cc,
                 kind: e.kind,
                 configKey: e.key,
@@ -2159,7 +2449,7 @@ var AdminShell = (0, import_vue15.defineComponent)({
                 onSaved: () => editing.value = null
               })
             ];
-          return (0, import_vue15.h)(import_vue_config_admin_screens.ConfigListScreen, {
+          return (0, import_vue16.h)(import_vue_config_admin_screens.ConfigListScreen, {
             client: cc,
             ...props.environment !== void 0 ? { environment: props.environment } : {},
             "onSelect-config": (key) => editing.value = { kind: "config", key },
@@ -2176,27 +2466,27 @@ var AdminShell = (0, import_vue15.defineComponent)({
           if (e?.kind === "template")
             return [
               back("Templates"),
-              (0, import_vue15.h)(import_vue_courier_admin_screens.TemplateEditorScreen, {
+              (0, import_vue16.h)(import_vue_courier_admin_screens.TemplateEditorScreen, {
                 client: kc,
                 type: e.type,
                 onSaved: () => editing.value = null
               })
             ];
-          return (0, import_vue15.h)(import_vue_courier_admin_screens.TemplateListScreen, {
+          return (0, import_vue16.h)(import_vue_courier_admin_screens.TemplateListScreen, {
             client: kc,
             "onSelect-template": (t2) => editing.value = { kind: "template", type: t2.type }
           });
         }
       }
     };
-    const visible = (i) => !i.needs || (i.needs === "config" ? props.configClient : i.needs === "courier" ? props.courierClient : i.needs === "auth" ? props.authClient : i.needs === "billing" ? props.billingClient : props.auditClient);
+    const visible = (i) => !i.needs || (i.needs === "operators" ? props.operators : i.needs === "config" ? props.configClient : i.needs === "courier" ? props.courierClient : i.needs === "auth" ? props.authClient : i.needs === "billing" ? props.billingClient : props.auditClient);
     const brand = () => {
       const production = props.envLabel ? /^prod/i.test(props.envLabel) : false;
-      return (0, import_vue15.h)("div", { style: styles.navBrand }, [
-        (0, import_vue15.h)("div", { style: styles.navMark }, [icon("mark", 15)]),
-        (0, import_vue15.h)("div", { style: { minWidth: 0, flex: 1 } }, [
-          (0, import_vue15.h)("div", { style: styles.navBrandTitle }, props.appName),
-          props.envLabel ? (0, import_vue15.h)(
+      return (0, import_vue16.h)("div", { style: styles.navBrand }, [
+        (0, import_vue16.h)("div", { style: styles.navMark }, [icon("mark", 15)]),
+        (0, import_vue16.h)("div", { style: { minWidth: 0, flex: 1 } }, [
+          (0, import_vue16.h)("div", { style: styles.navBrandTitle }, props.appName),
+          props.envLabel ? (0, import_vue16.h)(
             "span",
             {
               style: {
@@ -2213,7 +2503,7 @@ var AdminShell = (0, import_vue15.defineComponent)({
             props.envLabel
           ) : null
         ]),
-        narrow.value ? (0, import_vue15.h)(
+        narrow.value ? (0, import_vue16.h)(
           "button",
           {
             type: "button",
@@ -2225,7 +2515,7 @@ var AdminShell = (0, import_vue15.defineComponent)({
         ) : null
       ]);
     };
-    const nav = () => (0, import_vue15.h)(
+    const nav = () => (0, import_vue16.h)(
       "nav",
       {
         style: {
@@ -2236,17 +2526,17 @@ var AdminShell = (0, import_vue15.defineComponent)({
       },
       [
         brand(),
-        (0, import_vue15.h)(
+        (0, import_vue16.h)(
           "div",
           { style: styles.navScroll },
           NAV.map((g) => {
             const items = g.items.filter(visible);
             if (items.length === 0) return null;
-            return (0, import_vue15.h)("div", { key: g.group }, [
-              (0, import_vue15.h)("div", { style: styles.navGroup }, g.group),
+            return (0, import_vue16.h)("div", { key: g.group }, [
+              (0, import_vue16.h)("div", { style: styles.navGroup }, g.group),
               ...items.map((i) => {
                 const active = current.value === i.page;
-                return (0, import_vue15.h)(
+                return (0, import_vue16.h)(
                   "button",
                   {
                     key: i.page,
@@ -2262,18 +2552,18 @@ var AdminShell = (0, import_vue15.defineComponent)({
             ]);
           })
         ),
-        slots["footer"] ? (0, import_vue15.h)("div", { style: styles.navFooter }, slots["footer"]()) : null
+        slots["footer"] ? (0, import_vue16.h)("div", { style: styles.navFooter }, slots["footer"]()) : null
       ]
     );
     return () => {
       const title = NAV.flatMap((g) => g.items).find((i) => i.page === current.value)?.label ?? "";
-      return (0, import_vue15.h)(
+      return (0, import_vue16.h)(
         "div",
         { style: { ...styles.shell, ...narrow.value ? { flexDirection: "column" } : {} } },
         [
           ...narrow.value ? [
-            (0, import_vue15.h)("div", { style: styles.topbar }, [
-              (0, import_vue15.h)(
+            (0, import_vue16.h)("div", { style: styles.topbar }, [
+              (0, import_vue16.h)(
                 "button",
                 {
                   type: "button",
@@ -2284,19 +2574,19 @@ var AdminShell = (0, import_vue15.defineComponent)({
                 },
                 [icon("menu")]
               ),
-              (0, import_vue15.h)("span", { style: { fontWeight: 600, fontSize: "14px" } }, title),
-              props.envLabel ? (0, import_vue15.h)("span", { style: { ...styles.badge, marginLeft: "auto" } }, props.envLabel) : null
+              (0, import_vue16.h)("span", { style: { fontWeight: 600, fontSize: "14px" } }, title),
+              props.envLabel ? (0, import_vue16.h)("span", { style: { ...styles.badge, marginLeft: "auto" } }, props.envLabel) : null
             ]),
-            drawer.value ? (0, import_vue15.h)("div", { style: styles.drawer }, [
+            drawer.value ? (0, import_vue16.h)("div", { style: styles.drawer }, [
               nav(),
-              (0, import_vue15.h)("div", {
+              (0, import_vue16.h)("div", {
                 style: styles.scrim,
                 "aria-hidden": "true",
                 onClick: () => drawer.value = false
               })
             ]) : null
           ] : [nav()],
-          (0, import_vue15.h)("main", { class: "fonderie-admin-main", style: styles.main }, body())
+          (0, import_vue16.h)("main", { class: "fonderie-admin-main", style: styles.main }, body())
         ]
       );
     };
@@ -2313,6 +2603,7 @@ var AdminShell = (0, import_vue15.defineComponent)({
   EnvironmentScreen,
   MigrationsScreen,
   ModulesScreen,
+  OperatorsScreen,
   RoutesScreen,
   SubscriberScreen,
   TokensScreen,