@llmnative/react 2.1.0 → 2.2.1

package/dist/types/src/App.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { type AuthGateProps } from "./components/auth/AuthGate";
 import { AppThemeProviderConfig } from "./Theme";
 import { AIConfig, DropboxConfig, ProxyConfig, FirebaseConfig, ScrapeConfig } from "./Config";
 import type { AIProviderAdapter } from "./providers/ai";
@@ -18,6 +19,8 @@ interface MenuItem {
     icon?: string;
     /** A route only, never an entry of a menu, title or not (CR-126): a page reached by a link. */
     hidden?: boolean;
+    /** Open without a session even when `<App authGate>` is set (CR-127): sign up, the links of an email. */
+    public?: boolean;
     children?: MenuItem[];
     page?: React.ComponentType;
     layout?: React.ComponentType;
@@ -107,6 +110,12 @@ export type AppProps = AppProviderProps & {
     }>;
     LayoutDefault?: React.ComponentType;
     menuConfig: MenuConfig;
+    /**
+     * Puts every route behind an `AuthGate` (CR-127): without a session the sign-in shows in place of the
+     * page, layout included, and the address does not change. `true` for the default sign-in, or the props
+     * of the gate (`fallback`, `allow`, `denied`, …). A route with `public: true` stays open.
+     */
+    authGate?: boolean | Omit<AuthGateProps, 'children'>;
 };
 export declare const setStaticMenu: (config: MenuConfig) => void;
 export declare const getStaticMenu: (type: string) => MenuItem[];
@@ -126,7 +135,7 @@ export declare const getContextMenu: () => string[];
  * you need the provider stack without the routing layer (e.g. tests, Storybook).
  */
 export declare function AppProvider({ contextProviders, providers, appName, scrapeConfig, iconProvider, googleMaps, themeProvider, i18n, children, errorReportUrl, debug, basename, }: AppProviderProps): React.JSX.Element;
