@webx-ui/module-auth 0.1.0 → 0.2.0

package/README.md

@@ -49,19 +49,21 @@ What it does carry: a password reveal, a Caps Lock warning, `autocomplete="usern
 `current-password` so password managers work, validation errors landing on the right field, and
 a countdown when the server throttles.
 
-Every string is a prop. The library speaks English; the panels built with it do not have to.
+Every string is a prop, and a prop given wins. What happens when one is not given is that the
+label comes from the panel's dictionary — assembled by the server from the same `lang` files it
+writes its own messages from, so the card and the 422 under its fields speak one language
+without anybody listing labels twice.
 
 ```ts
-auth({
-  card: {
-    emailLabel: 'Електронна пошта',
-    passwordLabel: 'Пароль',
-    submitLabel: 'Увійти',
-    rememberLabel: 'Запам’ятати мене',
-  },
-})
+// Nothing to pass: a panel in Ukrainian draws a Ukrainian card.
+auth()
+
+// Unless this particular panel wants its own words.
+auth({ card: { submitLabel: 'Увійти' } })
 ```
 
+Placed outside a panel, with no server to ask, the card falls back to the English it ships.
+
 `WxLoginCard` is exported for a panel that wants to place it itself.
 
 ## The session
@@ -74,6 +76,7 @@ const auth = useAuth()
 await auth.login({ email, password, remember: true })
 await auth.logout()
 const user = await auth.me() // null when nobody is
+await auth.setLocale('uk') // the language this administrator reads the panel in
 ```
 
 There is nothing kept here: the session lives in a cookie, the server is the source of truth,

package/dist/LoginCard.d.ts

@@ -5,7 +5,10 @@
  * little as possible to somebody who has no business behind it, and the people who do have
  * business behind it already know where they are.
  *
