@webx-ui/module-auth 0.2.1 → 0.4.0

package/dist/index.js

@@ -1,52 +1,53 @@
-import { inject as ee, defineComponent as q, computed as C, ref as b, useTemplateRef as te, onBeforeUnmount as ae, resolveComponent as r, openBlock as x, createBlock as k, withCtx as n, createVNode as l, withModifiers as oe, createCommentVNode as T, createElementVNode as le, createTextVNode as M, toDisplayString as $, createElementBlock as W, Fragment as j, unref as E, renderList as ne, h as se, watch as ue } from "vue";
-import { useTranslate as K, HttpError as re, useAdmin as ie, useI18n as ce } from "@webx-ui/admin";
-const O = /* @__PURE__ */ Symbol("webx-auth");
-function R() {
-  const e = ee(O, null);
-  if (e === null)
+import { inject as We, defineComponent as I, computed as B, ref as w, useTemplateRef as le, onBeforeUnmount as ze, resolveComponent as W, openBlock as k, createBlock as S, withCtx as l, createVNode as n, withModifiers as ae, createCommentVNode as P, createElementVNode as O, createTextVNode as L, toDisplayString as V, watch as oe, unref as e, isRef as pe, createElementBlock as K, resolveDynamicComponent as Be, createSlots as ne, Fragment as te, renderList as fe, h as he } from "vue";
+import { useTranslate as R, HttpError as Fe, useAdmin as q, useI18n as be } from "@webx-ui/admin";
+import { useModal as ye, WxDialog as we, WxFormItem as D, WxInput as Z, WxSelect as H, WxSpace as E, WxCheckbox as de, WxText as Y, WxButton as j, toast as G, WxTable as Te, WxActions as ce, WxAction as me, WxBadge as ee, WxAvatar as Me, createModal as ge, WxCard as Pe, confirm as Ne } from "@webx-ui/core";
+const _e = /* @__PURE__ */ Symbol("webx-auth");
+function xe() {
+  const a = We(_e, null);
+  if (a === null)
     throw new Error("useAuth() was called outside a panel that installed the auth plugin.");
-  return e;
+  return a;
 }
-function de(e) {
-  const o = `${e.apiPath}/auth`;
+function Oe(a) {
+  const i = `${a.apiPath}/auth`;
   return {
     async me() {
       try {
-        return (await e.http.get(`${o}/me`)).data;
-      } catch (t) {
-        if (me(t))
+        return (await a.http.get(`${i}/me`)).data;
+      } catch (s) {
+        if (Ie(s))
           return null;
-        throw t;
+        throw s;
       }
     },
-    async login(t) {
-      const a = await e.http.post(`${o}/login`, {
-        email: t.email,
-        password: t.password,
-        remember: t.remember ?? !1
+    async login(s) {
+      const o = await a.http.post(`${i}/login`, {
+        email: s.email,
+        password: s.password,
+        remember: s.remember ?? !1
       });
-      return e.setUser(a.data), await e.reload(), a.data;
+      return a.setUser(o.data), await a.reload(), o.data;
     },
-    async setLocale(t) {
-      const a = await e.http.put(`${o}/locale`, { locale: t });
-      e.setUser(a.data), await e.setLocale(t);
+    async setLocale(s) {
+      const o = await a.http.put(`${i}/locale`, { locale: s });
+      a.setUser(o.data), await a.setLocale(s);
     },
     async logout() {
       try {
-        await e.http.post(`${o}/logout`);
+        await a.http.post(`${i}/logout`);
       } finally {
-        e.setUser(null), e.state.status = "unauthenticated", e.state.manifest = null;
+        a.setUser(null), a.state.status = "unauthenticated", a.state.manifest = null;
       }
     }
   };
 }
-function pe(e, o) {
-  e.provide(O, o);
+function Ee(a, i) {
+  a.provide(_e, i);
 }
-function me(e) {
-  return typeof e == "object" && e !== null && "status" in e && e.status === 401;
+function Ie(a) {
+  return typeof a == "object" && a !== null && "status" in a && a.status === 401;
 }
-const ve = ["title", "aria-label", "aria-pressed"], fe = /* @__PURE__ */ q({
+const Re = ["title", "aria-label", "aria-pressed"], De = /* @__PURE__ */ I({
   __name: "LoginCard",
   props: {
     emailLabel: { default: void 0 },
@@ -61,170 +62,170 @@ const ve = ["title", "aria-label", "aria-pressed"], fe = /* @__PURE__ */ q({
     autofocus: { type: Boolean, default: !0 }
   },
   emits: ["success"],
-  setup(e, { expose: o, emit: t }) {
-    const a = e, i = t, d = R(), u = K("webx-auth"), c = C(() => ({
-      email: a.emailLabel ?? u("card.email"),
-      password: a.passwordLabel ?? u("card.password"),
-      remember: a.rememberLabel ?? u("card.remember"),
-      submit: a.submitLabel ?? u("card.submit"),
-      capsLock: a.capsLockWarning ?? u("card.caps-lock"),
-      reveal: a.revealLabel ?? u("card.reveal"),
-      hide: a.hideLabel ?? u("card.hide")
-    })), V = b(""), v = b(""), p = b(!1), g = b(!1), f = b(!1), S = b(!1), m = b(""), y = b({}), w = b(0), _ = te("emailField");
-    let U = null;
-    ae(A);
-    const z = C(() => w.value > 0), H = C(
-      () => a.throttleMessage === void 0 ? u("card.throttled", { seconds: w.value }) : a.throttleMessage.replace(":seconds", String(w.value))
+  setup(a, { expose: i, emit: s }) {
+    const o = a, u = s, b = xe(), h = R("webx-auth"), r = B(() => ({
+      email: o.emailLabel ?? h("card.email"),
+      password: o.passwordLabel ?? h("card.password"),
+      remember: o.rememberLabel ?? h("card.remember"),
+      submit: o.submitLabel ?? h("card.submit"),
+      capsLock: o.capsLockWarning ?? h("card.caps-lock"),
+      reveal: o.revealLabel ?? h("card.reveal"),
+      hide: o.hideLabel ?? h("card.hide")
+    })), d = w(""), A = w(""), _ = w(!1), c = w(!1), t = w(!1), U = w(!1), C = w(""), $ = w({}), z = w(0), F = le("emailField");
+    let T = null;
+    ze(x);
+    const m = B(() => z.value > 0), v = B(
+      () => o.throttleMessage === void 0 ? h("card.throttled", { seconds: z.value }) : o.throttleMessage.replace(":seconds", String(z.value))
     );
-    async function D() {
-      if (!(g.value || z.value)) {
-        g.value = !0, m.value = "", y.value = {};
+    async function f() {
+      if (!(c.value || m.value)) {
+        c.value = !0, C.value = "", $.value = {};
         try {
-          await d.login({
-            email: V.value,
-            password: v.value,
-            remember: p.value
-          }), v.value = "", i("success");
-        } catch (s) {
-          G(s);
+          await b.login({
+            email: d.value,
+            password: A.value,
+            remember: _.value
+          }), A.value = "", u("success");
+        } catch (g) {
+          Q(g);
         } finally {
-          g.value = !1;
+          c.value = !1;
         }
       }
     }
-    function G(s) {
-      if (!(s instanceof re)) {
-        m.value = s instanceof Error ? s.message : String(s);
+    function Q(g) {
+      if (!(g instanceof Fe)) {
+        C.value = g instanceof Error ? g.message : String(g);
         return;
       }
-      if (s.isValidation) {
-        y.value = s.errors;
+      if (g.isValidation) {
+        $.value = g.errors;
         return;
       }
-      if (s.isThrottled) {
-        J(s.retryAfter ?? 60);
+      if (g.isThrottled) {
+        y(g.retryAfter ?? 60);
         return;
       }
-      m.value = s.message;
+      C.value = g.message;
     }
-    function J(s) {
-      A(), w.value = s, U = setInterval(() => {
-        w.value -= 1, w.value <= 0 && A();
+    function y(g) {
+      x(), z.value = g, T = setInterval(() => {
+        z.value -= 1, z.value <= 0 && x();
       }, 1e3);
     }
-    function A() {
-      U !== null && (clearInterval(U), U = null), w.value = 0;
+    function x() {
+      T !== null && (clearInterval(T), T = null), z.value = 0;
     }
-    function N(s) {
-      S.value = s.getModifierState("CapsLock");
+    function p(g) {
+      U.value = g.getModifierState("CapsLock");
     }
-    return o({ focus: () => _.value?.focus() }), (s, h) => {
-      const I = r("wx-alert"), B = r("wx-icon"), P = r("wx-input"), F = r("wx-form-item"), Q = r("wx-checkbox"), X = r("wx-button"), Y = r("wx-form"), Z = r("wx-card");
-      return x(), k(Z, {
+    return i({ focus: () => F.value?.focus() }), (g, M) => {
+      const ie = W("wx-alert"), X = W("wx-icon"), re = W("wx-input"), ue = W("wx-form-item"), Le = W("wx-checkbox"), $e = W("wx-button"), Se = W("wx-form"), Ue = W("wx-card");
+      return k(), S(Ue, {
         class: "wx-login",
         padding: 24
       }, {
-        default: n(() => [
-          l(Y, {
-            errors: y.value,
-            disabled: g.value,
+        default: l(() => [
+          n(Se, {
+            errors: $.value,
+            disabled: c.value,
             gap: "md",
-            onSubmit: oe(D, ["prevent"])
+            onSubmit: ae(f, ["prevent"])
           }, {
-            default: n(() => [
-              m.value !== "" ? (x(), k(I, {
+            default: l(() => [
+              C.value !== "" ? (k(), S(ie, {
                 key: 0,
                 type: "danger",
                 variant: "soft",
                 live: "",
-                description: m.value,
+                description: C.value,
                 class: "wx-login__message"
-              }, null, 8, ["description"])) : z.value ? (x(), k(I, {
+              }, null, 8, ["description"])) : m.value ? (k(), S(ie, {
                 key: 1,
                 type: "warning",
                 variant: "soft",
                 live: "",
-                description: H.value,
+                description: v.value,
                 class: "wx-login__message"
-              }, null, 8, ["description"])) : T("", !0),
-              l(F, { name: "email" }, {
-                default: n(() => [
-                  l(P, {
+              }, null, 8, ["description"])) : P("", !0),
+              n(ue, { name: "email" }, {
+                default: l(() => [
+                  n(re, {
                     ref_key: "emailField",
-                    ref: _,
-                    modelValue: V.value,
-                    "onUpdate:modelValue": h[0] || (h[0] = (L) => V.value = L),
+                    ref: F,
+                    modelValue: d.value,
+                    "onUpdate:modelValue": M[0] || (M[0] = (N) => d.value = N),
                     type: "email",
-                    placeholder: c.value.email,
-                    "aria-label": c.value.email,
+                    placeholder: r.value.email,
+                    "aria-label": r.value.email,
                     autocomplete: "username",
-                    autofocus: e.autofocus,
+                    autofocus: a.autofocus,
                     inputmode: "email",
                     size: "lg"
                   }, {
-                    prefix: n(() => [
-                      l(B, { name: "mail" })
+                    prefix: l(() => [
+                      n(X, { name: "mail" })
                     ]),
                     _: 1
                   }, 8, ["modelValue", "placeholder", "aria-label", "autofocus"])
                 ]),
                 _: 1
               }),
-              l(F, {
+              n(ue, {
                 name: "password",
-                help: S.value ? c.value.capsLock : void 0
+                help: U.value ? r.value.capsLock : void 0
               }, {
-                default: n(() => [
-                  l(P, {
-                    modelValue: v.value,
-                    "onUpdate:modelValue": h[2] || (h[2] = (L) => v.value = L),
-                    type: f.value ? "text" : "password",
-                    placeholder: c.value.password,
-                    "aria-label": c.value.password,
+                default: l(() => [
+                  n(re, {
+                    modelValue: A.value,
+                    "onUpdate:modelValue": M[2] || (M[2] = (N) => A.value = N),
+                    type: t.value ? "text" : "password",
+                    placeholder: r.value.password,
+                    "aria-label": r.value.password,
                     autocomplete: "current-password",
                     size: "lg",
-                    onKeydown: N,
-                    onKeyup: N
+                    onKeydown: p,
+                    onKeyup: p
                   }, {
-                    prefix: n(() => [
-                      l(B, { name: "lock" })
+                    prefix: l(() => [
+                      n(X, { name: "lock" })
                     ]),
-                    suffix: n(() => [
-                      le("button", {
+                    suffix: l(() => [
+                      O("button", {
                         type: "button",
                         class: "wx-login__reveal",
-                        title: f.value ? c.value.hide : c.value.reveal,
-                        "aria-label": f.value ? c.value.hide : c.value.reveal,
-                        "aria-pressed": f.value,
+                        title: t.value ? r.value.hide : r.value.reveal,
+                        "aria-label": t.value ? r.value.hide : r.value.reveal,
+                        "aria-pressed": t.value,
                         tabindex: "-1",
-                        onClick: h[1] || (h[1] = (L) => f.value = !f.value)
+                        onClick: M[1] || (M[1] = (N) => t.value = !t.value)
                       }, [
-                        l(B, {
-                          name: f.value ? "eye-off" : "eye"
+                        n(X, {
+                          name: t.value ? "eye-off" : "eye"
                         }, null, 8, ["name"])
-                      ], 8, ve)
+                      ], 8, Re)
                     ]),
                     _: 1
                   }, 8, ["modelValue", "type", "placeholder", "aria-label"])
                 ]),
                 _: 1
               }, 8, ["help"]),
-              e.remember ? (x(), k(Q, {
+              a.remember ? (k(), S(Le, {
                 key: 2,
-                modelValue: p.value,
-                "onUpdate:modelValue": h[3] || (h[3] = (L) => p.value = L),
-                label: c.value.remember
-              }, null, 8, ["modelValue", "label"])) : T("", !0),
-              l(X, {
+                modelValue: _.value,
+                "onUpdate:modelValue": M[3] || (M[3] = (N) => _.value = N),
+                label: r.value.remember
+              }, null, 8, ["modelValue", "label"])) : P("", !0),
+              n($e, {
                 type: "primary",
                 "native-type": "submit",
                 size: "lg",
                 block: "",
-                loading: g.value,
-                disabled: z.value
+                loading: c.value,
+                disabled: m.value
               }, {
-                default: n(() => [
-                  M($(c.value.submit), 1)
+                default: l(() => [
+                  L(V(r.value.submit), 1)
                 ]),
                 _: 1
               }, 8, ["loading", "disabled"])
@@ -236,12 +237,12 @@ const ve = ["title", "aria-label", "aria-pressed"], fe = /* @__PURE__ */ q({
       });
     };
   }
-}), we = (e, o) => {
-  const t = e.__vccOpts || e;
-  for (const [a, i] of o)
-    t[a] = i;
-  return t;
-}, be = /* @__PURE__ */ we(fe, [["__scopeId", "data-v-1224c1f8"]]), _e = {
+}), ke = (a, i) => {
+  const s = a.__vccOpts || a;
+  for (const [o, u] of i)
+    s[o] = u;
+  return s;
+}, Ke = /* @__PURE__ */ ke(De, [["__scopeId", "data-v-1224c1f8"]]), Ve = {
   card: {
     email: "Email",
     password: "Password",
@@ -253,114 +254,810 @@ const ve = ["title", "aria-label", "aria-pressed"], fe = /* @__PURE__ */ q({
     throttled: "Too many attempts. Try again in :seconds s.",
     failed: "Those details do not match an account."
   },
+  admins: {
+    title: "Administrators",
+    search: "Search administrators",
+    new: "New administrator",
+    edit: "Edit administrator",
+    // The same two, short enough for a button on a phone and for a dialog's heading.
+    "new-short": "Add",
+    "edit-short": "Edit",
+    name: "Name",
+    email: "Email",
+    password: "Password",
+    "password-hint": "At least 12 characters",
+    "password-keep": "Leave blank to keep the current one",
+    avatar: "Photo",
+    roles: "Roles",
+    "no-roles": "No roles",
+    active: "Active",
+    super: "Super administrator",
+    "super-hint": "Answers yes to everything, whatever the roles say",
+    locale: "Panel language",
+    "locale-auto": "Follow the browser",
+    "last-login": "Last signed in",
+    never: "Never",
+    save: "Save",
+    cancel: "Cancel",
+    delete: "Delete",
+    "delete-title": "Delete :name?",
+    "delete-text": "They lose access at once. What they have written stays.",
+    "all-roles": "All roles",
+    "any-state": "Active and not",
+    "only-active": "Active only",
+    "only-inactive": "Switched off only",
+    empty: "Nobody matches that",
+    "select-one": "Choose an administrator",
+    "select-many": "Choose administrators",
+    chosen: "Chosen: :count",
+    created: "Administrator created",
+    updated: "Administrator saved",
+    deleted: "Administrator deleted"
+  },
+  errors: {
+    unauthenticated: "Unauthenticated.",
+    inactive: "This account is no longer active.",
+    forbidden: "This account may not do that.",
+    "not-yourself": "You cannot do that to your own account.",
+    "last-super": "There has to be one super administrator left."
+  },
   menu: {
     "sign-out": "Sign out",
     language: "Interface language"
   }
-}, ge = /* @__PURE__ */ q({
-  __name: "UserMenu",
+};
+function se(a) {
+  const i = `${a.apiPath}/auth`, s = (o) => o.data;
+  return {
+    list: (o = {}) => a.http.get(`${i}/admins`, {
+      query: {
+        q: o.q || void 0,
+        role: o.role ?? void 0,
+        active: o.active ?? void 0,
+        sort: o.sort,
+        page: o.page,
+        per_page: o.per_page
+      }
+    }).then((u) => ({ ...u.meta, data: u.data })),
+    get: (o) => a.http.get(`${i}/admins/${o}`).then(s),
+    create: (o) => a.http.post(`${i}/admins`, o).then(s),
+    update: (o, u) => a.http.patch(`${i}/admins/${o}`, u).then(s),
+    remove: (o) => a.http.delete(`${i}/admins/${o}`),
+    roles: () => a.http.get(`${i}/roles`).then(s)
+  };
+}
+const ve = /* @__PURE__ */ new WeakSet();
+function J() {
+  try {
+    const { i18n: a } = q();
+    ve.has(a) || (a.defaults("webx-auth", Ve), ve.add(a));
+  } catch {
+  }
+}
+const je = { class: "wx-admin-form" }, qe = { class: "wx-admin-form__grid" }, He = {
+  key: 0,
+  class: "wx-admin-form__aside"
+}, Ye = { class: "wx-admin-form__fields" }, Ge = /* @__PURE__ */ I({
+  __name: "AdminDialog",
   props: {
-    signOutLabel: { default: void 0 }
+    admin: { default: null },
+    avatarField: { default: void 0 }
   },
-  setup(e) {
-    const o = ie(), t = R(), a = ce(), i = K("webx-auth"), d = C(() => o.state.user), u = C(
-      () => a.state.panelLocales.length > 1 ? a.state.panelLocales : []
-    ), c = C(() => (d.value?.name ?? "").split(/\s+/).filter((p) => p !== "").slice(0, 2).map((p) => p[0]?.toUpperCase() ?? "").join(""));
-    async function V(v) {
-      v !== a.state.locale && await t.setLocale(v);
+  setup(a) {
+    const i = a, { resolve: s, dismiss: o, open: u } = ye(), b = q(), h = se(b), r = be();
+    J();
+    const d = R("webx-auth"), A = w([]), _ = w(!1), c = w({}), t = w({
+      name: "",
+      email: "",
+      password: "",
+      avatar: null,
+      is_active: !0,
+      is_super: !1,
+      locale: null,
+      roles: []
+    }), U = B({
+      get: () => t.value.avatar ? { path: t.value.avatar } : null,
+      set: (m) => {
+        t.value.avatar = m?.path ?? null;
+      }
+    }), C = B(() => i.admin !== null), $ = B(() => A.value.map((m) => ({ value: m.id, label: m.name }))), z = B(() => [
+      { value: "auto", label: d("admins.locale-auto") },
+      ...r.state.panelLocales.map((m) => ({ value: m.code, label: m.nativeName }))
+    ]);
+    h.roles().then((m) => A.value = m), oe(
+      () => i.admin,
+      (m) => {
+        t.value = {
+          name: m?.name ?? "",
+          email: m?.email ?? "",
+          password: "",
+          avatar: m?.avatar ?? null,
+          is_active: m?.is_active ?? !0,
+          is_super: m?.is_super ?? !1,
+          locale: m?.locale ?? "auto",
+          roles: m?.roles.map((v) => v.id) ?? []
+        }, c.value = {};
+      },
+      { immediate: !0 }
+    );
+    function F(m) {
+      return c.value[m]?.[0];
+    }
+    async function T() {
+      _.value = !0, c.value = {};
+      const m = {
+        name: t.value.name,
+        email: t.value.email,
+        avatar: t.value.avatar,
+        is_active: t.value.is_active,
+        is_super: t.value.is_super,
+        locale: t.value.locale === "auto" ? null : t.value.locale,
+        roles: t.value.roles ?? []
+      };
+      t.value.password && (m.password = t.value.password);
+      try {
+        const v = i.admin ? await h.update(i.admin.id, m) : await h.create(m);
+        G.success(d(C.value ? "admins.updated" : "admins.created")), s(v);
+      } catch (v) {
+        const f = v.body;
+        f?.errors ? c.value = f.errors : f?.message && G.danger(f.message);
+      } finally {
+        _.value = !1;
+      }
     }
-    return (v, p) => {
-      const g = r("wx-avatar"), f = r("wx-action"), S = r("wx-text"), m = r("wx-dropdown-item"), y = r("wx-divider"), w = r("wx-dropdown");
-      return d.value !== null ? (x(), k(w, { key: 0 }, {
-        trigger: n(() => [
-          l(f, {
-            title: d.value.name
+    return (m, v) => (k(), S(e(we), {
+      open: e(u),
+      "onUpdate:open": v[9] || (v[9] = (f) => pe(u) ? u.value = f : null),
+      title: C.value ? e(d)("admins.edit-short") : e(d)("admins.new-short"),
+      width: 720
+    }, {
+      footer: l(() => [
+        n(e(E), { size: "sm" }, {
+          default: l(() => [
+            n(e(j), {
+              variant: "outline",
+              onClick: v[8] || (v[8] = (f) => e(o)())
+            }, {
+              default: l(() => [
+                L(V(e(d)("admins.cancel")), 1)
+              ]),
+              _: 1
+            }),
+            n(e(j), {
+              type: "primary",
+              loading: _.value,
+              onClick: T
+            }, {
+              default: l(() => [
+                L(V(e(d)("admins.save")), 1)
+              ]),
+              _: 1
+            }, 8, ["loading"])
+          ]),
+          _: 1
+        })
+      ]),
+      default: l(() => [
+        O("div", je, [
+          O("div", qe, [
+            a.avatarField ? (k(), K("div", He, [
+              (k(), S(Be(a.avatarField), {
+                modelValue: U.value,
+                "onUpdate:modelValue": v[0] || (v[0] = (f) => U.value = f),
+                label: e(d)("admins.avatar"),
+                aspect: "1/1",
+                captions: !1
+              }, null, 8, ["modelValue", "label"]))
+            ])) : P("", !0),
+            O("div", Ye, [
+              n(e(D), {
+                label: e(d)("admins.name"),
+                error: F("name")
+              }, {
+                default: l(() => [
+                  n(e(Z), {
+                    modelValue: t.value.name,
+                    "onUpdate:modelValue": v[1] || (v[1] = (f) => t.value.name = f),
+                    name: "name"
+                  }, null, 8, ["modelValue"])
+                ]),
+                _: 1
+              }, 8, ["label", "error"]),
+              n(e(D), {
+                label: e(d)("admins.email"),
+                error: F("email")
+              }, {
+                default: l(() => [
+                  n(e(Z), {
+                    modelValue: t.value.email,
+                    "onUpdate:modelValue": v[2] || (v[2] = (f) => t.value.email = f),
+                    type: "email",
+                    name: "email",
+                    autocomplete: "off"
+                  }, null, 8, ["modelValue"])
+                ]),
+                _: 1
+              }, 8, ["label", "error"]),
+              n(e(D), {
+                label: e(d)("admins.password"),
+                error: F("password"),
+                help: C.value ? e(d)("admins.password-keep") : e(d)("admins.password-hint")
+              }, {
+                default: l(() => [
+                  n(e(Z), {
+                    modelValue: t.value.password,
+                    "onUpdate:modelValue": v[3] || (v[3] = (f) => t.value.password = f),
+                    type: "password",
+                    name: "password",
+                    autocomplete: "new-password"
+                  }, null, 8, ["modelValue"])
+                ]),
+                _: 1
+              }, 8, ["label", "error", "help"]),
+              n(e(D), {
+                label: e(d)("admins.roles"),
+                error: F("roles")
+              }, {
+                default: l(() => [
+                  n(e(H), {
+                    modelValue: t.value.roles,
+                    "onUpdate:modelValue": v[4] || (v[4] = (f) => t.value.roles = f),
+                    options: $.value,
+                    multiple: ""
+                  }, null, 8, ["modelValue", "options"])
+                ]),
+                _: 1
+              }, 8, ["label", "error"]),
+              n(e(D), {
+                label: e(d)("admins.locale")
+              }, {
+                default: l(() => [
+                  n(e(H), {
+                    modelValue: t.value.locale,
+                    "onUpdate:modelValue": v[5] || (v[5] = (f) => t.value.locale = f),
+                    options: z.value
+                  }, null, 8, ["modelValue", "options"])
+                ]),
+                _: 1
+              }, 8, ["label"]),
+              n(e(E), { size: "md" }, {
+                default: l(() => [
+                  n(e(de), {
+                    modelValue: t.value.is_active,
+                    "onUpdate:modelValue": v[6] || (v[6] = (f) => t.value.is_active = f),
+                    label: e(d)("admins.active")
+                  }, null, 8, ["modelValue", "label"]),
+                  n(e(de), {
+                    modelValue: t.value.is_super,
+                    "onUpdate:modelValue": v[7] || (v[7] = (f) => t.value.is_super = f),
+                    label: e(d)("admins.super")
+                  }, null, 8, ["modelValue", "label"])
+                ]),
+                _: 1
+              }),
+              n(e(Y), {
+                size: "sm",
+                tone: "muted"
+              }, {
+                default: l(() => [
+                  L(V(e(d)("admins.super-hint")), 1)
+                ]),
+                _: 1
+              })
+            ])
+          ])
+        ])
+      ]),
+      _: 1
+    }, 8, ["open", "title"]));
+  }
+}), Je = { class: "wx-admin-list" }, Ae = /* @__PURE__ */ I({
+  __name: "AdminList",
+  props: {
+    picking: { type: Boolean, default: !1 },
+    multiple: { type: Boolean, default: !1 },
+    removable: { type: Boolean, default: !1 },
+    filters: { type: Boolean, default: !1 },
+    resolveAvatar: { type: Function, default: void 0 }
+  },
+  emits: ["open", "chosen", "selection", "remove"],
+  setup(a, { expose: i, emit: s }) {
+    const o = a, u = s, b = q(), h = se(b);
+    J();
+    const r = R("webx-auth"), d = w(null), A = w([]), _ = w(!1), c = w("all"), t = w("any"), U = w([]), C = w({});
+    let $ = { page: 1, perPage: 20, sort: null, search: "" };
+    const z = B(() => [
+      { value: "all", label: r("admins.all-roles") },
+      ...A.value.map((y) => ({ value: y.slug, label: y.name }))
+    ]), F = B(() => [
+      { value: "any", label: r("admins.any-state") },
+      { value: "yes", label: r("admins.only-active") },
+      { value: "no", label: r("admins.only-inactive") }
+    ]), T = B(() => [
+      { key: "name", label: r("admins.name"), sortable: !0 },
+      { key: "email", label: r("admins.email"), sortable: !0, hideBelow: 560 },
+      { key: "roles", label: r("admins.roles"), hideBelow: 760 },
+      { key: "is_active", label: r("admins.active"), align: "center", hideBelow: 660 },
+      {
+        key: "last_login_at",
+        label: r("admins.last-login"),
+        sortable: !0,
+        hideBelow: 900,
+        // The first thing to go when a row becomes a card: it is a date somebody scans down a
+        // column, and a card has no column to scan.
+        hideOnCards: !0
+      },
+      {
+        key: "actions",
+        label: "",
+        width: 56,
+        align: "right",
+        hidden: !o.removable,
+        // A card puts them along its top instead, through the `card-actions` slot.
+        hideOnCards: !0
+      }
+    ]);
+    h.roles().then((y) => A.value = y), oe([c, t], () => m($));
+    async function m(y) {
+      $ = y, _.value = !0;
+      try {
+        d.value = await h.list({
+          q: y.search,
+          role: c.value === "all" ? null : c.value,
+          active: t.value === "any" ? null : t.value,
+          sort: y.sort ? `${y.sort.order === "desc" ? "-" : ""}${y.sort.key}` : "name",
+          page: y.page,
+          per_page: y.perPage
+        }), v();
+      } finally {
+        _.value = !1;
+      }
+    }
+    async function v() {
+      const y = o.resolveAvatar;
+      if (y)
+        for (const x of d.value?.data ?? []) {
+          if (!x.avatar || C.value[x.avatar]) continue;
+          const p = await y(x.avatar);
+          p && (C.value = { ...C.value, [x.avatar]: p });
+        }
+    }
+    function f(y) {
+      if (!o.picking) {
+        u("open", y);
+        return;
+      }
+      o.multiple || u("chosen", [y]);
+    }
+    function Q(y, x) {
+      U.value = x, u("selection", x);
+    }
+    return i({ reload: () => m($), chosen: () => U.value }), (y, x) => (k(), K("div", Je, [
+      n(e(Te), {
+        data: d.value,
+        columns: T.value,
+        "row-key": "id",
+        searchable: "",
+        hover: "",
+        flush: "",
+        loading: _.value,
+        "search-placeholder": e(r)("admins.search"),
+        "empty-text": e(r)("admins.empty"),
+        selectable: a.picking && a.multiple,
+        onStateChange: m,
+        onRowClick: f,
+        onSelectionChange: Q
+      }, ne({
+        "cell-name": l(({ row: p }) => [
+          n(e(E), {
+            size: "sm",
+            align: "center"
           }, {
-            default: n(() => [
-              l(g, {
-                label: c.value,
+            default: l(() => [
+              n(e(Me), {
+                name: p.name,
+                src: p.avatar ? C.value[p.avatar] : void 0,
                 size: "sm"
-              }, null, 8, ["label"])
+              }, null, 8, ["name", "src"]),
+              O("span", null, V(p.name), 1),
+              p.is_super ? (k(), S(e(ee), {
+                key: 0,
+                type: "warning"
+              }, {
+                default: l(() => [
+                  L(V(e(r)("admins.super")), 1)
+                ]),
+                _: 1
+              })) : P("", !0)
+            ]),
+            _: 2
+          }, 1024)
+        ]),
+        "cell-roles": l(({ row: p }) => [
+          p.roles.length > 0 ? (k(), S(e(E), {
+            key: 0,
+            size: "xs",
+            wrap: ""
+          }, {
+            default: l(() => [
+              (k(!0), K(te, null, fe(p.roles, (g) => (k(), S(e(ee), {
+                key: g.id
+              }, {
+                default: l(() => [
+                  L(V(g.name), 1)
+                ]),
+                _: 2
+              }, 1024))), 128))
+            ]),
+            _: 2
+          }, 1024)) : (k(), S(e(Y), {
+            key: 1,
+            size: "sm",
+            tone: "muted"
+          }, {
+            default: l(() => [
+              L(V(e(r)("admins.no-roles")), 1)
+            ]),
+            _: 1
+          }))
+        ]),
+        "cell-is_active": l(({ row: p }) => [
+          n(e(ee), {
+            type: p.is_active ? "success" : "default",
+            dot: ""
+          }, {
+            default: l(() => [
+              L(V(p.is_active ? e(r)("admins.active") : e(r)("admins.only-inactive")), 1)
+            ]),
+            _: 2
+          }, 1032, ["type"])
+        ]),
+        "card-actions": l(({ row: p }) => [
+          a.removable ? (k(), S(e(ce), {
+            key: 0,
+            size: "sm",
+            onClick: x[2] || (x[2] = ae(() => {
+            }, ["stop"]))
+          }, {
+            default: l(() => [
+              n(e(me), {
+                type: "remove",
+                title: e(r)("admins.delete"),
+                onClick: (g) => u("remove", p)
+              }, null, 8, ["title", "onClick"])
+            ]),
+            _: 2
+          }, 1024)) : P("", !0)
+        ]),
+        "cell-actions": l(({ row: p }) => [
+          n(e(ce), {
+            size: "sm",
+            onClick: x[3] || (x[3] = ae(() => {
+            }, ["stop"]))
+          }, {
+            default: l(() => [
+              n(e(me), {
+                type: "remove",
+                title: e(r)("admins.delete"),
+                onClick: (g) => u("remove", p)
+              }, null, 8, ["title", "onClick"])
+            ]),
+            _: 2
+          }, 1024)
+        ]),
+        "cell-last_login_at": l(({ row: p }) => [
+          n(e(Y), {
+            size: "sm",
+            tone: p.last_login_at ? "default" : "muted"
+          }, {
+            default: l(() => [
+              L(V(p.last_login_at ? new Date(p.last_login_at).toLocaleString() : e(r)("admins.never")), 1)
+            ]),
+            _: 2
+          }, 1032, ["tone"])
+        ]),
+        _: 2
+      }, [
+        a.filters ? {
+          name: "actions",
+          fn: l(() => [
+            n(e(E), { size: "sm" }, {
+              default: l(() => [
+                n(e(H), {
+                  modelValue: c.value,
+                  "onUpdate:modelValue": x[0] || (x[0] = (p) => c.value = p),
+                  options: z.value,
+                  size: "sm",
+                  style: { width: "180px" }
+                }, null, 8, ["modelValue", "options"]),
+                n(e(H), {
+                  modelValue: t.value,
+                  "onUpdate:modelValue": x[1] || (x[1] = (p) => t.value = p),
+                  options: F.value,
+                  size: "sm",
+                  style: { width: "180px" }
+                }, null, 8, ["modelValue", "options"])
+              ]),
+              _: 1
+            })
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["data", "columns", "loading", "search-placeholder", "empty-text", "selectable"])
+    ]));
+  }
+}), Qe = /* @__PURE__ */ I({
+  __name: "AdminsPage",
+  props: {
+    avatarField: { default: void 0 },
+    resolveAvatar: { type: Function, default: void 0 }
+  },
+  setup(a) {
+    const i = a, s = q(), o = se(s);
+    J();
+    const u = R("webx-auth"), b = le("list"), h = w(null), r = ge(Ge), d = s.can("admins.manage");
+    async function A(c) {
+      h.value = c, await r({ admin: c, avatarField: i.avatarField }) && b.value?.reload();
+    }
+    async function _(c) {
+      if (await Ne({
+        title: u("admins.delete-title", { name: c.name }),
+        message: u("admins.delete-text"),
+        confirmText: u("admins.delete"),
+        cancelText: u("admins.cancel"),
+        tone: "danger"
+      }))
+        try {
+          await o.remove(c.id), G.success(u("admins.deleted")), b.value?.reload();
+        } catch (U) {
+          const C = U.body;
+          G.danger(C?.message ?? u("errors.forbidden"));
+        }
+    }
+    return (c, t) => (k(), S(e(Pe), null, ne({
+      header: l(() => [
+        L(V(e(u)("admins.title")), 1)
+      ]),
+      default: l(() => [
+        n(Ae, {
+          ref_key: "list",
+          ref: b,
+          removable: e(d),
+          "resolve-avatar": i.resolveAvatar,
+          onOpen: A,
+          onRemove: _
+        }, null, 8, ["removable", "resolve-avatar"])
+      ]),
+      _: 2
+    }, [
+      e(d) ? {
+        name: "extra",
+        fn: l(() => [
+          n(e(j), {
+            type: "primary",
+            icon: "add",
+            onClick: t[0] || (t[0] = (U) => A(null))
+          }, {
+            default: l(() => [
+              L(V(e(u)("admins.new-short")), 1)
             ]),
             _: 1
-          }, 8, ["title"])
+          })
         ]),
-        default: n(() => [
-          l(m, { disabled: "" }, {
-            default: n(() => [
-              l(S, { size: "sm" }, {
-                default: n(() => [
-                  M($(d.value.email), 1)
+        key: "0"
+      } : void 0
+    ]), 1024));
+  }
+});
+function oa(a = {}) {
+  const i = a.path ?? "/admins";
+  return {
+    id: "admins",
+    path: i,
+    routes: [
+      {
+        path: i,
+        name: "webx.admins",
+        component: {
+          render: () => he(Qe, {
+            avatarField: a.avatarField,
+            resolveAvatar: a.resolveAvatar
+          })
+        }
+      }
+    ]
+  };
+}
+const Xe = /* @__PURE__ */ I({
+  __name: "AdminPicker",
+  props: {
+    multiple: { type: Boolean, default: !1 },
+    title: { default: void 0 },
+    resolveAvatar: { type: Function, default: void 0 }
+  },
+  setup(a) {
+    const i = a, { open: s, resolve: o, dismiss: u } = ye();
+    J();
+    const b = R("webx-auth"), h = le("list"), r = w(0);
+    function d(_) {
+      o(_);
+    }
+    function A(_) {
+      r.value = _.length;
+    }
+    return (_, c) => (k(), S(e(we), {
+      open: e(s),
+      "onUpdate:open": c[2] || (c[2] = (t) => pe(s) ? s.value = t : null),
+      title: a.title ?? e(b)(a.multiple ? "admins.select-many" : "admins.select-one"),
+      width: 880
+    }, ne({
+      default: l(() => [
+        n(Ae, {
+          ref_key: "list",
+          ref: h,
+          picking: "",
+          multiple: a.multiple,
+          "resolve-avatar": i.resolveAvatar,
+          onChosen: d,
+          onSelection: A
+        }, null, 8, ["multiple", "resolve-avatar"])
+      ]),
+      _: 2
+    }, [
+      a.multiple ? {
+        name: "footer",
+        fn: l(() => [
+          n(e(E), {
+            size: "sm",
+            align: "center"
+          }, {
+            default: l(() => [
+              n(e(Y), {
+                size: "sm",
+                tone: "muted"
+              }, {
+                default: l(() => [
+                  L(V(e(b)("admins.chosen", { count: r.value })), 1)
+                ]),
+                _: 1
+              }),
+              n(e(j), {
+                variant: "outline",
+                onClick: c[0] || (c[0] = (t) => e(u)())
+              }, {
+                default: l(() => [
+                  L(V(e(b)("admins.cancel")), 1)
+                ]),
+                _: 1
+              }),
+              n(e(j), {
+                type: "primary",
+                disabled: r.value === 0,
+                onClick: c[1] || (c[1] = (t) => e(o)(h.value?.chosen() ?? []))
+              }, {
+                default: l(() => [
+                  L(V(e(b)("admins.save")), 1)
+                ]),
+                _: 1
+              }, 8, ["disabled"])
+            ]),
+            _: 1
+          })
+        ]),
+        key: "0"
+      } : void 0
+    ]), 1032, ["open", "title"]));
+  }
+}), Ce = ge(Xe);
+async function na(a = {}) {
+  return (await Ce({ ...a, multiple: !1 }))?.[0];
+}
+function sa(a = {}) {
+  return Ce({ ...a, multiple: !0 });
+}
+const Ze = ["title"], ea = /* @__PURE__ */ I({
+  __name: "UserMenu",
+  props: {
+    signOutLabel: { default: void 0 }
+  },
+  setup(a) {
+    const i = q(), s = xe(), o = be(), u = R("webx-auth"), b = B(() => i.state.user), h = B(
+      () => o.state.panelLocales.length > 1 ? o.state.panelLocales : []
+    );
+    async function r(d) {
+      d !== o.state.locale && await s.setLocale(d);
+    }
+    return (d, A) => {
+      const _ = W("wx-avatar"), c = W("wx-text"), t = W("wx-dropdown-item"), U = W("wx-divider"), C = W("wx-dropdown");
+      return b.value !== null ? (k(), S(C, { key: 0 }, {
+        trigger: l(() => [
+          O("button", {
+            type: "button",
+            class: "wx-user-menu__trigger",
+            title: b.value.name
+          }, [
+            n(_, {
+              name: b.value.name,
+              size: "md"
+            }, null, 8, ["name"])
+          ], 8, Ze)
+        ]),
+        default: l(() => [
+          n(t, { disabled: "" }, {
+            default: l(() => [
+              n(c, { size: "sm" }, {
+                default: l(() => [
+                  L(V(b.value.email), 1)
                 ]),
                 _: 1
               })
             ]),
             _: 1
           }),
-          u.value.length > 0 ? (x(), W(j, { key: 0 }, [
-            l(y, { spacing: 4 }),
-            l(m, { disabled: "" }, {
-              default: n(() => [
-                l(S, {
+          h.value.length > 0 ? (k(), K(te, { key: 0 }, [
+            n(U, { spacing: 4 }),
+            n(t, { disabled: "" }, {
+              default: l(() => [
+                n(c, {
                   size: "sm",
                   tone: "muted"
                 }, {
-                  default: n(() => [
-                    M($(E(i)("menu.language")), 1)
+                  default: l(() => [
+                    L(V(e(u)("menu.language")), 1)
                   ]),
                   _: 1
                 })
               ]),
               _: 1
             }),
-            (x(!0), W(j, null, ne(u.value, (_) => (x(), k(m, {
-              key: _.code,
-              icon: _.code === E(a).state.locale ? "check" : void 0,
-              onClick: (U) => V(_.code)
+            (k(!0), K(te, null, fe(h.value, ($) => (k(), S(t, {
+              key: $.code,
+              icon: $.code === e(o).state.locale ? "check" : void 0,
+              onClick: (z) => r($.code)
             }, {
-              default: n(() => [
-                M($(_.nativeName), 1)
+              default: l(() => [
+                L(V($.nativeName), 1)
               ]),
               _: 2
             }, 1032, ["icon", "onClick"]))), 128)),
-            l(y, { spacing: 4 })
-          ], 64)) : T("", !0),
-          l(m, {
+            n(U, { spacing: 4 })
+          ], 64)) : P("", !0),
+          n(t, {
             icon: "logout",
-            onClick: p[0] || (p[0] = (_) => E(t).logout())
+            onClick: A[0] || (A[0] = ($) => e(s).logout())
           }, {
-            default: n(() => [
-              M($(e.signOutLabel ?? E(i)("menu.sign-out")), 1)
+            default: l(() => [
+              L(V(a.signOutLabel ?? e(u)("menu.sign-out")), 1)
             ]),
             _: 1
           })
         ]),
         _: 1
-      })) : T("", !0);
+      })) : P("", !0);
     };
   }
-});
-function ye(e = {}) {
-  const o = e.path ?? "/login";
+}), ia = /* @__PURE__ */ ke(ea, [["__scopeId", "data-v-f4dbd95e"]]);
+function ra(a = {}) {
+  const i = a.path ?? "/login";
   return {
-    install(t) {
-      const a = de(t.context);
-      t.i18n.defaults("webx-auth", _e), pe(t.app, a), t.context.useSessionLoader(() => a.me()), t.router.addRoute({
-        path: o,
+    install(s) {
+      const o = Oe(s.context);
+      s.i18n.defaults("webx-auth", Ve), Ee(s.app, o), s.context.useSessionLoader(() => o.me()), s.router.addRoute({
+        path: i,
         name: "webx.login",
         meta: { public: !0 },
-        component: { render: () => se(be, { ...e.card }) }
-      }), t.router.beforeEach((i) => i.meta.public === !0 || t.context.state.status !== "unauthenticated" ? !0 : { path: o, query: i.fullPath === "/" ? {} : { next: i.fullPath } }), ue(
-        () => t.context.state.status,
-        (i) => {
-          const d = t.router.currentRoute.value;
-          if (i === "unauthenticated" && d.path !== o) {
-            t.router.replace({ path: o, query: { next: d.fullPath } });
+        component: { render: () => he(Ke, { ...a.card }) }
+      }), s.router.beforeEach((u) => u.meta.public === !0 || s.context.state.status !== "unauthenticated" ? !0 : { path: i, query: u.fullPath === "/" ? {} : { next: u.fullPath } }), oe(
+        () => s.context.state.status,
+        (u) => {
+          const b = s.router.currentRoute.value;
+          if (u === "unauthenticated" && b.path !== i) {
+            s.router.replace({ path: i, query: { next: b.fullPath } });
             return;
           }
-          if (i === "ready" && d.path === o) {
-            const u = d.query.next;
-            t.router.replace(typeof u == "string" ? u : "/");
+          if (u === "ready" && b.path === i) {
+            const h = b.query.next;
+            s.router.replace(typeof h == "string" ? h : "/");
           }
         }
       );
@@ -368,13 +1065,19 @@ function ye(e = {}) {
   };
 }
 export {
-  be as WxLoginCard,
-  ge as WxUserMenu,
-  ye as auth,
-  O as authKey,
-  _e as authMessages,
-  de as createAuthSession,
-  pe as provideAuth,
-  R as useAuth
+  Ae as WxAdminList,
+  Qe as WxAdminsPage,
+  Ke as WxLoginCard,
+  ia as WxUserMenu,
+  oa as admins,
+  ra as auth,
+  _e as authKey,
+  Ve as authMessages,
+  se as createAdminsApi,
+  Oe as createAuthSession,
+  Ee as provideAuth,
+  na as selectAdmin,
+  sa as selectAdmins,
+  xe as useAuth
 };
 //# sourceMappingURL=index.js.map