-declare function App({ importPage, LayoutDefault, menuConfig, children, ...providerProps }: AppProps): React.JSX.Element;
+declare function App({ importPage, LayoutDefault, menuConfig, authGate, children, ...providerProps }: AppProps): React.JSX.Element;
 /**
  * Whether a route of `menuConfig` is a page to navigate to: it has a title, it is not `hidden`, and its path has
  * no parameter (`/invite/:token`) and no wildcard (`*`). The others are routes only, never entries of a menu

package/dist/types/src/I18n.d.ts

@@ -14,6 +14,8 @@ export interface I18nDict {
         next: string;
         notFoundMessage: string;
         goHome: string;
+        /** The button that opens the menu on a small screen (the header of the scaffold). */
+        openNavigation: string;
     };
     auth: {
         signIn: string;
@@ -24,6 +26,97 @@ export interface I18nDict {
         notConfigured: string;
         notImplemented: string;
     };
+    /** CR-127 — the access screens. */
+    access: {
+        email: string;
+        emailPlaceholder: string;
+        password: string;
+        newPassword: string;
+        name: string;
+        showPassword: string;
+        hidePassword: string;
+        or: string;
+        continue: string;
+        backToSignIn: string;
+        emailRequired: string;
+        emailInvalid: string;
+        passwordRequired: string;
+        nameRequired: string;
+        signInTitle: string;
+        signInTitleApp: string;
+        signInDescription: string;
+        signInSubmit: string;
+        forgotPassword: string;
+        noAccount: string;
+        signUpLink: string;
+        continueWith: string;
+        codeRequest: string;
+        usePassword: string;
+        useCode: string;
+        signUpTitle: string;
+        signUpDescription: string;
+        signUpSubmit: string;
+        haveAccount: string;
+        signInLink: string;
+        terms: string;
+        termsRequired: string;
+        passwordRules: string;
+        ruleLength: string;
+        ruleNumber: string;
+        ruleCase: string;
+        ruleSymbol: string;
+        ruleMet: string;
+        ruleNotMet: string;
+        checkEmailTitle: string;
+        checkEmailSignUp: string;
+        checkEmailHint: string;
+        resend: string;
+        resendIn: string;
+        resent: string;
+        useOtherEmail: string;
+        forgotTitle: string;
+        forgotDescription: string;
+        forgotSubmit: string;
+        forgotSent: string;
+        resetTitle: string;
+        resetDescription: string;
+        resetDescriptionFor: string;
+        resetSubmit: string;
+        resetDoneTitle: string;
+        resetDone: string;
+        linkExpiredTitle: string;
+        linkExpired: string;
+        requestNewLink: string;
+        verifyTitle: string;
+        verifyPending: string;
+        verifyPendingNoEmail: string;
+        verifyChecking: string;
+        verifyDoneTitle: string;
+        verifyDone: string;
+        verifiedContinue: string;
+        notVerifiedYet: string;
+        codeTitle: string;
+        codeDescription: string;
+        codeLabel: string;
+        codeDigit: string;
+        codeSubmit: string;
+        codeNotReceived: string;
+        deniedTitle: string;
+        denied: string;
+        signInOther: string;
+        errorGeneric: string;
+        errorCredentials: string;
+        errorEmailInUse: string;
+        errorWeakPassword: string;
+        errorInvalidEmail: string;
+        errorTooManyRequests: string;
+        errorNetwork: string;
+        errorInvalidCode: string;
+        errorExpiredLink: string;
+        errorDisabled: string;
+        errorCancelled: string;
+        errorNotSupported: string;
+    };
     form: {
         headerAdd: string;
         headerEdit: string;

package/dist/types/src/components/auth/AuthGate.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { UserProfile } from '../../providers/auth/AuthProvider';
+export interface AuthGateProps {
+    /** The page, shown only to a signed-in (and allowed) user. */
+    children?: React.ReactNode;
+    /**
+     * What shows instead of the page without a session: your `<SignIn …/>`. Default: a `SignIn` bound to
+     * the auth provider (`useAuthFlows`). The address does not change: once signed in, the page appears.
+     */
+    fallback?: React.ReactNode;
+    /** The auth provider of the app to ask. Default: the default one. */
+    provider?: string;
+    /** While the session of the last visit is restored. Default: a spinner in the middle of the page. */
+    loading?: React.ReactNode;
+    /** Whether a signed-in user may see the pages (a role, an invitation). Default: everyone signed in. */
+    allow?: (user: UserProfile) => boolean | Promise<boolean>;
+    /** For a signed-in user who is not allowed. Default: "No access" with "Sign in with another account". */
+    denied?: React.ReactNode;
+}
+/**
+ * Shows its page only to a signed-in user (CR-127); without a session it shows the sign-in in its place,
+ * without a redirect, so the address stays the one that was opened and the page appears once signed in.
+ * `<App authGate={…}>` puts every route behind one, except those marked `public`.
+ */
+export declare function AuthGate({ children, fallback, provider, loading, allow, denied }: AuthGateProps): React.JSX.Element;
+export default AuthGate;

package/dist/types/src/components/auth/AuthLayout.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+export type AuthLayoutTone = 'neutral' | 'success' | 'warning' | 'danger';
+export interface AuthLayoutProps {
+    /** The heading of the screen (one `h1`). */
+    title: React.ReactNode;
+    /** One or two sentences under the title. */
+    description?: React.ReactNode;
+    /** An icon above the title, for a state (an email sent, a link expired). */
+    icon?: string;
+    /** The color of that icon. Default `neutral`. */
+    tone?: AuthLayoutTone;
+    /** The mark above the card: a `<Brand>`, a logo. */
+    brand?: React.ReactNode;
+    /** Top right of the page: a `ThemeSwitcher`, a `LocaleSwitcher`. */
+    toolbar?: React.ReactNode;
+    /** Under the card: another way in ("Don't have an account? Create one"). */
+    below?: React.ReactNode;
+    /** Bottom of the page: legal links, the copyright. */
+    footer?: React.ReactNode;
+    /**
+     * When it changes, the focus moves to the title, so a screen reader announces the new step
+     * (an email sent, a code to type). Default: the title itself, when it is a string.
+     */
+    focusKey?: string | number;
+    children?: React.ReactNode;
+    className?: string;
+}
+/**
+ * The frame of an access screen (CR-127): the brand, a card in the middle of the page with the title,
+ * the description and the content, then another way in and the footer. In the colors of the theme,
+ * light and dark; on a phone the card becomes the page.
+ */
+export declare function AuthLayout({ title, description, icon, tone, brand, toolbar, below, footer, focusKey, children, className, }: AuthLayoutProps): React.JSX.Element;
+/** The content of a screen in its `AuthLayout`, or alone when `bare`. */
+export declare function AuthFrame({ bare, ...props }: AuthLayoutProps & {
+    bare?: boolean;
+}): React.JSX.Element;
+export default AuthLayout;

package/dist/types/src/components/auth/ForgotPassword.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { type AuthLink, type AuthScreenProps } from './shared';
+export interface ForgotPasswordProps extends AuthScreenProps {
+    /** Sends the link to choose a new password. */
+    onSendReset: (email: string) => Promise<unknown>;
+    /** "Back to sign in". */
+    signInLink?: AuthLink;
+    defaultEmail?: string;
+    /** Seconds before a new link can be asked. Default `30`. */
+    resendSeconds?: number;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+}
+/**
+ * The screen to recover a password (CR-127): the email, then the same answer whether the account
+ * exists or not (it never tells who has an account), a new send after a wait.
+ */
+export declare function ForgotPassword({ onSendReset, signInLink, defaultEmail, resendSeconds, title, description, errorMessage, brand, toolbar, footer, bare, className, }: ForgotPasswordProps): React.JSX.Element;
+export default ForgotPassword;

package/dist/types/src/components/auth/OneTimeCodeInput.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+export interface OneTimeCodeInputProps {
+    /** The code typed so far (digits or letters, without spaces). */
+    value: string;
+    onChange: (value: string) => void;
+    /** Called once every box is filled (typed, pasted or filled by the phone). */
+    onComplete?: (code: string) => void;
+    /** How many characters. Default `6`. */
+    length?: number;
+    /** `numeric` (default) shows the number keyboard on a phone; `alphanumeric` takes letters too. */
+    mode?: 'numeric' | 'alphanumeric';
+    disabled?: boolean;
+    /** The code was refused: the boxes say it. */
+    invalid?: boolean;
+    autoFocus?: boolean;
+    /** The name of the group for a screen reader. Default: "Sign-in code". */
+    label?: string;
+    /** The id of the text that describes the code (where it was sent), or of its error. */
+    describedBy?: string;
+    className?: string;
+}
+/**
+ * A one-time code in boxes (CR-127): typing moves to the next box, Backspace to the previous one, a
+ * pasted code (or the one the phone suggests from an SMS or email, `one-time-code`) fills them all.
+ */
+export declare function OneTimeCodeInput({ value, onChange, onComplete, length, mode, disabled, invalid, autoFocus, label, describedBy, className, }: OneTimeCodeInputProps): React.JSX.Element;
+export default OneTimeCodeInput;

package/dist/types/src/components/auth/ResetPassword.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type AuthLink, type AuthScreenProps, type PasswordRules } from './shared';
+export interface ResetPasswordProps extends AuthScreenProps {
+    /** Saves the new password (with the code of the link, which your function knows). */
+    onResetPassword: (password: string) => Promise<unknown>;
+    /** The account, when the link says it. */
+    email?: string;
+    /** The link has no code, or it is known to be expired: the screen says so at once. */
+    invalidLink?: boolean;
+    /** What the password needs. Default: at least 8 characters. */
+    passwordRules?: PasswordRules;
+    /** "Back to sign in", and the button after the password is saved. */
+    signInLink?: AuthLink;
+    /** "Ask for a new link" when the link is expired (the screen of `ForgotPassword`). */
+    requestNewLink?: AuthLink;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Called after the password is saved. */
+    onDone?: () => void;
+}
+/**
+ * The screen of a new password (CR-127), opened by the link of the email: the password with its
+ * requirements, then "Password changed"; an expired link says so and offers a new one.
+ */
+export declare function ResetPassword({ onResetPassword, email, invalidLink, passwordRules, signInLink, requestNewLink, title, description, onDone, errorMessage, brand, toolbar, footer, bare, className, }: ResetPasswordProps): React.JSX.Element;
+/** The one action of a state (sign in, ask a new link), as a full-width button. */
+export declare function PrimaryLink({ to, children }: {
+    to: AuthLink;
+    children: React.ReactNode;
+}): React.JSX.Element;
+export default ResetPassword;

package/dist/types/src/components/auth/SignIn.d.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import { type AuthProviderOption } from './providers';
+import { type AuthLink, type AuthScreenProps } from './shared';
+export interface SignInProps extends AuthScreenProps {
+    /** Signs in with email and password. Without it there is no password. */
+    onPasswordSignIn?: (credentials: {
+        email: string;
+        password: string;
+    }) => Promise<unknown>;
+    /** Sends a code by email. With `onVerifyCode`, the screen offers to sign in with a code. */
+    onRequestCode?: (email: string) => Promise<unknown>;
+    /** Signs in with the code received by email. */
+    onVerifyCode?: (email: string, code: string) => Promise<unknown>;
+    /** The ways in through other services, in this order: `['google', 'apple']`. */
+    providers?: AuthProviderOption[];
+    /** Signs in with a provider of `providers`. */
+    onProviderSignIn?: (id: string) => Promise<unknown>;
+    /** The first way offered when there are password and code. Default `password`. */
+    method?: 'password' | 'code';
+    /** Digits of the code. Default `6`. */
+    codeLength?: number;
+    /** Seconds before a new code can be asked. Default `30`. */
+    resendSeconds?: number;
+    /** "Forgot password?" next to the password. */
+    forgotPasswordLink?: AuthLink;
+    /** "Don't have an account? Create one" under the card. */
+    signUpLink?: AuthLink;
+    /** The email already typed (an invitation, the last visit). */
+    defaultEmail?: string;
+    /** The name of the app in the title: "Sign in to <appName>". */
+    appName?: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Called once signed in (the gate shows the page by itself). */
+    onSignedIn?: () => void;
+}
+/**
+ * The sign-in screen (CR-127): providers, then email and password or a code by email, in any
+ * combination. An error of a function appears in the screen, translated, and what was typed stays.
+ */
+export declare function SignIn({ onPasswordSignIn, onRequestCode, onVerifyCode, providers, onProviderSignIn, method: initialMethod, codeLength, resendSeconds, forgotPasswordLink, signUpLink, defaultEmail, appName, title, description, onSignedIn, errorMessage, brand, toolbar, footer, bare, className, }: SignInProps): React.JSX.Element;
+export default SignIn;

package/dist/types/src/components/auth/SignUp.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+import type { AuthSignUpResult } from '../../providers/auth/AuthProvider';
+import { type AuthProviderOption } from './providers';
+import { type AuthLink, type AuthScreenProps, type PasswordRules } from './shared';
+export interface SignUpInput {
+    name?: string;
+    email: string;
+    password: string;
+}
+export interface SignUpProps extends AuthScreenProps {
+    /**
+     * Creates the account. Return `{ needsEmailVerification: true }` (what `signUp` of the adapter
+     * returns) to show "Check your email"; anything else calls `onSignedUp`.
+     */
+    onSignUp: (input: SignUpInput) => Promise<Partial<AuthSignUpResult> | void | unknown>;
+    /** Sends again the link that confirms the email. */
+    onResendVerification?: (email: string) => Promise<unknown>;
+    /** Asks the full name. Default `true`. */
+    askName?: boolean;
+    /**
+     * A box to tick before creating the account: `true` for the default sentence, or your own (with the
+     * links to your terms and privacy policy).
+     */
+    terms?: boolean | React.ReactNode;
+    /** What the password needs. Default: at least 8 characters. */
+    passwordRules?: PasswordRules;
+    providers?: AuthProviderOption[];
+    onProviderSignIn?: (id: string) => Promise<unknown>;
+    /** "Already have an account? Sign in" under the card. */
+    signInLink?: AuthLink;
+    /** Seconds before a new link can be asked. Default `30`. */
+    resendSeconds?: number;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Called when the account works at once (no email to confirm). */
+    onSignedUp?: () => void;
+}
+/**
+ * The screen that creates an account (CR-127): name, email, a password with its requirements shown
+ * while typing, the terms; then "Check your email" when the address must be confirmed.
+ */
+export declare function SignUp({ onSignUp, onResendVerification, askName, terms, passwordRules, providers, onProviderSignIn, signInLink, resendSeconds, title, description, onSignedUp, errorMessage, brand, toolbar, footer, bare, className, }: SignUpProps): React.JSX.Element;
+export default SignUp;

package/dist/types/src/components/auth/VerifyCode.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { type AuthScreenProps } from './shared';
+export interface VerifyCodeProps extends AuthScreenProps {
+    /** Where the code was sent: shown to the person. */
+    email?: string;
+    /** Checks the code; throw to refuse it (`AuthFlowError('invalidCode')`). */
+    onVerify: (code: string) => Promise<unknown>;
+    /** Sends a new code. Without it there is no "Send it again". */
+    onResend?: () => Promise<unknown>;
+    /** Goes back to type another email. */
+    onChangeEmail?: () => void;
+    /** Default `6`. */
+    length?: number;
+    mode?: 'numeric' | 'alphanumeric';
+    /** Seconds before a new code can be asked. Default `30`. */
+    resendSeconds?: number;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Called after the code was accepted. */
+    onVerified?: () => void;
+}
+/**
+ * The screen of a one-time code (CR-127): where it was sent, the boxes, sent as soon as it is complete,
+ * a new code after a wait, another email.
+ */
+export declare function VerifyCode({ email, onVerify, onResend, onChangeEmail, length, mode, resendSeconds, title, description, onVerified, errorMessage, brand, toolbar, footer, bare, className, }: VerifyCodeProps): React.JSX.Element;
+/** A sentence with the email in it, the email in bold. */
+export declare function EmailIn({ text, email }: {
+    text: string;
+    email: string;
+}): React.JSX.Element;
+export default VerifyCode;

package/dist/types/src/components/auth/VerifyEmail.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type AuthLink, type AuthScreenProps } from './shared';
+export interface VerifyEmailProps extends AuthScreenProps {
+    /** The code of the link (`oobCode`, `token_hash`, …): with `onVerify` the screen confirms it at once. */
+    code?: string | null;
+    /** Confirms the email with the code of the link. */
+    onVerify?: (code: string) => Promise<unknown>;
+    /** The address waiting for its confirmation. */
+    email?: string;
+    /** Sends the link again. */
+    onResend?: () => Promise<unknown>;
+    /**
+     * "I've confirmed it": checks again (e.g. reloads the user). `false` means still not confirmed;
+     * anything else calls `onVerified`.
+     */
+    onContinue?: () => Promise<boolean | void>;
+    /** The button after the email is confirmed (the app, or the sign in). */
+    continueLink?: AuthLink;
+    signInLink?: AuthLink;
+    /** Seconds before a new link can be asked. Default `30`. */
+    resendSeconds?: number;
+    /** Called once the email is confirmed. */
+    onVerified?: () => void;
+}
+/**
+ * The activation of an account (CR-127): opened by the link of the email it confirms the code at once
+ * (confirming, done, link expired); otherwise it waits for the confirmation, with a new send after a
+ * wait and "I've confirmed it".
+ */
+export declare function VerifyEmail({ code, onVerify, email, onResend, onContinue, continueLink, signInLink, resendSeconds, onVerified, errorMessage, brand, toolbar, footer, bare, className, }: VerifyEmailProps): React.JSX.Element;
+export default VerifyEmail;