- * Every string is a prop. The library speaks English; the panels built with it do not have to.
+ * Every string is still a prop and a prop given still wins. What changed is what happens when
+ * one is not: the label comes from the panel's dictionary, which the server assembles from the
+ * same `lang` files it answers its own messages from. A panel gets its language without being
+ * told every label twice, and a card placed outside a panel still speaks English.
  */
 type __VLS_Props = {
     emailLabel?: string;
@@ -13,7 +16,10 @@ type __VLS_Props = {
     rememberLabel?: string;
     submitLabel?: string;
     capsLockWarning?: string;
+    /** `:seconds` is replaced with however long the server said to wait. */
     throttleMessage?: string;
+    revealLabel?: string;
+    hideLabel?: string;
     /** Offer to stay signed in. The server honours it with a long-lived cookie. */
     remember?: boolean;
     /** Put the cursor in the email field. Off for a card that is not the only thing on screen. */
@@ -32,6 +38,8 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {
     submitLabel: string;
     capsLockWarning: string;
     throttleMessage: string;
+    revealLabel: string;
+    hideLabel: string;
     remember: boolean;
     autofocus: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/UserMenu.d.ts

@@ -1,5 +1,10 @@
 /**
- * The corner of the header: who this is, and the way out.
+ * The corner of the header: who this is, which language they read the panel in, and the way
+ * out.
+ *
+ * The language picker lives here rather than in a settings screen because it is a property of
+ * the person, not of the site — and because somebody who has landed in a language they cannot
+ * read needs it within reach, not three clicks into a section they cannot navigate.
  */
 type __VLS_Props = {
     signOutLabel?: string;

package/dist/index.d.ts

@@ -17,3 +17,4 @@ export { createAuthSession, provideAuth, useAuth, authKey } from './session';
 export type { AuthSession, Credentials } from './session';
 export { default as WxLoginCard } from './LoginCard';
 export { default as WxUserMenu } from './UserMenu';
+export { authMessages } from './messages';

package/dist/index.js

@@ -1,216 +1,230 @@
-import { inject as G, defineComponent as T, ref as d, useTemplateRef as J, onBeforeUnmount as Q, computed as k, resolveComponent as r, openBlock as g, createBlock as h, withCtx as s, createVNode as l, withModifiers as X, createCommentVNode as M, createElementVNode as Y, createTextVNode as $, toDisplayString as A, unref as Z, h as ee, watch as te } from "vue";
-import { HttpError as ae, useAdmin as oe } from "@webx-ui/admin";
-const W = /* @__PURE__ */ Symbol("webx-auth");
-function j() {
-  const e = G(W, null);
+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)
     throw new Error("useAuth() was called outside a panel that installed the auth plugin.");
   return e;
 }
-function ne(e) {
-  const a = `${e.apiPath}/auth`;
+function de(e) {
+  const o = `${e.apiPath}/auth`;
   return {
     async me() {
       try {
-        return (await e.http.get(`${a}/me`)).data;
+        return (await e.http.get(`${o}/me`)).data;
       } catch (t) {
-        if (se(t))
+        if (me(t))
           return null;
         throw t;
       }
     },
     async login(t) {
-      const n = await e.http.post(`${a}/login`, {
+      const a = await e.http.post(`${o}/login`, {
         email: t.email,
         password: t.password,
         remember: t.remember ?? !1
       });
-      return e.setUser(n.data), await e.reload(), n.data;
+      return e.setUser(a.data), await e.reload(), a.data;
+    },
+    async setLocale(t) {
+      const a = await e.http.put(`${o}/locale`, { locale: t });
+      e.setUser(a.data), await e.setLocale(t);
     },
     async logout() {
       try {
-        await e.http.post(`${a}/logout`);
+        await e.http.post(`${o}/logout`);
       } finally {
         e.setUser(null), e.state.status = "unauthenticated", e.state.manifest = null;
       }
     }
   };
 }
-function le(e, a) {
-  e.provide(W, a);
+function pe(e, o) {
+  e.provide(O, o);
 }
-function se(e) {
+function me(e) {
   return typeof e == "object" && e !== null && "status" in e && e.status === 401;
 }
-const ue = ["title", "aria-label", "aria-pressed"], re = /* @__PURE__ */ T({
+const ve = ["title", "aria-label", "aria-pressed"], fe = /* @__PURE__ */ q({
   __name: "LoginCard",
   props: {
-    emailLabel: { default: "Email" },
-    passwordLabel: { default: "Password" },
-    rememberLabel: { default: "Stay signed in" },
-    submitLabel: { default: "Sign in" },
-    capsLockWarning: { default: "Caps Lock is on." },
-    throttleMessage: { default: "Too many attempts. Try again in {seconds} s." },
+    emailLabel: { default: void 0 },
+    passwordLabel: { default: void 0 },
+    rememberLabel: { default: void 0 },
+    submitLabel: { default: void 0 },
+    capsLockWarning: { default: void 0 },
+    throttleMessage: { default: void 0 },
+    revealLabel: { default: void 0 },
+    hideLabel: { default: void 0 },
     remember: { type: Boolean, default: !0 },
     autofocus: { type: Boolean, default: !0 }
   },
   emits: ["success"],
-  setup(e, { expose: a, emit: t }) {
-    const n = e, i = t, p = j(), u = d(""), v = d(""), _ = d(!1), f = d(!1), c = d(!1), y = d(!1), w = d(""), C = d({}), b = d(0), E = J("emailField");
-    let L = null;
-    Q(S);
-    const V = k(() => b.value > 0), q = k(
-      () => n.throttleMessage.replace("{seconds}", String(b.value))
+  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))
     );
-    async function F() {
-      if (!(f.value || V.value)) {
-        f.value = !0, w.value = "", C.value = {};
+    async function D() {
+      if (!(g.value || z.value)) {
+        g.value = !0, m.value = "", y.value = {};
         try {
-          await p.login({
-            email: u.value,
+          await d.login({
+            email: V.value,
             password: v.value,
-            remember: _.value
+            remember: p.value
           }), v.value = "", i("success");
-        } catch (o) {
-          H(o);
+        } catch (s) {
+          G(s);
         } finally {
-          f.value = !1;
+          g.value = !1;
         }
       }
     }
-    function H(o) {
-      if (!(o instanceof ae)) {
-        w.value = o instanceof Error ? o.message : String(o);
+    function G(s) {
+      if (!(s instanceof re)) {
+        m.value = s instanceof Error ? s.message : String(s);
         return;
       }
-      if (o.isValidation) {
-        C.value = o.errors;
+      if (s.isValidation) {
+        y.value = s.errors;
         return;
       }
-      if (o.isThrottled) {
-        I(o.retryAfter ?? 60);
+      if (s.isThrottled) {
+        J(s.retryAfter ?? 60);
         return;
       }
-      w.value = o.message;
+      m.value = s.message;
     }
-    function I(o) {
-      S(), b.value = o, L = setInterval(() => {
-        b.value -= 1, b.value <= 0 && S();
+    function J(s) {
+      A(), w.value = s, U = setInterval(() => {
+        w.value -= 1, w.value <= 0 && A();
       }, 1e3);
     }
-    function S() {
-      L !== null && (clearInterval(L), L = null), b.value = 0;
+    function A() {
+      U !== null && (clearInterval(U), U = null), w.value = 0;
     }
-    function z(o) {
-      y.value = o.getModifierState("CapsLock");
+    function N(s) {
+      S.value = s.getModifierState("CapsLock");
     }
-    return a({ focus: () => E.value?.focus() }), (o, m) => {
-      const B = r("wx-alert"), U = r("wx-icon"), N = r("wx-input"), P = r("wx-form-item"), K = r("wx-checkbox"), O = r("wx-button"), R = r("wx-form"), D = r("wx-card");
-      return g(), h(D, {
+    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, {
         class: "wx-login",
         padding: 24
       }, {
-        default: s(() => [
-          l(R, {
-            errors: C.value,
-            disabled: f.value,
+        default: n(() => [
+          l(Y, {
+            errors: y.value,
+            disabled: g.value,
             gap: "md",
-            onSubmit: X(F, ["prevent"])
+            onSubmit: oe(D, ["prevent"])
           }, {
-            default: s(() => [
-              w.value !== "" ? (g(), h(B, {
+            default: n(() => [
+              m.value !== "" ? (x(), k(I, {
                 key: 0,
                 type: "danger",
                 variant: "soft",
                 live: "",
-                description: w.value,
+                description: m.value,
                 class: "wx-login__message"
-              }, null, 8, ["description"])) : V.value ? (g(), h(B, {
+              }, null, 8, ["description"])) : z.value ? (x(), k(I, {
                 key: 1,
                 type: "warning",
                 variant: "soft",
                 live: "",
-                description: q.value,
+                description: H.value,
                 class: "wx-login__message"
-              }, null, 8, ["description"])) : M("", !0),
-              l(P, { name: "email" }, {
-                default: s(() => [
-                  l(N, {
+              }, null, 8, ["description"])) : T("", !0),
+              l(F, { name: "email" }, {
+                default: n(() => [
+                  l(P, {
                     ref_key: "emailField",
-                    ref: E,
-                    modelValue: u.value,
-                    "onUpdate:modelValue": m[0] || (m[0] = (x) => u.value = x),
+                    ref: _,
+                    modelValue: V.value,
+                    "onUpdate:modelValue": h[0] || (h[0] = (L) => V.value = L),
                     type: "email",
-                    placeholder: e.emailLabel,
-                    "aria-label": e.emailLabel,
+                    placeholder: c.value.email,
+                    "aria-label": c.value.email,
                     autocomplete: "username",
                     autofocus: e.autofocus,
                     inputmode: "email",
                     size: "lg"
                   }, {
-                    prefix: s(() => [
-                      l(U, { name: "mail" })
+                    prefix: n(() => [
+                      l(B, { name: "mail" })
                     ]),
                     _: 1
                   }, 8, ["modelValue", "placeholder", "aria-label", "autofocus"])
                 ]),
                 _: 1
               }),
-              l(P, {
+              l(F, {
                 name: "password",
-                help: y.value ? e.capsLockWarning : void 0
+                help: S.value ? c.value.capsLock : void 0
               }, {
-                default: s(() => [
-                  l(N, {
+                default: n(() => [
+                  l(P, {
                     modelValue: v.value,
-                    "onUpdate:modelValue": m[2] || (m[2] = (x) => v.value = x),
-                    type: c.value ? "text" : "password",
-                    placeholder: e.passwordLabel,
-                    "aria-label": e.passwordLabel,
+                    "onUpdate:modelValue": h[2] || (h[2] = (L) => v.value = L),
+                    type: f.value ? "text" : "password",
+                    placeholder: c.value.password,
+                    "aria-label": c.value.password,
                     autocomplete: "current-password",
                     size: "lg",
-                    onKeydown: z,
-                    onKeyup: z
+                    onKeydown: N,
+                    onKeyup: N
                   }, {
-                    prefix: s(() => [
-                      l(U, { name: "lock" })
+                    prefix: n(() => [
+                      l(B, { name: "lock" })
                     ]),
-                    suffix: s(() => [
-                      Y("button", {
+                    suffix: n(() => [
+                      le("button", {
                         type: "button",
                         class: "wx-login__reveal",
-                        title: c.value ? "Hide the password" : "Show the password",
-                        "aria-label": c.value ? "Hide the password" : "Show the password",
-                        "aria-pressed": c.value,
+                        title: f.value ? c.value.hide : c.value.reveal,
+                        "aria-label": f.value ? c.value.hide : c.value.reveal,
+                        "aria-pressed": f.value,
                         tabindex: "-1",
-                        onClick: m[1] || (m[1] = (x) => c.value = !c.value)
+                        onClick: h[1] || (h[1] = (L) => f.value = !f.value)
                       }, [
-                        l(U, {
-                          name: c.value ? "eye-off" : "eye"
+                        l(B, {
+                          name: f.value ? "eye-off" : "eye"
                         }, null, 8, ["name"])
-                      ], 8, ue)
+                      ], 8, ve)
                     ]),
                     _: 1
                   }, 8, ["modelValue", "type", "placeholder", "aria-label"])
                 ]),
                 _: 1
               }, 8, ["help"]),
-              e.remember ? (g(), h(K, {
+              e.remember ? (x(), k(Q, {
                 key: 2,
-                modelValue: _.value,
-                "onUpdate:modelValue": m[3] || (m[3] = (x) => _.value = x),
-                label: e.rememberLabel
-              }, null, 8, ["modelValue", "label"])) : M("", !0),
-              l(O, {
+                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, {
                 type: "primary",
                 "native-type": "submit",
                 size: "lg",
                 block: "",
-                loading: f.value,
-                disabled: V.value
+                loading: g.value,
+                disabled: z.value
               }, {
-                default: s(() => [
-                  $(A(e.submitLabel), 1)
+                default: n(() => [
+                  M($(c.value.submit), 1)
                 ]),
                 _: 1
               }, 8, ["loading", "disabled"])
@@ -222,81 +236,130 @@ const ue = ["title", "aria-label", "aria-pressed"], re = /* @__PURE__ */ T({
       });
     };
   }
-}), ie = (e, a) => {
+}), we = (e, o) => {
   const t = e.__vccOpts || e;
-  for (const [n, i] of a)
-    t[n] = i;
+  for (const [a, i] of o)
+    t[a] = i;
   return t;
-}, ce = /* @__PURE__ */ ie(re, [["__scopeId", "data-v-41458fe2"]]), me = /* @__PURE__ */ T({
+}, be = /* @__PURE__ */ we(fe, [["__scopeId", "data-v-1224c1f8"]]), _e = {
+  card: {
+    email: "Email",
+    password: "Password",
+    remember: "Stay signed in",
+    submit: "Sign in",
+    "caps-lock": "Caps Lock is on.",
+    reveal: "Show the password",
+    hide: "Hide the password",
+    throttled: "Too many attempts. Try again in :seconds s.",
+    failed: "Those details do not match an account."
+  },
+  menu: {
+    "sign-out": "Sign out",
+    language: "Interface language"
+  }
+}, ge = /* @__PURE__ */ q({
   __name: "UserMenu",
   props: {
-    signOutLabel: { default: "Sign out" }
+    signOutLabel: { default: void 0 }
   },
   setup(e) {
-    const a = oe(), t = j(), n = k(() => a.state.user), i = k(() => (n.value?.name ?? "").split(/\s+/).filter((u) => u !== "").slice(0, 2).map((u) => u[0]?.toUpperCase() ?? "").join(""));
-    return (p, u) => {
-      const v = r("wx-avatar"), _ = r("wx-action"), f = r("wx-text"), c = r("wx-dropdown-item"), y = r("wx-dropdown");
-      return n.value !== null ? (g(), h(y, { key: 0 }, {
-        trigger: s(() => [
-          l(_, {
-            title: n.value.name
+    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);
+    }
+    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
           }, {
-            default: s(() => [
-              l(v, {
-                label: i.value,
+            default: n(() => [
+              l(g, {
+                label: c.value,
                 size: "sm"
               }, null, 8, ["label"])
             ]),
             _: 1
           }, 8, ["title"])
         ]),
-        default: s(() => [
-          l(c, { disabled: "" }, {
-            default: s(() => [
-              l(f, { size: "sm" }, {
-                default: s(() => [
-                  $(A(n.value.email), 1)
+        default: n(() => [
+          l(m, { disabled: "" }, {
+            default: n(() => [
+              l(S, { size: "sm" }, {
+                default: n(() => [
+                  M($(d.value.email), 1)
                 ]),
                 _: 1
               })
             ]),
             _: 1
           }),
-          l(c, {
+          u.value.length > 0 ? (x(), W(j, { key: 0 }, [
+            l(y, { spacing: 4 }),
+            l(m, { disabled: "" }, {
+              default: n(() => [
+                l(S, {
+                  size: "sm",
+                  tone: "muted"
+                }, {
+                  default: n(() => [
+                    M($(E(i)("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)
+            }, {
+              default: n(() => [
+                M($(_.nativeName), 1)
+              ]),
+              _: 2
+            }, 1032, ["icon", "onClick"]))), 128)),
+            l(y, { spacing: 4 })
+          ], 64)) : T("", !0),
+          l(m, {
             icon: "logout",
-            onClick: u[0] || (u[0] = (w) => Z(t).logout())
+            onClick: p[0] || (p[0] = (_) => E(t).logout())
           }, {
-            default: s(() => [
-              $(A(e.signOutLabel), 1)
+            default: n(() => [
+              M($(e.signOutLabel ?? E(i)("menu.sign-out")), 1)
             ]),
             _: 1
           })
         ]),
         _: 1
-      })) : M("", !0);
+      })) : T("", !0);
     };
   }
 });
-function fe(e = {}) {
-  const a = e.path ?? "/login";
+function ye(e = {}) {
+  const o = e.path ?? "/login";
   return {
     install(t) {
-      const n = ne(t.context);
-      le(t.app, n), t.context.useSessionLoader(() => n.me()), t.router.addRoute({
-        path: a,
+      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,
         name: "webx.login",
         meta: { public: !0 },
-        component: { render: () => ee(ce, { ...e.card }) }
-      }), t.router.beforeEach((i) => i.meta.public === !0 || t.context.state.status !== "unauthenticated" ? !0 : { path: a, query: i.fullPath === "/" ? {} : { next: i.fullPath } }), te(
+        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 p = t.router.currentRoute.value;
-          if (i === "unauthenticated" && p.path !== a) {
-            t.router.replace({ path: a, query: { next: p.fullPath } });
+          const d = t.router.currentRoute.value;
+          if (i === "unauthenticated" && d.path !== o) {
+            t.router.replace({ path: o, query: { next: d.fullPath } });
             return;
           }
-          if (i === "ready" && p.path === a) {
-            const u = p.query.next;
+          if (i === "ready" && d.path === o) {
+            const u = d.query.next;
             t.router.replace(typeof u == "string" ? u : "/");
           }
         }
@@ -305,12 +368,13 @@ function fe(e = {}) {
   };
 }
 export {
-  ce as WxLoginCard,
-  me as WxUserMenu,
-  fe as auth,
-  W as authKey,
-  ne as createAuthSession,
-  le as provideAuth,
-  j as useAuth
+  be as WxLoginCard,
+  ge as WxUserMenu,
+  ye as auth,
+  O as authKey,
+  _e as authMessages,
+  de as createAuthSession,
+  pe as provideAuth,
+  R as useAuth
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/session.ts","../src/LoginCard.vue","../src/UserMenu.vue","../src/index.ts"],"sourcesContent":["import { inject, type App, type InjectionKey } from 'vue'\nimport type { AdminContext, AdminUser } from '@webx-ui/admin'\n\nexport interface Credentials {\n  email: string\n  password: string\n  remember?: boolean\n}\n\nexport interface AuthSession {\n  /** Who is signed in, or null. A 401 is an answer, not a failure. */\n  me(): Promise<AdminUser | null>\n  /** Signs in and tells the panel to load itself. Throws `HttpError` on a refusal. */\n  login(credentials: Credentials): Promise<AdminUser>\n  logout(): Promise<void>\n}\n\nexport const authKey: InjectionKey<AuthSession> = Symbol('webx-auth')\n\nexport function useAuth(): AuthSession {\n  const session = inject(authKey, null)\n\n  if (session === null) {\n    throw new Error('useAuth() was called outside a panel that installed the auth plugin.')\n  }\n\n  return session\n}\n\n/**\n * The three calls `webx-ui/module-auth` answers, and nothing else.\n *\n * The session lives in a cookie, so there is nothing to keep here: the source of truth is the\n * server, and the panel asks it rather than remembering.\n */\nexport function createAuthSession(admin: AdminContext): AuthSession {\n  const base = `${admin.apiPath}/auth`\n\n  return {\n    async me() {\n      try {\n        const body = await admin.http.get<{ data: AdminUser | null }>(`${base}/me`)\n\n        return body.data\n      } catch (error) {\n        if (isUnauthenticated(error)) {\n          return null\n        }\n\n        throw error\n      }\n    },\n\n    async login(credentials) {\n      const body = await admin.http.post<{ data: AdminUser }>(`${base}/login`, {\n        email: credentials.email,\n        password: credentials.password,\n        remember: credentials.remember ?? false,\n      })\n\n      admin.setUser(body.data)\n\n      // Signing in is the moment the panel becomes knowable: the manifest needs a session,\n      // so it could not have been loaded before now.\n      await admin.reload()\n\n      return body.data\n    },\n\n    async logout() {\n      try {\n        await admin.http.post(`${base}/logout`)\n      } finally {\n        // Whatever the server said, this browser is done: leaving the panel drawn behind a\n        // failed sign-out would be worse than signing out optimistically.\n        admin.setUser(null)\n        admin.state.status = 'unauthenticated'\n        admin.state.manifest = null\n      }\n    },\n  }\n}\n\nexport function provideAuth(app: App, session: AuthSession): void {\n  app.provide(authKey, session)\n}\n\nfunction isUnauthenticated(error: unknown): boolean {\n  return (\n    typeof error === 'object' &&\n    error !== null &&\n    'status' in error &&\n    (error as { status: unknown }).status === 401\n  )\n}\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, ref, useTemplateRef } from 'vue'\nimport { HttpError } from '@webx-ui/admin'\nimport { useAuth } from './session'\n\n/**\n * The card a panel opens on.\n *\n * No logo, no product name, no \"welcome back\" — an admin panel's front door should say as\n * little as possible to somebody who has no business behind it, and the people who do have\n * business behind it already know where they are.\n *\n * Every string is a prop. The library speaks English; the panels built with it do not have to.\n */\nconst props = withDefaults(\n  defineProps<{\n    emailLabel?: string\n    passwordLabel?: string\n    rememberLabel?: string\n    submitLabel?: string\n    capsLockWarning?: string\n    throttleMessage?: string\n    /** Offer to stay signed in. The server honours it with a long-lived cookie. */\n    remember?: boolean\n    /** Put the cursor in the email field. Off for a card that is not the only thing on screen. */\n    autofocus?: boolean\n  }>(),\n  {\n    emailLabel: 'Email',\n    passwordLabel: 'Password',\n    rememberLabel: 'Stay signed in',\n    submitLabel: 'Sign in',\n    capsLockWarning: 'Caps Lock is on.',\n    // `{seconds}` is replaced with however long the server said to wait.\n    throttleMessage: 'Too many attempts. Try again in {seconds} s.',\n    remember: true,\n    autofocus: true,\n  },\n)\n\nconst emit = defineEmits<{ success: [] }>()\n\nconst auth = useAuth()\n\nconst email = ref('')\nconst password = ref('')\nconst rememberMe = ref(false)\n\nconst busy = ref(false)\nconst revealed = ref(false)\nconst capsLock = ref(false)\nconst message = ref('')\nconst errors = ref<Record<string, string[]>>({})\nconst secondsLeft = ref(0)\n\nconst emailField = useTemplateRef<HTMLInputElement>('emailField')\n\nlet countdown: ReturnType<typeof setInterval> | null = null\n\nonBeforeUnmount(stopCountdown)\n\nconst throttled = computed(() => secondsLeft.value > 0)\n\nconst throttleNotice = computed(() =>\n  props.throttleMessage.replace('{seconds}', String(secondsLeft.value)),\n)\n\nasync function submit(): Promise<void> {\n  if (busy.value || throttled.value) {\n    return\n  }\n\n  busy.value = true\n  message.value = ''\n  errors.value = {}\n\n  try {\n    await auth.login({\n      email: email.value,\n      password: password.value,\n      remember: rememberMe.value,\n    })\n\n    password.value = ''\n    emit('success')\n  } catch (error) {\n    handle(error)\n  } finally {\n    busy.value = false\n  }\n}\n\nfunction handle(error: unknown): void {\n  if (!(error instanceof HttpError)) {\n    message.value = error instanceof Error ? error.message : String(error)\n\n    return\n  }\n\n  // A bad password comes back as a 422 against the email field, the same as an address\n  // nobody owns — the server refuses to say which, and so does this.\n  if (error.isValidation) {\n    errors.value = error.errors\n\n    return\n  }\n\n  if (error.isThrottled) {\n    startCountdown(error.retryAfter ?? 60)\n\n    return\n  }\n\n  message.value = error.message\n}\n\nfunction startCountdown(seconds: number): void {\n  stopCountdown()\n  secondsLeft.value = seconds\n\n  countdown = setInterval(() => {\n    secondsLeft.value -= 1\n\n    if (secondsLeft.value <= 0) {\n      stopCountdown()\n    }\n  }, 1000)\n}\n\nfunction stopCountdown(): void {\n  if (countdown !== null) {\n    clearInterval(countdown)\n    countdown = null\n  }\n\n  secondsLeft.value = 0\n}\n\n/**\n * Worth saying out loud: a password typed in capitals fails with the same unhelpful message\n * as a wrong one, and people retype it three times before noticing.\n */\nfunction trackCapsLock(event: KeyboardEvent): void {\n  capsLock.value = event.getModifierState('CapsLock')\n}\n\ndefineExpose({ focus: () => emailField.value?.focus() })\n</script>\n\n<template>\n  <wx-card class=\"wx-login\" :padding=\"24\">\n    <wx-form :errors=\"errors\" :disabled=\"busy\" gap=\"md\" @submit.prevent=\"submit\">\n      <wx-alert\n        v-if=\"message !== ''\"\n        type=\"danger\"\n        variant=\"soft\"\n        live\n        :description=\"message\"\n        class=\"wx-login__message\"\n      />\n\n      <wx-alert\n        v-else-if=\"throttled\"\n        type=\"warning\"\n        variant=\"soft\"\n        live\n        :description=\"throttleNotice\"\n        class=\"wx-login__message\"\n      />\n\n      <wx-form-item name=\"email\">\n        <wx-input\n          ref=\"emailField\"\n          v-model=\"email\"\n          type=\"email\"\n          :placeholder=\"emailLabel\"\n          :aria-label=\"emailLabel\"\n          autocomplete=\"username\"\n          :autofocus=\"autofocus\"\n          inputmode=\"email\"\n          size=\"lg\"\n        >\n          <template #prefix><wx-icon name=\"mail\" /></template>\n        </wx-input>\n      </wx-form-item>\n\n      <wx-form-item name=\"password\" :help=\"capsLock ? capsLockWarning : undefined\">\n        <wx-input\n          v-model=\"password\"\n          :type=\"revealed ? 'text' : 'password'\"\n          :placeholder=\"passwordLabel\"\n          :aria-label=\"passwordLabel\"\n          autocomplete=\"current-password\"\n          size=\"lg\"\n          @keydown=\"trackCapsLock\"\n          @keyup=\"trackCapsLock\"\n        >\n          <template #prefix><wx-icon name=\"lock\" /></template>\n          <template #suffix>\n            <!-- A bare icon rather than a button with a surface: it sits inside the field, and\n                 a second box in there reads as a second control. Out of the tab order because\n                 it is a convenience, not a step. -->\n            <button\n              type=\"button\"\n              class=\"wx-login__reveal\"\n              :title=\"revealed ? 'Hide the password' : 'Show the password'\"\n              :aria-label=\"revealed ? 'Hide the password' : 'Show the password'\"\n              :aria-pressed=\"revealed\"\n              tabindex=\"-1\"\n              @click=\"revealed = !revealed\"\n            >\n              <wx-icon :name=\"revealed ? 'eye-off' : 'eye'\" />\n            </button>\n          </template>\n        </wx-input>\n      </wx-form-item>\n\n      <wx-checkbox v-if=\"remember\" v-model=\"rememberMe\" :label=\"rememberLabel\" />\n\n      <wx-button\n        type=\"primary\"\n        native-type=\"submit\"\n        size=\"lg\"\n        block\n        :loading=\"busy\"\n        :disabled=\"throttled\"\n      >\n        {{ submitLabel }}\n      </wx-button>\n    </wx-form>\n  </wx-card>\n</template>\n\n<style scoped>\n.wx-login {\n  width: 100%;\n  /* Wide enough for an email address, narrow enough to stay a card rather than a page. */\n  max-width: 26rem;\n}\n\n.wx-login__message {\n  margin-block-end: var(--wx-space-4);\n}\n\n.wx-login__reveal {\n  display: inline-flex;\n  align-items: center;\n  padding: 0;\n  color: var(--wx-text-muted);\n  background: none;\n  border: 0;\n  cursor: pointer;\n}\n\n.wx-login__reveal:hover,\n.wx-login__reveal[aria-pressed='true'] {\n  color: var(--wx-text-default);\n}\n</style>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { useAdmin } from '@webx-ui/admin'\nimport { useAuth } from './session'\n\n/**\n * The corner of the header: who this is, and the way out.\n */\nwithDefaults(defineProps<{ signOutLabel?: string }>(), { signOutLabel: 'Sign out' })\n\nconst admin = useAdmin()\nconst auth = useAuth()\n\nconst user = computed(() => admin.state.user)\n\nconst initials = computed(() => {\n  const name = user.value?.name ?? ''\n\n  return name\n    .split(/\\s+/)\n    .filter((part) => part !== '')\n    .slice(0, 2)\n    .map((part) => part[0]?.toUpperCase() ?? '')\n    .join('')\n})\n</script>\n\n<template>\n  <wx-dropdown v-if=\"user !== null\">\n    <template #trigger>\n      <wx-action :title=\"user.name\">\n        <wx-avatar :label=\"initials\" size=\"sm\" />\n      </wx-action>\n    </template>\n\n    <wx-dropdown-item disabled>\n      <wx-text size=\"sm\">{{ user.email }}</wx-text>\n    </wx-dropdown-item>\n\n    <wx-dropdown-item icon=\"logout\" @click=\"auth.logout()\">{{ signOutLabel }}</wx-dropdown-item>\n  </wx-dropdown>\n</template>\n","import { h, watch } from 'vue'\nimport type { Admin, AdminPlugin } from '@webx-ui/admin'\nimport LoginCard from './LoginCard.vue'\nimport { createAuthSession, provideAuth } from './session'\n\nexport interface AuthOptions {\n  /** Where the sign-in screen lives, inside the panel. */\n  path?: string\n  /** Props handed to the card — the labels, mostly. */\n  card?: Record<string, unknown>\n}\n\n/**\n * Signing in, as a plugin rather than a section: it owns a route and a guard, and it has no\n * place in the menu.\n *\n * Installing it also tells the panel how to find out who is signed in, which is why the panel\n * itself knows nothing about authentication — it holds the answer, not the question.\n */\nexport function auth(options: AuthOptions = {}): AdminPlugin {\n  const path = options.path ?? '/login'\n\n  return {\n    install(admin: Admin) {\n      const session = createAuthSession(admin.context)\n\n      provideAuth(admin.app, session)\n      admin.context.useSessionLoader(() => session.me())\n\n      admin.router.addRoute({\n        path,\n        name: 'webx.login',\n        meta: { public: true },\n        component: { render: () => h(LoginCard, { ...options.card }) },\n      })\n\n      admin.router.beforeEach((to) => {\n        if (to.meta.public === true) {\n          return true\n        }\n\n        if (admin.context.state.status !== 'unauthenticated') {\n          return true\n        }\n\n        return { path, query: to.fullPath === '/' ? {} : { next: to.fullPath } }\n      })\n\n      // Both directions are driven by the state rather than by an event, because the card\n      // cannot be relied on to announce its own success: signing in flips the panel to\n      // `ready`, the shell swaps the branch it renders, and the card is unmounted before the\n      // line after `await` runs.\n      watch(\n        () => admin.context.state.status,\n        (status) => {\n          const current = admin.router.currentRoute.value\n\n          // A session can also end between requests — a sign-out in another tab, an account\n          // switched off. The panel learns that from a 401 on whatever it asked for next,\n          // which is not a navigation, so nothing would move without this.\n          if (status === 'unauthenticated' && current.path !== path) {\n            void admin.router.replace({ path, query: { next: current.fullPath } })\n\n            return\n          }\n\n          if (status === 'ready' && current.path === path) {\n            const next = current.query.next\n\n            void admin.router.replace(typeof next === 'string' ? next : '/')\n          }\n        },\n      )\n    },\n  }\n}\n\nexport { createAuthSession, provideAuth, useAuth, authKey } from './session'\nexport type { AuthSession, Credentials } from './session'\nexport { default as WxLoginCard } from './LoginCard.vue'\nexport { default as WxUserMenu } from './UserMenu.vue'\n"],"names":["authKey","useAuth","session","inject","createAuthSession","admin","base","error","isUnauthenticated","credentials","body","provideAuth","app","props","__props","emit","__emit","auth","email","ref","password","rememberMe","busy","revealed","capsLock","message","errors","secondsLeft","emailField","useTemplateRef","countdown","onBeforeUnmount","stopCountdown","throttled","computed","throttleNotice","submit","handle","HttpError","startCountdown","seconds","trackCapsLock","event","__expose","_createBlock","_component_wx_card","_createVNode","_component_wx_form","_component_wx_alert","_component_wx_form_item","_component_wx_input","$event","_component_wx_icon","_createElementVNode","_cache","_component_wx_checkbox","_component_wx_button","useAdmin","user","initials","part","_component_wx_dropdown","_component_wx_action","_component_wx_avatar","_component_wx_dropdown_item","_component_wx_text","_createTextVNode","_toDisplayString","_unref","options","path","h","LoginCard","to","watch","status","current","next"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/session.ts","../src/LoginCard.vue","../src/messages.ts","../src/UserMenu.vue","../src/index.ts"],"sourcesContent":["import { inject, type App, type InjectionKey } from 'vue'\nimport type { AdminContext, AdminUser } from '@webx-ui/admin'\n\nexport interface Credentials {\n  email: string\n  password: string\n  remember?: boolean\n}\n\nexport interface AuthSession {\n  /** Who is signed in, or null. A 401 is an answer, not a failure. */\n  me(): Promise<AdminUser | null>\n  /** Signs in and tells the panel to load itself. Throws `HttpError` on a refusal. */\n  login(credentials: Credentials): Promise<AdminUser>\n  logout(): Promise<void>\n  /**\n   * Change the language this administrator reads the panel in.\n   *\n   * Stored on the person rather than in this browser, so it follows them to the next machine\n   * and so the server writes its own messages — a 422 under a field — in the same language as\n   * the label above it.\n   */\n  setLocale(code: string): Promise<void>\n}\n\nexport const authKey: InjectionKey<AuthSession> = Symbol('webx-auth')\n\nexport function useAuth(): AuthSession {\n  const session = inject(authKey, null)\n\n  if (session === null) {\n    throw new Error('useAuth() was called outside a panel that installed the auth plugin.')\n  }\n\n  return session\n}\n\n/**\n * The three calls `webx-ui/module-auth` answers, and nothing else.\n *\n * The session lives in a cookie, so there is nothing to keep here: the source of truth is the\n * server, and the panel asks it rather than remembering.\n */\nexport function createAuthSession(admin: AdminContext): AuthSession {\n  const base = `${admin.apiPath}/auth`\n\n  return {\n    async me() {\n      try {\n        const body = await admin.http.get<{ data: AdminUser | null }>(`${base}/me`)\n\n        return body.data\n      } catch (error) {\n        if (isUnauthenticated(error)) {\n          return null\n        }\n\n        throw error\n      }\n    },\n\n    async login(credentials) {\n      const body = await admin.http.post<{ data: AdminUser }>(`${base}/login`, {\n        email: credentials.email,\n        password: credentials.password,\n        remember: credentials.remember ?? false,\n      })\n\n      admin.setUser(body.data)\n\n      // Signing in is the moment the panel becomes knowable: the manifest needs a session,\n      // so it could not have been loaded before now.\n      await admin.reload()\n\n      return body.data\n    },\n\n    async setLocale(code) {\n      // The panel redraws only after the server has accepted the choice: a language that\n      // half took — menus switched, error messages not — is worse than one that did not.\n      const body = await admin.http.put<{ data: AdminUser }>(`${base}/locale`, { locale: code })\n\n      admin.setUser(body.data)\n\n      await admin.setLocale(code)\n    },\n\n    async logout() {\n      try {\n        await admin.http.post(`${base}/logout`)\n      } finally {\n        // Whatever the server said, this browser is done: leaving the panel drawn behind a\n        // failed sign-out would be worse than signing out optimistically.\n        admin.setUser(null)\n        admin.state.status = 'unauthenticated'\n        admin.state.manifest = null\n      }\n    },\n  }\n}\n\nexport function provideAuth(app: App, session: AuthSession): void {\n  app.provide(authKey, session)\n}\n\nfunction isUnauthenticated(error: unknown): boolean {\n  return (\n    typeof error === 'object' &&\n    error !== null &&\n    'status' in error &&\n    (error as { status: unknown }).status === 401\n  )\n}\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, ref, useTemplateRef } from 'vue'\nimport { HttpError, useTranslate } from '@webx-ui/admin'\nimport { useAuth } from './session'\n\n/**\n * The card a panel opens on.\n *\n * No logo, no product name, no \"welcome back\" — an admin panel's front door should say as\n * little as possible to somebody who has no business behind it, and the people who do have\n * business behind it already know where they are.\n *\n * Every string is still a prop and a prop given still wins. What changed is what happens when\n * one is not: the label comes from the panel's dictionary, which the server assembles from the\n * same `lang` files it answers its own messages from. A panel gets its language without being\n * told every label twice, and a card placed outside a panel still speaks English.\n */\nconst props = withDefaults(\n  defineProps<{\n    emailLabel?: string\n    passwordLabel?: string\n    rememberLabel?: string\n    submitLabel?: string\n    capsLockWarning?: string\n    /** `:seconds` is replaced with however long the server said to wait. */\n    throttleMessage?: string\n    revealLabel?: string\n    hideLabel?: string\n    /** Offer to stay signed in. The server honours it with a long-lived cookie. */\n    remember?: boolean\n    /** Put the cursor in the email field. Off for a card that is not the only thing on screen. */\n    autofocus?: boolean\n  }>(),\n  {\n    // Undefined rather than a string, so \"not given\" is tellable from \"given as English\" and\n    // the dictionary gets its turn.\n    emailLabel: undefined,\n    passwordLabel: undefined,\n    rememberLabel: undefined,\n    submitLabel: undefined,\n    capsLockWarning: undefined,\n    throttleMessage: undefined,\n    revealLabel: undefined,\n    hideLabel: undefined,\n    remember: true,\n    autofocus: true,\n  },\n)\n\nconst emit = defineEmits<{ success: [] }>()\n\nconst auth = useAuth()\nconst t = useTranslate('webx-auth')\n\nconst labels = computed(() => ({\n  email: props.emailLabel ?? t('card.email'),\n  password: props.passwordLabel ?? t('card.password'),\n  remember: props.rememberLabel ?? t('card.remember'),\n  submit: props.submitLabel ?? t('card.submit'),\n  capsLock: props.capsLockWarning ?? t('card.caps-lock'),\n  reveal: props.revealLabel ?? t('card.reveal'),\n  hide: props.hideLabel ?? t('card.hide'),\n}))\n\nconst email = ref('')\nconst password = ref('')\nconst rememberMe = ref(false)\n\nconst busy = ref(false)\nconst revealed = ref(false)\nconst capsLock = ref(false)\nconst message = ref('')\nconst errors = ref<Record<string, string[]>>({})\nconst secondsLeft = ref(0)\n\nconst emailField = useTemplateRef<HTMLInputElement>('emailField')\n\nlet countdown: ReturnType<typeof setInterval> | null = null\n\nonBeforeUnmount(stopCountdown)\n\nconst throttled = computed(() => secondsLeft.value > 0)\n\nconst throttleNotice = computed(() =>\n  props.throttleMessage === undefined\n    ? t('card.throttled', { seconds: secondsLeft.value })\n    : props.throttleMessage.replace(':seconds', String(secondsLeft.value)),\n)\n\nasync function submit(): Promise<void> {\n  if (busy.value || throttled.value) {\n    return\n  }\n\n  busy.value = true\n  message.value = ''\n  errors.value = {}\n\n  try {\n    await auth.login({\n      email: email.value,\n      password: password.value,\n      remember: rememberMe.value,\n    })\n\n    password.value = ''\n    emit('success')\n  } catch (error) {\n    handle(error)\n  } finally {\n    busy.value = false\n  }\n}\n\nfunction handle(error: unknown): void {\n  if (!(error instanceof HttpError)) {\n    message.value = error instanceof Error ? error.message : String(error)\n\n    return\n  }\n\n  // A bad password comes back as a 422 against the email field, the same as an address\n  // nobody owns — the server refuses to say which, and so does this.\n  if (error.isValidation) {\n    errors.value = error.errors\n\n    return\n  }\n\n  if (error.isThrottled) {\n    startCountdown(error.retryAfter ?? 60)\n\n    return\n  }\n\n  message.value = error.message\n}\n\nfunction startCountdown(seconds: number): void {\n  stopCountdown()\n  secondsLeft.value = seconds\n\n  countdown = setInterval(() => {\n    secondsLeft.value -= 1\n\n    if (secondsLeft.value <= 0) {\n      stopCountdown()\n    }\n  }, 1000)\n}\n\nfunction stopCountdown(): void {\n  if (countdown !== null) {\n    clearInterval(countdown)\n    countdown = null\n  }\n\n  secondsLeft.value = 0\n}\n\n/**\n * Worth saying out loud: a password typed in capitals fails with the same unhelpful message\n * as a wrong one, and people retype it three times before noticing.\n */\nfunction trackCapsLock(event: KeyboardEvent): void {\n  capsLock.value = event.getModifierState('CapsLock')\n}\n\ndefineExpose({ focus: () => emailField.value?.focus() })\n</script>\n\n<template>\n  <wx-card class=\"wx-login\" :padding=\"24\">\n    <wx-form :errors=\"errors\" :disabled=\"busy\" gap=\"md\" @submit.prevent=\"submit\">\n      <wx-alert\n        v-if=\"message !== ''\"\n        type=\"danger\"\n        variant=\"soft\"\n        live\n        :description=\"message\"\n        class=\"wx-login__message\"\n      />\n\n      <wx-alert\n        v-else-if=\"throttled\"\n        type=\"warning\"\n        variant=\"soft\"\n        live\n        :description=\"throttleNotice\"\n        class=\"wx-login__message\"\n      />\n\n      <wx-form-item name=\"email\">\n        <wx-input\n          ref=\"emailField\"\n          v-model=\"email\"\n          type=\"email\"\n          :placeholder=\"labels.email\"\n          :aria-label=\"labels.email\"\n          autocomplete=\"username\"\n          :autofocus=\"autofocus\"\n          inputmode=\"email\"\n          size=\"lg\"\n        >\n          <template #prefix><wx-icon name=\"mail\" /></template>\n        </wx-input>\n      </wx-form-item>\n\n      <wx-form-item name=\"password\" :help=\"capsLock ? labels.capsLock : undefined\">\n        <wx-input\n          v-model=\"password\"\n          :type=\"revealed ? 'text' : 'password'\"\n          :placeholder=\"labels.password\"\n          :aria-label=\"labels.password\"\n          autocomplete=\"current-password\"\n          size=\"lg\"\n          @keydown=\"trackCapsLock\"\n          @keyup=\"trackCapsLock\"\n        >\n          <template #prefix><wx-icon name=\"lock\" /></template>\n          <template #suffix>\n            <!-- A bare icon rather than a button with a surface: it sits inside the field, and\n                 a second box in there reads as a second control. Out of the tab order because\n                 it is a convenience, not a step. -->\n            <button\n              type=\"button\"\n              class=\"wx-login__reveal\"\n              :title=\"revealed ? labels.hide : labels.reveal\"\n              :aria-label=\"revealed ? labels.hide : labels.reveal\"\n              :aria-pressed=\"revealed\"\n              tabindex=\"-1\"\n              @click=\"revealed = !revealed\"\n            >\n              <wx-icon :name=\"revealed ? 'eye-off' : 'eye'\" />\n            </button>\n          </template>\n        </wx-input>\n      </wx-form-item>\n\n      <wx-checkbox v-if=\"remember\" v-model=\"rememberMe\" :label=\"labels.remember\" />\n\n      <wx-button\n        type=\"primary\"\n        native-type=\"submit\"\n        size=\"lg\"\n        block\n        :loading=\"busy\"\n        :disabled=\"throttled\"\n      >\n        {{ labels.submit }}\n      </wx-button>\n    </wx-form>\n  </wx-card>\n</template>\n\n<style scoped>\n.wx-login {\n  width: 100%;\n  /* Wide enough for an email address, narrow enough to stay a card rather than a page. */\n  max-width: 26rem;\n}\n\n.wx-login__message {\n  margin-block-end: var(--wx-space-4);\n}\n\n.wx-login__reveal {\n  display: inline-flex;\n  align-items: center;\n  padding: 0;\n  color: var(--wx-text-muted);\n  background: none;\n  border: 0;\n  cursor: pointer;\n}\n\n.wx-login__reveal:hover,\n.wx-login__reveal[aria-pressed='true'] {\n  color: var(--wx-text-default);\n}\n</style>\n","import type { Messages } from '@webx-ui/admin'\n\n/**\n * What this package says, in English.\n *\n * The same keys `webx-ui/module-auth` ships as `lang/en/*.php`. Kept here so a card placed by\n * hand, with no WebX UI server behind it, still has words — and so a key never reaches the\n * screen when a translation is missing.\n */\nexport const authMessages: Record<string, Messages> = {\n  card: {\n    email: 'Email',\n    password: 'Password',\n    remember: 'Stay signed in',\n    submit: 'Sign in',\n    'caps-lock': 'Caps Lock is on.',\n    reveal: 'Show the password',\n    hide: 'Hide the password',\n    throttled: 'Too many attempts. Try again in :seconds s.',\n    failed: 'Those details do not match an account.',\n  },\n  menu: {\n    'sign-out': 'Sign out',\n    language: 'Interface language',\n  },\n}\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { useAdmin, useI18n, useTranslate } from '@webx-ui/admin'\nimport { useAuth } from './session'\n\n/**\n * The corner of the header: who this is, which language they read the panel in, and the way\n * out.\n *\n * The language picker lives here rather than in a settings screen because it is a property of\n * the person, not of the site — and because somebody who has landed in a language they cannot\n * read needs it within reach, not three clicks into a section they cannot navigate.\n */\nwithDefaults(defineProps<{ signOutLabel?: string }>(), { signOutLabel: undefined })\n\nconst admin = useAdmin()\nconst auth = useAuth()\nconst i18n = useI18n()\nconst t = useTranslate('webx-auth')\n\nconst user = computed(() => admin.state.user)\n\n// One language is not a choice, and a menu that offers it is noise.\nconst languages = computed(() =>\n  i18n.state.panelLocales.length > 1 ? i18n.state.panelLocales : [],\n)\n\nconst initials = computed(() => {\n  const name = user.value?.name ?? ''\n\n  return name\n    .split(/\\s+/)\n    .filter((part) => part !== '')\n    .slice(0, 2)\n    .map((part) => part[0]?.toUpperCase() ?? '')\n    .join('')\n})\n\nasync function choose(code: string): Promise<void> {\n  if (code === i18n.state.locale) {\n    return\n  }\n\n  await auth.setLocale(code)\n}\n</script>\n\n<template>\n  <wx-dropdown v-if=\"user !== null\">\n    <template #trigger>\n      <wx-action :title=\"user.name\">\n        <wx-avatar :label=\"initials\" size=\"sm\" />\n      </wx-action>\n    </template>\n\n    <wx-dropdown-item disabled>\n      <wx-text size=\"sm\">{{ user.email }}</wx-text>\n    </wx-dropdown-item>\n\n    <template v-if=\"languages.length > 0\">\n      <wx-divider :spacing=\"4\" />\n\n      <wx-dropdown-item disabled>\n        <wx-text size=\"sm\" tone=\"muted\">{{ t('menu.language') }}</wx-text>\n      </wx-dropdown-item>\n\n      <wx-dropdown-item\n        v-for=\"language in languages\"\n        :key=\"language.code\"\n        :icon=\"language.code === i18n.state.locale ? 'check' : undefined\"\n        @click=\"choose(language.code)\"\n      >\n        {{ language.nativeName }}\n      </wx-dropdown-item>\n\n      <wx-divider :spacing=\"4\" />\n    </template>\n\n    <wx-dropdown-item icon=\"logout\" @click=\"auth.logout()\">\n      {{ signOutLabel ?? t('menu.sign-out') }}\n    </wx-dropdown-item>\n  </wx-dropdown>\n</template>\n","import { h, watch } from 'vue'\nimport type { Admin, AdminPlugin } from '@webx-ui/admin'\nimport LoginCard from './LoginCard.vue'\nimport { authMessages } from './messages'\nimport { createAuthSession, provideAuth } from './session'\n\nexport interface AuthOptions {\n  /** Where the sign-in screen lives, inside the panel. */\n  path?: string\n  /** Props handed to the card — the labels, mostly. */\n  card?: Record<string, unknown>\n}\n\n/**\n * Signing in, as a plugin rather than a section: it owns a route and a guard, and it has no\n * place in the menu.\n *\n * Installing it also tells the panel how to find out who is signed in, which is why the panel\n * itself knows nothing about authentication — it holds the answer, not the question.\n */\nexport function auth(options: AuthOptions = {}): AdminPlugin {\n  const path = options.path ?? '/login'\n\n  return {\n    install(admin: Admin) {\n      const session = createAuthSession(admin.context)\n\n      // The floor under this module's labels: what the server has not translated, and what\n      // a panel assembled without a server has to fall back on.\n      admin.i18n.defaults('webx-auth', authMessages)\n\n      provideAuth(admin.app, session)\n      admin.context.useSessionLoader(() => session.me())\n\n      admin.router.addRoute({\n        path,\n        name: 'webx.login',\n        meta: { public: true },\n        component: { render: () => h(LoginCard, { ...options.card }) },\n      })\n\n      admin.router.beforeEach((to) => {\n        if (to.meta.public === true) {\n          return true\n        }\n\n        if (admin.context.state.status !== 'unauthenticated') {\n          return true\n        }\n\n        return { path, query: to.fullPath === '/' ? {} : { next: to.fullPath } }\n      })\n\n      // Both directions are driven by the state rather than by an event, because the card\n      // cannot be relied on to announce its own success: signing in flips the panel to\n      // `ready`, the shell swaps the branch it renders, and the card is unmounted before the\n      // line after `await` runs.\n      watch(\n        () => admin.context.state.status,\n        (status) => {\n          const current = admin.router.currentRoute.value\n\n          // A session can also end between requests — a sign-out in another tab, an account\n          // switched off. The panel learns that from a 401 on whatever it asked for next,\n          // which is not a navigation, so nothing would move without this.\n          if (status === 'unauthenticated' && current.path !== path) {\n            void admin.router.replace({ path, query: { next: current.fullPath } })\n\n            return\n          }\n\n          if (status === 'ready' && current.path === path) {\n            const next = current.query.next\n\n            void admin.router.replace(typeof next === 'string' ? next : '/')\n          }\n        },\n      )\n    },\n  }\n}\n\nexport { createAuthSession, provideAuth, useAuth, authKey } from './session'\nexport type { AuthSession, Credentials } from './session'\nexport { default as WxLoginCard } from './LoginCard.vue'\nexport { default as WxUserMenu } from './UserMenu.vue'\nexport { authMessages } from './messages'\n"],"names":["authKey","useAuth","session","inject","createAuthSession","admin","base","error","isUnauthenticated","credentials","body","code","provideAuth","app","props","__props","emit","__emit","auth","t","useTranslate","labels","computed","email","ref","password","rememberMe","busy","revealed","capsLock","message","errors","secondsLeft","emailField","useTemplateRef","countdown","onBeforeUnmount","stopCountdown","throttled","throttleNotice","submit","handle","HttpError","startCountdown","seconds","trackCapsLock","event","__expose","_createBlock","_component_wx_card","_createVNode","_component_wx_form","_component_wx_alert","_component_wx_form_item","_component_wx_input","$event","_component_wx_icon","_createElementVNode","_cache","_component_wx_checkbox","_component_wx_button","_createTextVNode","_toDisplayString","authMessages","useAdmin","i18n","useI18n","user","languages","initials","part","choose","_component_wx_dropdown","_component_wx_action","_component_wx_avatar","_component_wx_dropdown_item","_component_wx_text","_createElementBlock","_Fragment","_component_wx_divider","_unref","_renderList","language","options","path","h","LoginCard","to","watch","status","current","next"],"mappings":"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"}

package/dist/messages.d.ts

@@ -0,0 +1,9 @@
+import { Messages } from '@webx-ui/admin';
+/**
+ * What this package says, in English.
+ *
+ * The same keys `webx-ui/module-auth` ships as `lang/en/*.php`. Kept here so a card placed by
+ * hand, with no WebX UI server behind it, still has words — and so a key never reaches the
+ * screen when a translation is missing.
+ */
+export declare const authMessages: Record<string, Messages>;

package/dist/session.d.ts

@@ -11,6 +11,14 @@ export interface AuthSession {
     /** Signs in and tells the panel to load itself. Throws `HttpError` on a refusal. */
     login(credentials: Credentials): Promise<AdminUser>;
     logout(): Promise<void>;
+    /**
+     * Change the language this administrator reads the panel in.
+     *
+     * Stored on the person rather than in this browser, so it follows them to the next machine
+     * and so the server writes its own messages — a 422 under a field — in the same language as
+     * the label above it.
+     */
+    setLocale(code: string): Promise<void>;
 }
 export declare const authKey: InjectionKey<AuthSession>;
 export declare function useAuth(): AuthSession;

package/dist/style.css

@@ -1 +1 @@
-.wx-login[data-v-41458fe2]{width:100%;max-width:26rem}.wx-login__message[data-v-41458fe2]{margin-block-end:var(--wx-space-4)}.wx-login__reveal[data-v-41458fe2]{display:inline-flex;align-items:center;padding:0;color:var(--wx-text-muted);background:none;border:0;cursor:pointer}.wx-login__reveal[data-v-41458fe2]:hover,.wx-login__reveal[aria-pressed=true][data-v-41458fe2]{color:var(--wx-text-default)}
+.wx-login[data-v-1224c1f8]{width:100%;max-width:26rem}.wx-login__message[data-v-1224c1f8]{margin-block-end:var(--wx-space-4)}.wx-login__reveal[data-v-1224c1f8]{display:inline-flex;align-items:center;padding:0;color:var(--wx-text-muted);background:none;border:0;cursor:pointer}.wx-login__reveal[data-v-1224c1f8]:hover,.wx-login__reveal[aria-pressed=true][data-v-1224c1f8]{color:var(--wx-text-default)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webx-ui/module-auth",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Signing in to a WebX UI admin panel: the screen, the session and the router guard. Pairs with webx-ui/module-auth on the server.",
   "license": "MIT",
   "type": "module",
@@ -44,7 +44,7 @@
     "vue-router": "^4.5.0"
   },
   "dependencies": {
-    "@webx-ui/admin": "^0.1.0",
+    "@webx-ui/admin": "^0.2.0",
     "@webx-ui/core": "^0.14.2"
   },
   "devDependencies": {