@adonis-agora/authkit-react 0.15.0 → 0.17.0

package/build/src/hooks/use_passkey_registration.d.ts

@@ -0,0 +1,12 @@
+export interface UsePasskeyRegistrationOptions {
+    optionsUrl: string;
+    actionUrl: string;
+    csrfToken?: string;
+    returnTo?: string | null;
+}
+export interface UsePasskeyRegistrationResult {
+    run: () => Promise<void>;
+    running: boolean;
+    error: Error | null;
+}
+export declare function usePasskeyRegistration(options: UsePasskeyRegistrationOptions): UsePasskeyRegistrationResult;

package/build/src/hooks/use_passkey_registration.js

@@ -0,0 +1,19 @@
+import { useCallback, useState } from 'react';
+import { runPasskeyRegistration } from '../passkey/sudo.js';
+export function usePasskeyRegistration(options) {
+    const { optionsUrl, actionUrl, csrfToken, returnTo } = options;
+    const [running, setRunning] = useState(false);
+    const [error, setError] = useState(null);
+    const run = useCallback(async () => {
+        setError(null);
+        setRunning(true);
+        try {
+            await runPasskeyRegistration({ optionsUrl, actionUrl, csrfToken, returnTo });
+        }
+        catch (err) {
+            setError(err instanceof Error ? err : new Error(String(err)));
+            setRunning(false);
+        }
+    }, [optionsUrl, actionUrl, csrfToken, returnTo]);
+    return { run, running, error };
+}

package/build/src/hooks/use_profile.d.ts

@@ -1,5 +1,5 @@
-import { type ResourceState } from './use_resource.js';
 import type { AuthUser } from '../types.js';
+import { type ResourceState } from './use_resource.js';
 export interface ProfileUpdate {
     name?: string;
     avatarUrl?: string;

package/build/src/hooks/use_profile.js

@@ -18,7 +18,11 @@ export function useProfile() {
                 body: JSON.stringify(data),
                 csrfToken: config.csrfToken,
             });