package/dist/types/src/components/auth/index.d.ts

@@ -0,0 +1,12 @@
+export { AuthLayout, type AuthLayoutProps, type AuthLayoutTone } from './AuthLayout';
+export { SignIn, type SignInProps } from './SignIn';
+export { SignUp, type SignUpProps, type SignUpInput } from './SignUp';
+export { ForgotPassword, type ForgotPasswordProps } from './ForgotPassword';
+export { ResetPassword, type ResetPasswordProps } from './ResetPassword';
+export { VerifyEmail, type VerifyEmailProps } from './VerifyEmail';
+export { VerifyCode, type VerifyCodeProps } from './VerifyCode';
+export { OneTimeCodeInput, type OneTimeCodeInputProps } from './OneTimeCodeInput';
+export { AuthGate, type AuthGateProps } from './AuthGate';
+export { useAuthFlows, useAuthSession, linkCode, type AuthFlows, type AuthFlowsOptions, type AuthSession } from './useAuthFlows';
+export { authErrorMessage, authErrorReason, type AuthLink, type AuthScreenProps, type PasswordRules } from './shared';
+export { type AuthProviderOption } from './providers';

package/dist/types/src/components/auth/providers.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+/** A way in through another service: its id (`google`, `apple`, `github`, `microsoft`, …), or the whole option. */
+export type AuthProviderOption = string | {
+    id: string;
+    /** The name shown, "Continue with <label>". Default: the known name of the id. */
+    label?: string;
+    /** The mark of the service. Default: the one of a known id. */
+    icon?: React.ReactNode;
+};
+export declare function resolveProvider(option: AuthProviderOption): {
+    id: string;
+    label: string;
+    icon: string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.JSX.Element | null;
+};
+/** The buttons "Continue with …", one per provider, one under the other. */
+export declare function ProviderButtons({ providers, onSelect, pending, disabled, }: {
+    providers: AuthProviderOption[];
+    onSelect: (id: string) => void;
+    /** The id of the provider being opened. */
+    pending?: string | null;
+    disabled?: boolean;
+}): React.JSX.Element;

