@webx-ui/module-auth 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 webx-ui
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,84 @@
+# @webx-ui/module-auth
+
+Signing in to a WebX UI admin panel: the screen, the session and the router guard.
+
+The front-end half of the Composer package
+[`webx-ui/module-auth`](https://packagist.org/packages/webx-ui/module-auth), which is what
+closes the panel on the server. This is what lets somebody back in.
+
+## Install
+
+```bash
+pnpm add @webx-ui/module-auth @webx-ui/admin @webx-ui/core vue vue-router
+```
+
+```ts
+import { createAdmin } from '@webx-ui/admin'
+import { auth, WxUserMenu } from '@webx-ui/module-auth'
+
+createAdmin({
+  plugins: [auth()],
+  userMenu: WxUserMenu,
+}).mount()
+```
+
+That is the whole integration. Installing it also tells the panel how to find out who is signed
+in, which is why `@webx-ui/admin` knows nothing about authentication — it holds the answer, not
+the question.
+
+## A plugin, not a section
+
+It owns a route and a guard and has no place in the menu:
+
+- `/login` renders the card
+- a guard sends anybody without a session there, remembering where they were going
+- a watcher brings them back when the session arrives, and out again when it ends — a sign-out
+  in another tab, an account switched off
+
+Redirects are driven by the panel's state rather than by an event from the card. Signing in
+flips the panel to `ready`, the shell swaps the branch it renders, and the card is unmounted
+before the line after `await` runs.
+
+## The card
+
+No logo, no product name, no welcome. An admin panel's front door should say as little as
+possible to somebody who has no business behind it, and the people who do already know where
+they are.
+
+What it does carry: a password reveal, a Caps Lock warning, `autocomplete="username"` and
+`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.
+
+```ts
+auth({
+  card: {
+    emailLabel: 'Електронна пошта',
+    passwordLabel: 'Пароль',
+    submitLabel: 'Увійти',
+    rememberLabel: 'Запам’ятати мене',
+  },
+})
+```
+
+`WxLoginCard` is exported for a panel that wants to place it itself.
+
+## The session
+
+```ts
+import { useAuth } from '@webx-ui/module-auth'
+
+const auth = useAuth()
+
+await auth.login({ email, password, remember: true })
+await auth.logout()
+const user = await auth.me() // null when nobody is
+```
+
+There is nothing kept here: the session lives in a cookie, the server is the source of truth,
+and the panel asks rather than remembers.
+
+## Licence
+
+MIT.

package/dist/LoginCard.d.ts

@@ -0,0 +1,40 @@
+/**
+ * The card a panel opens on.
+ *
+ * No logo, no product name, no "welcome back" — an admin panel's front door should say as
+ * 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.
+ */
+type __VLS_Props = {
+    emailLabel?: string;
+    passwordLabel?: string;
+    rememberLabel?: string;
+    submitLabel?: string;
+    capsLockWarning?: string;
+    throttleMessage?: 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. */
+    autofocus?: boolean;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {
+    focus: () => void | undefined;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    success: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSuccess?: (() => any) | undefined;
+}>, {
+    emailLabel: string;
+    passwordLabel: string;
+    rememberLabel: string;
+    submitLabel: string;
+    capsLockWarning: string;
+    throttleMessage: string;
+    remember: boolean;
+    autofocus: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    emailField: unknown;
+}, any>;
+export default _default;

package/dist/UserMenu.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The corner of the header: who this is, and the way out.
+ */
+type __VLS_Props = {
+    signOutLabel?: string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    signOutLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/index.d.ts

@@ -0,0 +1,19 @@
+import { AdminPlugin } from '@webx-ui/admin';
+export interface AuthOptions {
+    /** Where the sign-in screen lives, inside the panel. */
+    path?: string;
+    /** Props handed to the card — the labels, mostly. */
+    card?: Record<string, unknown>;
+}
+/**
+ * Signing in, as a plugin rather than a section: it owns a route and a guard, and it has no
+ * place in the menu.
+ *
+ * Installing it also tells the panel how to find out who is signed in, which is why the panel
+ * itself knows nothing about authentication — it holds the answer, not the question.
+ */
+export declare function auth(options?: AuthOptions): AdminPlugin;
+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';

package/dist/index.js

@@ -0,0 +1,309 @@
+import { inject as J, defineComponent as N, ref as c, useTemplateRef as Q, onBeforeUnmount as X, computed as k, resolveComponent as l, openBlock as g, createBlock as h, withCtx as u, createVNode as s, withModifiers as Y, createCommentVNode as U, createTextVNode as M, toDisplayString as $, 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 = J(W, 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`;
+  return {
+    async me() {
+      try {
+        return (await e.http.get(`${a}/me`)).data;
+      } catch (t) {
+        if (se(t))
+          return null;
+        throw t;
+      }
+    },
+    async login(t) {
+      const n = await e.http.post(`${a}/login`, {
+        email: t.email,
+        password: t.password,
+        remember: t.remember ?? !1
+      });
+      return e.setUser(n.data), await e.reload(), n.data;
+    },
+    async logout() {
+      try {
+        await e.http.post(`${a}/logout`);
+      } finally {
+        e.setUser(null), e.state.status = "unauthenticated", e.state.manifest = null;
+      }
+    }
+  };
+}
+function le(e, a) {
+  e.provide(W, a);
+}
+function se(e) {
+  return typeof e == "object" && e !== null && "status" in e && e.status === 401;
+}
+const ue = /* @__PURE__ */ N({
+  __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." },
+    remember: { type: Boolean, default: !0 },
+    autofocus: { type: Boolean, default: !0 }
+  },
+  emits: ["success"],
+  setup(e, { expose: a, emit: t }) {
+    const n = e, i = t, d = j(), r = c(""), v = c(""), _ = c(!1), f = c(!1), m = c(!1), y = c(!1), w = c(""), C = c({}), x = c(0), A = Q("emailField");
+    let L = null;
+    X(S);
+    const V = k(() => x.value > 0), q = k(
+      () => n.throttleMessage.replace("{seconds}", String(x.value))
+    );
+    async function F() {
+      if (!(f.value || V.value)) {
+        f.value = !0, w.value = "", C.value = {};
+        try {
+          await d.login({
+            email: r.value,
+            password: v.value,
+            remember: _.value
+          }), v.value = "", i("success");
+        } catch (o) {
+          I(o);
+        } finally {
+          f.value = !1;
+        }
+      }
+    }
+    function I(o) {
+      if (!(o instanceof ae)) {
+        w.value = o instanceof Error ? o.message : String(o);
+        return;
+      }
+      if (o.isValidation) {
+        C.value = o.errors;
+        return;
+      }
+      if (o.isThrottled) {
+        K(o.retryAfter ?? 60);
+        return;
+      }
+      w.value = o.message;
+    }
+    function K(o) {
+      S(), x.value = o, L = setInterval(() => {
+        x.value -= 1, x.value <= 0 && S();
+      }, 1e3);
+    }
+    function S() {
+      L !== null && (clearInterval(L), L = null), x.value = 0;
+    }
+    function z(o) {
+      y.value = o.getModifierState("CapsLock");
+    }
+    return a({ focus: () => A.value?.focus() }), (o, p) => {
+      const B = l("wx-alert"), E = l("wx-icon"), P = l("wx-input"), T = l("wx-form-item"), O = l("wx-action"), R = l("wx-checkbox"), H = l("wx-button"), D = l("wx-form"), G = l("wx-card");
+      return g(), h(G, {
+        class: "wx-login",
+        padding: 24
+      }, {
+        default: u(() => [
+          s(D, {
+            errors: C.value,
+            disabled: f.value,
+            gap: "md",
+            onSubmit: Y(F, ["prevent"])
+          }, {
+            default: u(() => [
+              w.value !== "" ? (g(), h(B, {
+                key: 0,
+                type: "danger",
+                variant: "soft",
+                live: "",
+                description: w.value,
+                class: "wx-login__message"
+              }, null, 8, ["description"])) : V.value ? (g(), h(B, {
+                key: 1,
+                type: "warning",
+                variant: "soft",
+                live: "",
+                description: q.value,
+                class: "wx-login__message"
+              }, null, 8, ["description"])) : U("", !0),
+              s(T, { name: "email" }, {
+                default: u(() => [
+                  s(P, {
+                    ref_key: "emailField",
+                    ref: A,
+                    modelValue: r.value,
+                    "onUpdate:modelValue": p[0] || (p[0] = (b) => r.value = b),
+                    type: "email",
+                    placeholder: e.emailLabel,
+                    "aria-label": e.emailLabel,
+                    autocomplete: "username",
+                    autofocus: e.autofocus,
+                    inputmode: "email",
+                    size: "lg"
+                  }, {
+                    prefix: u(() => [
+                      s(E, { name: "mail" })
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "placeholder", "aria-label", "autofocus"])
+                ]),
+                _: 1
+              }),
+              s(T, {
+                name: "password",
+                help: y.value ? e.capsLockWarning : void 0
+              }, {
+                default: u(() => [
+                  s(P, {
+                    modelValue: v.value,
+                    "onUpdate:modelValue": p[2] || (p[2] = (b) => v.value = b),
+                    type: m.value ? "text" : "password",
+                    placeholder: e.passwordLabel,
+                    "aria-label": e.passwordLabel,
+                    autocomplete: "current-password",
+                    size: "lg",
+                    onKeydown: z,
+                    onKeyup: z
+                  }, {
+                    prefix: u(() => [
+                      s(E, { name: "lock" })
+                    ]),
+                    suffix: u(() => [
+                      s(O, {
+                        icon: m.value ? "eye-off" : "eye",
+                        title: m.value ? "Hide the password" : "Show the password",
+                        tabindex: "-1",
+                        onClick: p[1] || (p[1] = (b) => m.value = !m.value)
+                      }, null, 8, ["icon", "title"])
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "type", "placeholder", "aria-label"])
+                ]),
+                _: 1
+              }, 8, ["help"]),
+              e.remember ? (g(), h(R, {
+                key: 2,
+                modelValue: _.value,
+                "onUpdate:modelValue": p[3] || (p[3] = (b) => _.value = b),
+                label: e.rememberLabel
+              }, null, 8, ["modelValue", "label"])) : U("", !0),
+              s(H, {
+                type: "primary",
+                "native-type": "submit",
+                size: "lg",
+                block: "",
+                loading: f.value,
+                disabled: V.value
+              }, {
+                default: u(() => [
+                  M($(e.submitLabel), 1)
+                ]),
+                _: 1
+              }, 8, ["loading", "disabled"])
+            ]),
+            _: 1
+          }, 8, ["errors", "disabled"])
+        ]),
+        _: 1
+      });
+    };
+  }
+}), re = (e, a) => {
+  const t = e.__vccOpts || e;
+  for (const [n, i] of a)
+    t[n] = i;
+  return t;
+}, ie = /* @__PURE__ */ re(ue, [["__scopeId", "data-v-b1f8e87b"]]), me = /* @__PURE__ */ N({
+  __name: "UserMenu",
+  props: {
+    signOutLabel: { default: "Sign out" }
+  },
+  setup(e) {
+    const a = oe(), t = j(), n = k(() => a.state.user), i = k(() => (n.value?.name ?? "").split(/\s+/).filter((r) => r !== "").slice(0, 2).map((r) => r[0]?.toUpperCase() ?? "").join(""));
+    return (d, r) => {
+      const v = l("wx-avatar"), _ = l("wx-action"), f = l("wx-text"), m = l("wx-dropdown-item"), y = l("wx-dropdown");
+      return n.value !== null ? (g(), h(y, { key: 0 }, {
+        trigger: u(() => [
+          s(_, {
+            title: n.value.name
+          }, {
+            default: u(() => [
+              s(v, {
+                label: i.value,
+                size: "sm"
+              }, null, 8, ["label"])
+            ]),
+            _: 1
+          }, 8, ["title"])
+        ]),
+        default: u(() => [
+          s(m, { disabled: "" }, {
+            default: u(() => [
+              s(f, { size: "sm" }, {
+                default: u(() => [
+                  M($(n.value.email), 1)
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }),
+          s(m, {
+            icon: "logout",
+            onClick: r[0] || (r[0] = (w) => Z(t).logout())
+          }, {
+            default: u(() => [
+              M($(e.signOutLabel), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      })) : U("", !0);
+    };
+  }
+});
+function pe(e = {}) {
+  const a = 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,
+        name: "webx.login",
+        meta: { public: !0 },
+        component: { render: () => ee(ie, { ...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(
+        () => t.context.state.status,
+        (i) => {
+          const d = t.router.currentRoute.value;
+          if (i === "unauthenticated" && d.path !== a) {
+            t.router.replace({ path: a, query: { next: d.fullPath } });
+            return;
+          }
+          if (i === "ready" && d.path === a) {
+            const r = d.query.next;
+            t.router.replace(typeof r == "string" ? r : "/");
+          }
+        }
+      );
+    }
+  };
+}
+export {
+  ie as WxLoginCard,
+  me as WxUserMenu,
+  pe as auth,
+  W as authKey,
+  ne as createAuthSession,
+  le as provideAuth,
+  j as useAuth
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +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            <wx-action\n              :icon=\"revealed ? 'eye-off' : 'eye'\"\n              :title=\"revealed ? 'Hide the password' : 'Show the password'\"\n              tabindex=\"-1\"\n              @click=\"revealed = !revealed\"\n            />\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</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","_component_wx_action","_cache","_component_wx_checkbox","_component_wx_button","useAdmin","user","initials","part","_component_wx_dropdown","_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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"}

package/dist/session.d.ts

@@ -0,0 +1,24 @@
+import { App, InjectionKey } from 'vue';
+import { AdminContext, AdminUser } from '@webx-ui/admin';
+export interface Credentials {
+    email: string;
+    password: string;
+    remember?: boolean;
+}
+export interface AuthSession {
+    /** Who is signed in, or null. A 401 is an answer, not a failure. */
+    me(): Promise<AdminUser | null>;
+    /** Signs in and tells the panel to load itself. Throws `HttpError` on a refusal. */
+    login(credentials: Credentials): Promise<AdminUser>;
+    logout(): Promise<void>;
+}
+export declare const authKey: InjectionKey<AuthSession>;
+export declare function useAuth(): AuthSession;
+/**
+ * The three calls `webx-ui/module-auth` answers, and nothing else.
+ *
+ * The session lives in a cookie, so there is nothing to keep here: the source of truth is the
+ * server, and the panel asks it rather than remembering.
+ */
+export declare function createAuthSession(admin: AdminContext): AuthSession;
+export declare function provideAuth(app: App, session: AuthSession): void;

package/dist/style.css

@@ -0,0 +1 @@
+.wx-login[data-v-b1f8e87b]{width:100%;max-width:26rem}.wx-login__message[data-v-b1f8e87b]{margin-block-end:var(--wx-space-4)}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@webx-ui/module-auth",
+  "version": "0.0.1",
+  "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",
+  "sideEffects": [
+    "*.css"
+  ],
+  "keywords": [
+    "webx-ui",
+    "vue",
+    "vue3",
+    "admin",
+    "authentication",
+    "laravel"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/webx-ui/webx-ui.git",
+    "directory": "packages/module-auth"
+  },
+  "homepage": "https://webx-ui.github.io/webx-ui/guide/roadmap.html",
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./style.css": "./dist/style.css",
+    "./dist/style.css": "./dist/style.css",
+    "./package.json": "./package.json"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.0",
+    "vue-router": "^4.5.0"
+  },
+  "dependencies": {
+    "@webx-ui/admin": "^0.0.1",
+    "@webx-ui/core": "^0.14.1"
+  },
+  "devDependencies": {
+    "@types/node": "^24.10.1",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "typescript": "^5.9.3",
+    "vite": "^7.1.14",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.24",
+    "vue-router": "^4.5.1",
+    "vue-tsc": "^3.1.3"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch",
+    "typecheck": "vue-tsc -p tsconfig.json --noEmit"
+  }
+}