-            setState({ data: updated ?? { ...user, ...data }, loading: false, error: null });
+            setState({
+                data: updated ?? { ...user, ...data },
+                loading: false,
+                error: null,
+            });
         }
         catch (err) {
             setState((s) => ({ ...s, loading: false, error: err }));

package/build/src/hooks/use_resource.js

@@ -4,7 +4,7 @@ export async function jsonRequest(url, init = {}) {
     const res = await fetch(url, {
         credentials: 'same-origin',
         headers: {
-            'Accept': 'application/json',
+            Accept: 'application/json',
             ...(rest.body ? { 'Content-Type': 'application/json' } : {}),
             ...(csrfToken ? { 'X-CSRF-TOKEN': csrfToken } : {}),
             ...headers,

package/build/src/hooks/use_sign_in.js

@@ -1,5 +1,5 @@
 import { useCallback } from 'react';
-import { useAuthkitConfig, buildAuthUrl } from '../config.js';
+import { buildAuthUrl, useAuthkitConfig } from '../config.js';
 import { currentUrl } from '../utils.js';
 export function useSignIn() {
     const config = useAuthkitConfig();

package/build/src/hooks/use_sign_out.js

@@ -1,5 +1,5 @@
 import { useCallback } from 'react';
-import { useAuthkitConfig, buildAuthUrl } from '../config.js';
+import { buildAuthUrl, useAuthkitConfig } from '../config.js';
 export function useSignOut() {
     const config = useAuthkitConfig();
     const signOut = useCallback((opts) => {

package/build/src/interaction/urls.d.ts

@@ -0,0 +1,12 @@
+export interface InteractionUrls {
+    identifier: string;
+    login: string;
+    magic: string;
+    signup: string;
+    switch: string;
+    passkeyOptions: string;
+    passkeyVerify: string;
+}
+export declare function interactionUrls(uid: string, basePath?: string): InteractionUrls;
+export type InteractionPostStep = 'identifier' | 'login' | 'magic';
+export declare function oauthRedirectUrl(provider: string, uid: string, basePath?: string): string;

package/build/src/interaction/urls.js

@@ -0,0 +1,15 @@
+export function interactionUrls(uid, basePath = '/auth/interaction') {
+    const base = `${basePath}/${uid}`;
+    return {
+        identifier: `${base}/identifier`,
+        login: `${base}/login`,
+        magic: `${base}/magic`,
+        signup: `${base}/signup`,
+        switch: `${base}/switch`,
+        passkeyOptions: `${base}/passkey/options`,
+        passkeyVerify: `${base}/passkey/verify`,
+    };
+}
+export function oauthRedirectUrl(provider, uid, basePath = '/auth') {
+    return `${basePath}/${provider}/redirect/${uid}`;
+}

package/build/src/passkey/authenticate.d.ts

@@ -3,7 +3,15 @@ export type StartAuthenticationFn = (opts: {
     useBrowserAutofill?: boolean;
     verifyBrowserAutofillInput?: boolean;
 }, signal?: AbortSignal) => Promise<unknown>;
-export declare function loadStartAuthentication(): Promise<StartAuthenticationFn>;
+export type StartRegistrationFn = (opts: {
+    optionsJSON: unknown;
+}) => Promise<unknown>;
+declare function importWebAuthnBrowser(): Promise<{
+    startAuthentication: StartAuthenticationFn;
+    startRegistration: StartRegistrationFn;
+}>;
+export declare function loadStartAuthentication(importModule?: typeof importWebAuthnBrowser): Promise<StartAuthenticationFn>;
+export declare function loadStartRegistration(importModule?: typeof importWebAuthnBrowser): Promise<StartRegistrationFn>;
 export interface AuthenticatePasskeyOptions {
     optionsUrl: string;
     csrfToken?: string;
@@ -14,9 +22,20 @@ export interface PasskeyCeremonyDeps {
     loadStartAuthentication?: () => Promise<StartAuthenticationFn>;
 }
 export declare function authenticatePasskey(options: AuthenticatePasskeyOptions, deps?: PasskeyCeremonyDeps): Promise<string>;
+export interface RegisterPasskeyOptions {
+    optionsUrl: string;
+    csrfToken?: string;
+    signal?: AbortSignal;
+}
+export interface PasskeyRegistrationDeps {
+    fetch?: typeof globalThis.fetch;
+    loadStartRegistration?: () => Promise<StartRegistrationFn>;
+}
+export declare function registerPasskey(options: RegisterPasskeyOptions, deps?: PasskeyRegistrationDeps): Promise<string>;
 export interface SubmitPasskeyVerificationOptions {
     verifyUrl: string;
     assertion: string;
     csrfToken?: string;
 }
 export declare function submitPasskeyVerification(options: SubmitPasskeyVerificationOptions): void;
+export {};

package/build/src/passkey/authenticate.js

@@ -6,28 +6,46 @@ var __rewriteRelativeImportExtension = (this && this.__rewriteRelativeImportExte
     }
     return path;
 };
-const CDN_URL = "https://cdn.jsdelivr.net/npm/@simplewebauthn/browser@13/dist/bundle/index.js";
-export async function loadStartAuthentication() {
+import { submitClassicForm } from './classic_form.js';
+async function importWebAuthnBrowser() {
+    return await import(__rewriteRelativeImportExtension('@simplewebauthn/browser'));
+}
+function missingPeerError(cause) {
+    return new Error('@adonis-agora/authkit-react: a passkey requer o pacote ' +
+        '`@simplewebauthn/browser`, que não foi encontrado. Instale-o no seu app ' +
+        '(`npm i @simplewebauthn/browser@^13`) — ele é uma peer dependency ' +
+        'opcional, e não uma dependência direta, porque quem faz o bundle do ' +
+        'frontend é o seu app: embutir uma segunda cópia da lib duplicaria o ' +
+        'código e brigaria com a versão que você já usa. Este pacote também não ' +
+        'cai num CDN público: isso colocaria um terceiro dentro do caminho de ' +
+        'autenticação, em silêncio.', { cause });
+}
+export async function loadStartAuthentication(importModule = importWebAuthnBrowser) {
     try {
-        const mod = await import(__rewriteRelativeImportExtension("@simplewebauthn/browser"));
+        const mod = await importModule();
         return mod.startAuthentication;
     }
-    catch {
-        const mod = await import(__rewriteRelativeImportExtension(CDN_URL));
-        return mod.startAuthentication;
+    catch (cause) {
+        throw missingPeerError(cause);
     }
 }
-export async function authenticatePasskey(options, deps = {}) {
-    const { optionsUrl, csrfToken, signal } = options;
-    const doFetch = deps.fetch ?? globalThis.fetch;
-    const loadFn = deps.loadStartAuthentication ?? loadStartAuthentication;
+export async function loadStartRegistration(importModule = importWebAuthnBrowser) {
+    try {
+        const mod = await importModule();
+        return mod.startRegistration;
+    }
+    catch (cause) {
+        throw missingPeerError(cause);
+    }
+}
+async function fetchCeremonyOptions(optionsUrl, csrfToken, doFetch, signal) {
     const headers = {
-        "content-type": "application/json",
+        'content-type': 'application/json',
     };
     if (csrfToken)
-        headers["x-csrf-token"] = csrfToken;
+        headers['x-csrf-token'] = csrfToken;
     const res = await doFetch(optionsUrl, {
-        method: "POST",
+        method: 'POST',
         headers,
         body: JSON.stringify({}),
         signal,
@@ -35,29 +53,31 @@ export async function authenticatePasskey(options, deps = {}) {
     if (!res.ok) {
         throw new Error(`passkey options request failed: ${res.status}`);
     }
-    const optionsJSON = await res.json();
+    return res.json();
+}
+export async function authenticatePasskey(options, deps = {}) {
+    const { optionsUrl, csrfToken, signal } = options;
+    const doFetch = deps.fetch ?? globalThis.fetch;
+    const loadFn = deps.loadStartAuthentication ?? loadStartAuthentication;
+    const optionsJSON = await fetchCeremonyOptions(optionsUrl, csrfToken, doFetch, signal);
     const startAuthentication = await loadFn();
     const assertion = await startAuthentication({ optionsJSON }, signal);
     return JSON.stringify(assertion);
 }
+export async function registerPasskey(options, deps = {}) {
+    const { optionsUrl, csrfToken, signal } = options;
+    const doFetch = deps.fetch ?? globalThis.fetch;
+    const loadFn = deps.loadStartRegistration ?? loadStartRegistration;
+    const optionsJSON = await fetchCeremonyOptions(optionsUrl, csrfToken, doFetch, signal);
+    const startRegistration = await loadFn();
+    const attestation = await startRegistration({ optionsJSON });
+    return JSON.stringify(attestation);
+}
 export function submitPasskeyVerification(options) {
     const { verifyUrl, assertion, csrfToken } = options;
-    if (typeof document === "undefined")
-        return;
-    const form = document.createElement("form");
-    form.method = "POST";
-    form.action = verifyUrl;
-    form.hidden = true;
+    const fields = {};
     if (csrfToken)
-        form.appendChild(hiddenInput("_csrf", csrfToken));
-    form.appendChild(hiddenInput("response", assertion));
-    document.body.appendChild(form);
-    form.submit();
-}
-function hiddenInput(name, value) {
-    const input = document.createElement("input");
-    input.type = "hidden";
-    input.name = name;
-    input.value = value;
-    return input;
+        fields._csrf = csrfToken;
+    fields.response = assertion;
+    submitClassicForm({ action: verifyUrl, fields });
 }

package/build/src/passkey/classic_form.d.ts

@@ -0,0 +1,9 @@
+export interface SubmitClassicFormOptions {
+    action: string;
+    fields: Record<string, string>;
+    method?: string;
+}
+export interface SubmitClassicFormDeps {
+    document?: Document;
+}
+export declare function submitClassicForm(options: SubmitClassicFormOptions, deps?: SubmitClassicFormDeps): void;

package/build/src/passkey/classic_form.js

@@ -0,0 +1,18 @@
+export function submitClassicForm(options, deps = {}) {
+    const doc = deps.document ?? (typeof document !== 'undefined' ? document : undefined);
+    if (!doc)
+        return;
+    const form = doc.createElement('form');
+    form.method = options.method ?? 'POST';
+    form.action = options.action;
+    form.hidden = true;
+    for (const [name, value] of Object.entries(options.fields)) {
+        const input = doc.createElement('input');
+        input.type = 'hidden';
+        input.name = name;
+        input.value = value;
+        form.appendChild(input);
+    }
+    doc.body.appendChild(form);
+    form.submit();
+}

package/build/src/passkey/sudo.d.ts

@@ -0,0 +1,12 @@
+import { type PasskeyCeremonyDeps, type PasskeyRegistrationDeps } from './authenticate.js';
+import { type SubmitClassicFormDeps } from './classic_form.js';
+export interface RunPasskeyFlowOptions {
+    optionsUrl: string;
+    actionUrl: string;
+    csrfToken?: string;
+    returnTo?: string | null;
+}
+export type RunPasskeyAssertionDeps = PasskeyCeremonyDeps & SubmitClassicFormDeps;
+export type RunPasskeyRegistrationDeps = PasskeyRegistrationDeps & SubmitClassicFormDeps;
+export declare function runPasskeyAssertion(options: RunPasskeyFlowOptions, deps?: RunPasskeyAssertionDeps): Promise<void>;
+export declare function runPasskeyRegistration(options: RunPasskeyFlowOptions, deps?: RunPasskeyRegistrationDeps): Promise<void>;

package/build/src/passkey/sudo.js

@@ -0,0 +1,20 @@
+import { authenticatePasskey, registerPasskey, } from './authenticate.js';
+import { submitClassicForm } from './classic_form.js';
+function flowFields(response, csrfToken, returnTo) {
+    const fields = { response };
+    if (csrfToken)
+        fields._csrf = csrfToken;
+    if (returnTo)
+        fields.return_to = returnTo;
+    return fields;
+}
+export async function runPasskeyAssertion(options, deps = {}) {
+    const { optionsUrl, actionUrl, csrfToken, returnTo } = options;
+    const assertion = await authenticatePasskey({ optionsUrl, csrfToken }, { fetch: deps.fetch, loadStartAuthentication: deps.loadStartAuthentication });
+    submitClassicForm({ action: actionUrl, fields: flowFields(assertion, csrfToken, returnTo) }, { document: deps.document });
+}
+export async function runPasskeyRegistration(options, deps = {}) {
+    const { optionsUrl, actionUrl, csrfToken, returnTo } = options;
+    const attestation = await registerPasskey({ optionsUrl, csrfToken }, { fetch: deps.fetch, loadStartRegistration: deps.loadStartRegistration });
+    submitClassicForm({ action: actionUrl, fields: flowFields(attestation, csrfToken, returnTo) }, { document: deps.document });
+}

package/build/src/queries/account/index.d.ts

@@ -1,4 +1,4 @@
-import type { AccountMe, AccountSecurityOverview, UpdateProfileInput, UpdateProfileResult, ChangePasswordInput, RequestEmailChangeInput, OkResult, EmailChangeResult, AccountSessionsResult, RevokeSessionResult, RevokeOthersResult, RevokeAllResult, AccountAppsResult, RevokeAppResult, AccountMfaStatus, AccountPasskeysResult, RemovePasskeyResult, AccountTokensResult, CreatedPatResult, RevokeTokenResult, CreateTokenInput, AccountOrgsResult, AccountOrgDetail, AccountOrgInvitationsResult } from '../../client/types.js';
+import type { AccountAppsResult, AccountMe, AccountMfaStatus, AccountOrgDetail, AccountOrgInvitationsResult, AccountOrgsResult, AccountPasskeysResult, AccountSecurityOverview, AccountSessionsResult, AccountTokensResult, ChangePasswordInput, CreateTokenInput, CreatedPatResult, EmailChangeResult, OkResult, RemovePasskeyResult, RequestEmailChangeInput, RevokeAllResult, RevokeAppResult, RevokeOthersResult, RevokeSessionResult, RevokeTokenResult, UpdateProfileInput, UpdateProfileResult } from '../../client/types.js';
 export declare function useMeQueryOptions(): {
     queryKey: readonly ["authkit", "account", "me"];
     queryFn: () => Promise<AccountMe>;

package/build/src/queries/admin/index.d.ts

@@ -1,4 +1,4 @@
-import type { AdminOverview, AdminUser, AdminUserListResult, CreateUserInput, UpdateUserInput, UserSessionsResult, RevokeSessionsResult, AdminClientListResult, AdminClient, CreatedClientResult, RegenerateSecretResult, CreateClientInput, UpdateClientInput, RoleListResult, RoleCatalogEntry, CreateRoleInput, UpdateRoleInput, AdminOrgListResult, AdminOrgDetail, AdminOrgInvitation, AuditListResult, AuditListParams, SettingListResult, SettingEntry, ImpersonationPanel, AdminOrgEntry, CreateOrgInput, UpdateOrgInput, KeysStatus, KeysRotateInput, KeysRotateResult } from '../../client/types.js';
+import type { AdminClient, AdminClientListResult, AdminOrgDetail, AdminOrgEntry, AdminOrgInvitation, AdminOrgListResult, AdminOverview, AdminUser, AdminUserListResult, AuditListParams, AuditListResult, CreateClientInput, CreateOrgInput, CreateRoleInput, CreateUserInput, CreatedClientResult, ImpersonationPanel, KeysRotateInput, KeysRotateResult, KeysStatus, RegenerateSecretResult, RevokeSessionsResult, RoleCatalogEntry, RoleListResult, SettingEntry, SettingListResult, UpdateClientInput, UpdateOrgInput, UpdateRoleInput, UpdateUserInput, UserSessionsResult } from '../../client/types.js';
 export declare function useOverviewQueryOptions(): {
     queryKey: readonly ["authkit", "admin", "overview"];
     queryFn: () => Promise<AdminOverview>;

package/build/src/use_auth.js

@@ -1,5 +1,5 @@
-import { useContext, useMemo } from 'react';
 import { usePage } from '@inertiajs/react';
+import { useContext, useMemo } from 'react';
 import { AuthContext } from './provider.js';
 import { hasAllGlobalRoles as hasAllGlobalRolesPure, hasAnyGlobalRole as hasAnyGlobalRolePure, hasGlobalRole as hasGlobalRolePure, } from './roles.js';
 const UNAUTHENTICATED = {

package/build/src/utils.d.ts

@@ -1,2 +1,3 @@
 export declare function deriveInitials(name?: string | null, email?: string | null): string;
 export declare function currentUrl(): string;
+export declare function buttonClass(variant?: string | null, extra?: string | null): string;

package/build/src/utils.js

@@ -16,3 +16,6 @@ export function currentUrl() {
         return '';
     return window.location.pathname + window.location.search;
 }
+export function buttonClass(variant, extra) {
+    return ['authkit-button', variant, extra].filter(Boolean).join(' ');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adonis-agora/authkit-react",
-  "version": "0.15.0",
+  "version": "0.17.0",
   "description": "Frontend ergonomics over AuthKit for AdonisJS + Inertia + React apps: a typed useAuth() hook, role-gating hooks and gating components.",
   "license": "MIT",
   "author": "dudousxd",
@@ -39,10 +39,16 @@
   },
   "peerDependencies": {
     "@inertiajs/react": "^3.3.0",
+    "@simplewebauthn/browser": "^13.3.0",
     "@tanstack/react-query": "^5.100.14",
     "react": "^19.2.6",
     "react-dom": "^19.2.6"
   },
+  "peerDependenciesMeta": {
+    "@simplewebauthn/browser": {
+      "optional": true
+    }
+  },
   "dependencies": {
     "@adonis-agora/authkit-core": "0.7.0"
   },