package/dist/types/src/components/auth/shared.d.ts

@@ -0,0 +1,124 @@
+import React from 'react';
+import { type I18nDict } from '../../I18n';
+import { type AuthErrorReason } from '../../providers/auth/AuthProvider';
+export type AccessDict = I18nDict['access'];
+/** The texts of the access screens, in the language of the app. */
+export declare const useAccessText: () => AccessDict;
+/**
+ * A link to another screen: a path of the app (a `Link`, no reload) or a function (a button that
+ * looks like a link, e.g. to switch the screen in place).
+ */
+export type AuthLink = string | (() => void);
+/** What every access screen shares: its frame. */
+export interface AuthScreenProps {
+    /** The mark above the title: a `<Brand>`, a logo. */
+    brand?: React.ReactNode;
+    /** Top right of the page: a `ThemeSwitcher`, a `LocaleSwitcher`. */
+    toolbar?: React.ReactNode;
+    /** Bottom of the page: legal links, the copyright. */
+    footer?: React.ReactNode;
+    /** Only the content, without `AuthLayout` (inside a modal or a page of your own). */
+    bare?: boolean;
+    className?: string;
+    /** The message shown for an error of a function; `undefined` falls back to the translated reason. */
+    errorMessage?: (error: unknown) => string | undefined;
+}
+/**
+ * Why an access flow failed: the reason of an `AuthFlowError`, of a known code of Firebase or Supabase,
+ * a refused connection, too many requests; `generic` otherwise. Never the raw text of the service.
+ */
+export declare function authErrorReason(error: unknown): AuthErrorReason;
+/** The message of an error of an access flow, translated (see `authErrorReason`). */
+export declare function authErrorMessage(error: unknown, dict: AccessDict): string;
+/** Runs a function of a screen: its pending state and its error, as a message for the person. */
+export declare function useAuthAction(errorMessage?: AuthScreenProps['errorMessage']): {
+    pending: boolean;
+    error: string | null;
+    reason: AuthErrorReason | null;
+    run: <T>(action: () => Promise<T>) => Promise<{
+        ok: true;
+        value: T;
+    } | {
+        ok: false;
+    }>;
+    clear: () => void;
+};
+export declare function emailProblem(value: string, t: AccessDict): string | undefined;
+/** What a new password needs. Length first (NIST 800-63B); the others only when you ask for them. */
+export interface PasswordRules {
+    /** Default `8`. */
+    minLength?: number;
+    number?: boolean;
+    mixedCase?: boolean;
+    symbol?: boolean;
+}
+export declare function passwordChecks(value: string, rules: PasswordRules, t: AccessDict): {
+    id: string;
+    label: string;
+    met: boolean;
+}[];
+/** Moves the focus to the first field with an error, after the render that shows it. */
+export declare function focusFirstInvalid(form: HTMLFormElement | null): void;
+/** Seconds left before a new send; `start()` begins the wait. */
+export declare function useCooldown(seconds: number): [number, () => void];
+export declare const authControlClass: string;
+interface AuthFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    error?: string;
+    hint?: React.ReactNode;
+    /** Right of the label (e.g. "Forgot password?"). */
+    labelAside?: React.ReactNode;
+    /** Inside the field, at its right (e.g. the button that shows the password). */
+    inset?: React.ReactNode;
+}
+/** A field of an access screen: its label, its error announced and tied to it, its hint. */
+export declare const AuthField: React.ForwardRefExoticComponent<AuthFieldProps & React.RefAttributes<HTMLInputElement>>;
+interface PasswordFieldProps extends Omit<AuthFieldProps, 'type' | 'inset' | 'hint'> {
+    /** The requirements shown while typing (a new password). */
+    rules?: PasswordRules;
+}
+/** A password with the button that shows it, and the requirements of a new one. */
+export declare const PasswordField: React.ForwardRefExoticComponent<PasswordFieldProps & React.RefAttributes<HTMLInputElement>>;
+/** The button that sends the form: full width, its spinner while it waits. */
+export declare const SubmitButton: ({ pending, children, disabled }: {
+    pending: boolean;
+    children: React.ReactNode;
+    disabled?: boolean;
+}) => React.JSX.Element;
+export declare const Spinner: ({ className }: {
+    className?: string;
+}) => React.JSX.Element;
+/** The error of the last attempt, announced to a screen reader. */
+export declare const FormError: ({ message }: {
+    message: string | null;
+}) => React.JSX.Element;
+/** A quiet message that something happened (a code sent again). */
+export declare const FormNotice: ({ message }: {
+    message: string | null;
+}) => React.JSX.Element;
+/** A link of a screen: a path of the app, or a function. */
+export declare const TextLink: ({ to, children, className }: {
+    to: AuthLink;
+    children: React.ReactNode;
+    className?: string;
+}) => React.JSX.Element;
+/** A button that looks like a link (a new send, another way in). */
+export declare const LinkButton: ({ onClick, disabled, children, className }: {
+    onClick: () => void;
+    disabled?: boolean;
+    children: React.ReactNode;
+    className?: string;
+}) => React.JSX.Element;
+/** "or", between the providers and the form. */
+export declare const Divider: ({ label }: {
+    label: string;
+}) => React.JSX.Element;
+/** "Don't have an account? Create one" under the card. */
+export declare const AltLine: ({ text, link, label }: {
+    text: string;
+    link?: AuthLink;
+    label: string;
+}) => React.JSX.Element | null;
+export {};

package/dist/types/src/components/auth/useAuthFlows.d.ts

@@ -0,0 +1,46 @@
+import type { AuthProviderAdapter, UserProfile } from '../../providers/auth/AuthProvider';
+import type { SignInProps } from './SignIn';
+import type { SignUpProps } from './SignUp';
+import type { ForgotPasswordProps } from './ForgotPassword';
+import type { ResetPasswordProps } from './ResetPassword';
+import type { VerifyEmailProps } from './VerifyEmail';
+export interface AuthSession {
+    /** The signed-in user, `null` without a session. */
+    user: UserProfile | null;
+    /** `false` while the session of the last visit is being restored: show neither the page nor the sign-in. */
+    ready: boolean;
+    signOut: () => Promise<void>;
+    adapter: AuthProviderAdapter;
+}
+/** Who is signed in with an auth provider of the app, and whether it is known yet (CR-127). */
+export declare function useAuthSession(provider?: string): AuthSession;
+export interface AuthFlowsOptions {
+    /** The page the confirmation link of a new account opens (your `VerifyEmail`), e.g. `/verify-email`. */
+    verifyEmailPath?: string;
+    /** The page the link to choose a new password opens (your `ResetPassword`), e.g. `/reset-password`. */
+    resetPasswordPath?: string;
+}
+export interface AuthFlows {
+    adapter: AuthProviderAdapter;
+    /** For `<SignIn {...flows.signIn} />`: password, code by email, providers, as the adapter offers them. */
+    signIn: Pick<SignInProps, 'onPasswordSignIn' | 'onRequestCode' | 'onVerifyCode' | 'onProviderSignIn' | 'providers'>;
+    /** For `<SignUp {...flows.signUp} />`; `undefined` when the adapter cannot create accounts. */
+    signUp?: Pick<SignUpProps, 'onSignUp' | 'onResendVerification'>;
+    /** For `<ForgotPassword {...flows.forgotPassword} />`; `undefined` without password reset. */
+    forgotPassword?: Pick<ForgotPasswordProps, 'onSendReset'>;
+    /** For `<ResetPassword {...flows.resetPassword(code)} />`, with the code of the link. */
+    resetPassword: (code: string | null | undefined) => Pick<ResetPasswordProps, 'onResetPassword' | 'invalidLink'>;
+    /** For `<VerifyEmail {...flows.verifyEmail} code={…} />`. */
+    verifyEmail: Pick<VerifyEmailProps, 'onVerify' | 'onResend'>;
+}
+/**
+ * Binds the access screens to an auth provider of the app (CR-127): each screen gets the functions of
+ * the methods the adapter has. An adapter that can reset a password (Firebase, Supabase, mock) signs in
+ * with email and password; one that cannot (Google, GitHub, Dropbox) offers its own button.
+ */
+export declare function useAuthFlows(provider?: string, options?: AuthFlowsOptions): AuthFlows;
+/**
+ * The code of the link an email opened, whatever the service calls it: `oobCode` (Firebase),
+ * `token_hash` (Supabase), `code`.
+ */
+export declare function linkCode(search?: string | URLSearchParams): string | null;