@cauthyhq/react 0.0.0 → 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,724 @@
+import * as react from 'react';
+import { ReactNode, ComponentType, FormEvent } from 'react';
+import { PublicSession, AuthClient, OrganizationsClient, OrganizationSeat, AuthError, SignInFlow, FlowState, OrganizationRoleChoice } from '@cauthyhq/js';
+export { AccountClient, Account as AccountDetails, AccountSession, AuthClient, AuthError, AuthMethods, AuthResult, CauthyError, ConnectedAgent, FlowState, FlowStep, Invitation, JsonValue, LinkedIdentity, NextStep, OrganizationPerson, OrganizationRoleChoice, OrganizationSeat, OrganizationsClient, Passkey, PasskeyKind, PendingLegal, PermissionOf, Policy, PublicSession, RoleOf, SSOConnection, SecondStep, SessionOrganization, SessionUser, SignInFlow, can, canAutofillPasskeys, canUsePasskeys, createAuthClient, createSessionStore, createSignInFlow, definePolicy, unwrap } from '@cauthyhq/js';
+import { CauthyTheme } from '@cauthyhq/js/theme';
+export { CauthyTheme, themeFromCss, themeFromStackmyth, themeVariables, tokensFromStackmyth } from '@cauthyhq/js/theme';
+
+interface SessionContext {
+    /** The signed-in person and their organizations, or null. */
+    session: PublicSession | null;
+    status: 'loading' | 'authenticated' | 'unauthenticated';
+    /** Sends the browser to sign in, and back to `returnTo` (default: where it is now). */
+    signIn(options?: {
+        returnTo?: string;
+        locale?: string;
+        prompt?: 'login';
+    }): void;
+    /** Signs out of this application and of Cauthy in this browser. */
+    signOut(): void;
+    /** Asks the server again who is signed in. */
+    refresh(): Promise<PublicSession | null>;
+    /** Where the person looks after their account: password, second step, passkeys. */
+    accountUrl(returnTo?: string): string;
+    /** Where the server mounted the routes. */
+    basePath: string;
+}
+interface CauthyProviderProps {
+    children: ReactNode;
+    /**
+     * Where the server mounted the routes. Default: `/api/auth`. Fixed for the
+     * life of the provider: it is the session store's address, so a different
+     * one means another store, with the session asked again and every flow
+     * started over. To move it, remount the provider (`key={basePath}`).
+     */
+    basePath?: string;
+    /**
+     * The session the server already read while rendering (SSR): the first
+     * paint is then right, with no "loading". `null` means "nobody"; leave it
+     * out when the server did not look.
+     */
+    initialSession?: PublicSession | null;
+    /**
+     * The language the person reads, for what Cauthy mails them from
+     * `useAuth()` and the ready-made forms (a sign-in link, a new password, a
+     * confirmation): a tag like `es` or `es-CO`, or a function that answers it
+     * when the person can change it. Default: the page's own (`<html lang>`),
+     * else the browser's.
+     */
+    locale?: string | (() => string | undefined);
+    /**
+     * The application's own look for every ready-made part, over the one set in
+     * Cauthy's dashboard: colours, corners, typeface. An application built with
+     * stackmyth passes its tokens: `theme={themeFromStackmyth(css).theme}`.
+     */
+    theme?: CauthyTheme;
+    /** The fetch the routes are called with. Default: the page's own. */
+    fetch?: typeof fetch;
+    /** Called once when the server does not say `Cauthy-Protocol: 1`. Default: one console warning. */
+    onProtocolMismatch?: (seen: string | null) => void;
+}
+declare function CauthyProvider({ children, basePath, initialSession, locale, theme, fetch, onProtocolMismatch }: CauthyProviderProps): react.JSX.Element;
+declare function useSession(): SessionContext;
+/**
+ * The application's own sign-in screens: the functions a form calls.
+ *
+ *   const { signIn, signUp, forgotPassword, signOut, session } = useAuth()
+ *   const r = await signIn.email({ email, password })
+ *
+ * They are `createAuthClient()`'s, and what is on screen follows them: after
+ * a sign-in or a sign-out, `session` is the new one with no reload.
+ */
+declare function useAuth(): AuthClient & Pick<SessionContext, 'session' | 'status' | 'refresh'>;
+
+interface UseOrganizations extends OrganizationsClient {
+    /** The person's organizations; empty while loading or signed out. */
+    organizations: OrganizationSeat[];
+    loading: boolean;
+    /** Why the last list could not be had, or null: an empty list with no error is a person in no organization. */
+    error: AuthError | null;
+    /** Asks for the list again. */
+    reload(): Promise<void>;
+}
+declare function useOrganizations(options?: {
+    system?: string;
+}): UseOrganizations;
+
+declare function useSignInFlow(): SignInFlow & FlowState;
+
+interface UserButtonTexts {
+    signIn: string;
+    /** The button's accessible name; `{name}` is the person's. */
+    menu: string;
+    manageAccount: string;
+    signOut: string;
+}
+type Part = 'root' | 'trigger' | 'avatar' | 'menu' | 'identity' | 'item';
+interface UserButtonProps {
+    /** The language of the built-in words. Default: `en`. */
+    locale?: 'en' | 'es';
+    texts?: Partial<UserButtonTexts>;
+    /** Where "Manage account" goes: the application's own account page. Default: Cauthy's hosted one. */
+    accountHref?: string;
+    /** Where "Sign in" goes: the application's own sign-in page. Default: Cauthy's hosted one. */
+    signInHref?: string;
+    /** Called once signed out, instead of going to `/`. */
+    onSignOut?: () => void;
+    /** More entries for the menu, after "Manage account". Give each `role="menuitem"` and `tabIndex={-1}`. */
+    children?: ReactNode;
+    /** No look at all: no `data-cauthy`, no class names but the ones given. */
+    unstyled?: boolean;
+    classNames?: Partial<Record<Part, string>>;
+}
+/** Two letters for a person: the first and last word of the name, else the address's first letter. */
+declare function initialsOf(name: string, email: string): string;
+declare function UserButton(props: UserButtonProps): react.JSX.Element;
+
+/** Every sentence the forms show. Give any of them to change it. */
+interface AuthTexts {
+    email: string;
+    password: string;
+    name: string;
+    code: string;
+    signIn: string;
+    signUp: string;
+    continueWith: string;
+    orWithEmail: string;
+    /** The sign-in's box to stay signed in, shown when the application's client allows it. */
+    keepSignedIn: string;
+    forgotPassword: string;
+    noAccount: string;
+    createAccount: string;
+    /** The label of the company's name, asked when the application's system makes an organization per sign-up. */
+    company: string;
+    /** The legal box: "I have read and accept" + "the Terms of Service" + "and" + "the Privacy Policy", linked. */
+    iAccept: string;
+    and: string;
+    termsOfService: string;
+    privacyPolicy: string;
+    haveAccount: string;
+    sendLink: string;
+    linkSent: string;
+    codeHelp: string;
+    /** The second step when it is a phone only. */
+    codeHelpPhone: string;
+    /** The second step by email (the account has no factor): "{to}" is the address, masked. */
+    codeHelpEmail: string;
+    sendEmailAgain: string;
+    /** "{to}" is the phone, masked. */
+    sendCodeSms: string;
+    sendCodeWhatsapp: string;
+    codeSent: string;
+    /** The second step approved on the phone; "{n}" is the number to pick. */
+    pushSend: string;
+    pushPick: string;
+    pushWaiting: string;
+    phone: string;
+    phoneHelp: string;
+    phoneOn: string;
+    phoneOff: string;
+    addPhone: string;
+    removePhone: string;
+    bySms: string;
+    byWhatsapp: string;
+    /** The label of the channel phone codes go by, where the application draws it as a select. */
+    channel: string;
+    verify: string;
+    checkEmail: string;
+    backToSignIn: string;
+    emailMeALink: string;
+    /** The sign-in link's own step: what it does, its send button, the way back. */
+    linkHelp: string;
+    sendMeTheLink: string;
+    back: string;
+    usePasskey: string;
+    codeFromMail: string;
+    signInLinkSent: string;
+    newPassword: string;
+    savePassword: string;
+    passwordChanged: string;
+    confirming: string;
+    emailConfirmed: string;
+    invitedTo: string;
+    invitedToOrganization: string;
+    invitedAs: string;
+    choosePassword: string;
+    acceptInvite: string;
+    openingInvitation: string;
+    invitationInvalid: string;
+    profile: string;
+    save: string;
+    saved: string;
+    currentPassword: string;
+    changePassword: string;
+    passwordChangedHere: string;
+    secondStep: string;
+    secondStepOn: string;
+    secondStepOff: string;
+    turnOn: string;
+    turnOff: string;
+    addToApp: string;
+    openInApp: string;
+    qrAlt: string;
+    recoveryCodes: string;
+    newRecoveryCodes: string;
+    keepCodes: string;
+    /** Beside recovery codes just made: copy them all, or save them as a text file. */
+    copyCodes: string;
+    downloadCodes: string;
+    codesCopied: string;
+    /** Said when the browser would not copy: the codes stay on screen to select. */
+    codesNotCopied: string;
+    /** The action that opens the form of a part already set (the name). */
+    change: string;
+    /** The password part, when the account has one. */
+    passwordSet: string;
+    /** Opens the form that adds another passkey, once the account has one. */
+    addAnotherPasskey: string;
+    passkeys: string;
+    managePasskeys: string;
+    passkeysHelp: string;
+    noPasskeys: string;
+    passkeyName: string;
+    /** @deprecated Unused since 0.19.0: the account screen offers `addPasskeyDevice` and `addSecurityKey`. */
+    addPasskey: string;
+    addPasskeyDevice: string;
+    addSecurityKey: string;
+    passkeyKinds: Record<'security_key' | 'synced' | 'device', string>;
+    removePasskey: string;
+    passkeyAdded: string;
+    passkeyUnnamed: string;
+    sessions: string;
+    signOutEverywhere: string;
+    agents: string;
+    agentsHelp: string;
+    disconnect: string;
+    anAgent: string;
+    unknownDevice: string;
+    emailAddress: string;
+    newEmail: string;
+    changeEmail: string;
+    emailSent: string;
+    linkedAccounts: string;
+    noLinkedAccounts: string;
+    linkWith: string;
+    unlink: string;
+    linked: string;
+    ssoOnly: string;
+    members: string;
+    membersHidden: string;
+    organizationMissing: string;
+    memberYou: string;
+    memberInvited: string;
+    memberManager: string;
+    memberRole: string;
+    memberAdd: string;
+    memberAdded: string;
+    memberRemove: string;
+    memberRemoveConfirm: string;
+    memberLeave: string;
+    memberLeaveConfirm: string;
+    memberInviteAgain: string;
+    memberInvitationSent: string;
+    organization: string;
+    organizationRename: string;
+    organizationRenamed: string;
+    organizationArchive: string;
+    organizationArchiveConfirm: string;
+    organizationArchived: string;
+    organizationDelete: string;
+    organizationDeleteConfirm: string;
+    organizationDeleted: string;
+    yes: string;
+    cancel: string;
+    termsChanged: string;
+    termsChangedHelp: string;
+    acceptTerms: string;
+    /** By error code; one missing shows what the server said. */
+    errors: Record<string, string>;
+}
+type Slot = 'form' | 'field' | 'label' | 'input' | 'button' | 'providerButton' | 'providerIcon' | 'link' | 'error' | 'fieldError' | 'hint' | 'notice' | 'pending' | 'separator' | 'footer' | 'check' | 'account' | 'section' | 'heading' | 'secret' | 'qr' | 'codes' | 'sessions' | 'session';
+interface AuthFormProps {
+    /** The language of the built-in sentences. Default: `en`. */
+    locale?: 'en' | 'es';
+    /** Sentences of the application's own, over the built-in ones. */
+    texts?: Partial<Omit<AuthTexts, 'errors'>> & {
+        errors?: Record<string, string>;
+    };
+    /**
+     * Called once the person is signed in, instead of going to `returnTo`. The
+     * form stays busy (its button loading, every control disabled) until it
+     * leaves the page. When the application keeps the form on screen while it
+     * moves on (a router's navigation, loading the session), return a Promise:
+     * the form waits for it, then is free again if it is still shown.
+     */
+    onSuccess?: () => void | Promise<unknown>;
+    /** Where to go after signing in, and where a provider returns to. Default: `/`. */
+    returnTo?: string;
+    /**
+     * `<SignIn />`: a sign-in link sent to an address with no account makes
+     * one when it is used (if the workspace accepts new accounts), so this one
+     * screen signs people in and up alike. Default: off.
+     */
+    createAccounts?: boolean;
+    /** Paths of the application's other screens, for the links between them. */
+    links?: {
+        signIn?: string;
+        signUp?: string;
+        forgotPassword?: string;
+    };
+    /** A class for each part the form renders. A part given one is left to it by `styles.css`. */
+    classNames?: Partial<Record<Slot, string>>;
+    /**
+     * No look of Cauthy's at all: `styles.css` leaves the form alone and the
+     * workspace's colours are not read. For a form drawn wholly with the
+     * application's own `components` or `classNames`.
+     */
+    unstyled?: boolean;
+    /**
+     * Take the colours, corners and typeface a person set for the workspace in
+     * Cauthy's dashboard. Default: true. False keeps `styles.css`'s own, and
+     * whatever `--cauthy-*` variables the application sets.
+     */
+    workspaceLook?: boolean;
+    /**
+     * The application's own parts, to draw the form with: its form layout,
+     * button, input, checkbox, select, field, text, badge, link, divider, alert
+     * and confirmation. A part not given is drawn as before; with every part given
+     * and `unstyled`, the form adds no element that carries a look of its own.
+     */
+    components?: AuthComponents;
+}
+/**
+ * What the application's button is given: what a `<button>` would be, and
+ * what kind of button it is. `primary` sends the form; `secondary` is any
+ * other action (a provider, a passkey, a sign-in link, cancel, send again);
+ * `danger` removes, leaves, deletes, disconnects or turns something off.
+ * `loading` is true on the one button whose action is under way; every
+ * button is `disabled` meanwhile. Draw a spinner (or the like) on the button
+ * while `loading` is true, and keep its label: after a sign-in it stays true
+ * until the page is left, so the person sees the work go on.
+ */
+interface AuthButtonProps {
+    type: 'submit' | 'button';
+    disabled?: boolean;
+    className?: string;
+    onClick?: () => void;
+    children: ReactNode;
+    variant?: 'primary' | 'secondary' | 'danger';
+    loading?: boolean;
+}
+/**
+ * What the application's form layout is given: every element the forms put
+ * around their parts — a whole form, each step of it, each part of the
+ * account and members screens — so its own stack lays them out. `as` says
+ * which element it stands for: a `form` sends with `onSubmit` (render a
+ * `<form>` with it for Enter to submit), a `div` only groups.
+ */
+interface AuthFormLayoutProps {
+    as: 'form' | 'div';
+    onSubmit?: (e: FormEvent) => void;
+    noValidate?: boolean;
+    'aria-busy'?: boolean;
+    className?: string;
+    /**
+     * Which part of `<Account />` or `<OrganizationMembers />` this is, for an
+     * application that draws each as a card: an `AccountSection`
+     * (`profile`, `passkeys`…), or `members`, `add-member`, `organization`
+     * and `rename` (the form inside `organization`). Not set on a whole form.
+     */
+    section?: string;
+    children: ReactNode;
+}
+/** What the application's input is given: what an `<input>` would be. */
+interface AuthInputProps {
+    id: string;
+    name: string;
+    type: string;
+    value: string;
+    autoComplete?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+    'aria-invalid'?: boolean;
+    'aria-describedby'?: string;
+    onChange: (e: {
+        target: {
+            value: string;
+        };
+    }) => void;
+}
+/** A box to tick: the legal documents and each consent of a sign-up. `children` is its label. */
+interface AuthCheckboxProps {
+    id: string;
+    name: string;
+    checked: boolean;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+    onChange: (checked: boolean) => void;
+    children: ReactNode;
+}
+/** One choice of a few: a member's role, the channel of phone codes. Without a visible label it carries `aria-label`. */
+interface AuthSelectProps {
+    id: string;
+    name: string;
+    value: string;
+    options: {
+        value: string;
+        label: string;
+    }[];
+    disabled?: boolean;
+    className?: string;
+    'aria-label'?: string;
+    onChange: (value: string) => void;
+}
+/**
+ * A label, its control (`children`) and what is said under it. The control's
+ * `aria-describedby` names `${id}-hint` and `${id}-error`: give the help and
+ * the error those ids for a screen reader to read them with it.
+ */
+interface AuthFieldProps {
+    id: string;
+    label: ReactNode;
+    children: ReactNode;
+    /** Beside the label: "Forgot your password?". */
+    aside?: ReactNode;
+    /** What the field takes (a new password's rule). Not given while there is an error. */
+    help?: ReactNode;
+    error?: ReactNode;
+    required?: boolean;
+    className?: string;
+}
+/** A sentence of the form: help, a state, the footer (`size: 'sm'`), a section's heading (`as: 'h2'`). */
+interface AuthTextProps {
+    as?: 'p' | 'span' | 'h2';
+    tone?: 'muted' | 'danger' | 'success';
+    size?: 'sm' | 'md' | 'lg';
+    children: ReactNode;
+}
+/** A short mark beside a name: "you", "invited", a role, a passkey's kind. */
+interface AuthBadgeProps {
+    tone?: 'neutral' | 'success' | 'warning' | 'danger';
+    children: ReactNode;
+}
+/** A link: to another screen, or a legal document (`newTab`). */
+interface AuthLinkProps {
+    href?: string;
+    onClick?: () => void;
+    newTab?: boolean;
+    children: ReactNode;
+}
+/** The line between the providers and the address: "or with your email". */
+interface AuthDividerProps {
+    label?: ReactNode;
+}
+/**
+ * What went wrong (`danger`), what was done (`success`) or what to know
+ * (`info`). The built-in one is announced: `role="alert"` for danger,
+ * `role="status"` otherwise; the application's should be too.
+ */
+interface AuthAlertProps {
+    tone: 'danger' | 'info' | 'success';
+    children: ReactNode;
+}
+/** What a confirmation asks: removing a member, leaving, archiving or deleting the organization. */
+interface AuthConfirmOptions {
+    title: string;
+    body?: string;
+    confirmLabel: string;
+    cancelLabel: string;
+    danger?: boolean;
+}
+/** The parts a form may be drawn with. See `AuthFormProps.components`. */
+interface AuthComponents {
+    /**
+     * Every element around the form's parts: the form itself, each step, each
+     * part of the account and members screens. Not given: the `form`, `div` or
+     * `section` the forms have always drawn.
+     */
+    Form?: ComponentType<AuthFormLayoutProps>;
+    Button?: ComponentType<AuthButtonProps>;
+    Input?: ComponentType<AuthInputProps>;
+    Checkbox?: ComponentType<AuthCheckboxProps>;
+    Select?: ComponentType<AuthSelectProps>;
+    Field?: ComponentType<AuthFieldProps>;
+    Text?: ComponentType<AuthTextProps>;
+    Badge?: ComponentType<AuthBadgeProps>;
+    Link?: ComponentType<AuthLinkProps>;
+    Divider?: ComponentType<AuthDividerProps>;
+    Alert?: ComponentType<AuthAlertProps>;
+    /**
+     * Asks before something that cannot be undone, and answers whether to go
+     * on: the application's own dialog. Not given: the question shows inline,
+     * with a yes and a cancel button. Never the browser's own dialog.
+     */
+    Confirm?: (options: AuthConfirmOptions) => Promise<boolean>;
+}
+declare function SignIn(props: AuthFormProps): react.JSX.Element;
+interface GoogleOneTapProps {
+    /** Where to go once signed in. Without it (and without `onSuccess`), the page stays and its session updates. */
+    returnTo?: string;
+    /** Called once signed in, instead of going to `returnTo`. */
+    onSuccess?: () => void;
+    /** The prompt's words: sign in (default), sign up, or use the application. */
+    context?: 'signin' | 'signup' | 'use';
+    /** Whether the person asked to stay signed in, read when they tap. */
+    remember?: () => boolean;
+}
+/**
+ * Google One Tap: put it on any page, and a person who is not signed in sees
+ * Google's prompt with the Google account the browser has; one tap signs them
+ * in. It draws nothing of its own, and shows nothing to somebody signed in or
+ * where the workspace has no Google sign-in.
+ */
+declare function GoogleOneTap(props: GoogleOneTapProps): null;
+declare function SignUp(props: AuthFormProps): react.JSX.Element;
+declare function ForgotPassword(props: AuthFormProps): react.JSX.Element;
+/** The page a "choose a new password" link opens: `pages.resetPassword`. */
+declare function ResetPassword(props: AuthFormProps): react.JSX.Element;
+/** The page a "confirm your address" link opens: `pages.verifyEmail`. It confirms as it opens. */
+declare function VerifyEmail(props: AuthFormProps): react.JSX.Element;
+/**
+ * The page an invitation opens: `pages.acceptInvite`. It says who is invited
+ * to what, asks for a password under the workspace's policy, signs the person
+ * in (with the second step, when their account owes one) and goes on to
+ * `returnTo`. The invitation is good until it is accepted: reading it, or a
+ * password refused, does not spend it.
+ */
+/** What `<AcceptInvite />` tells the application once the invitation is accepted. */
+type AcceptInviteEvent = {
+    kind: 'invitation.accepted';
+    email: string;
+    organization?: string;
+};
+interface AcceptInviteProps extends AuthFormProps {
+    /** Called once the invitation is accepted, before the second step when the account owes one. */
+    onSaved?: (event: AcceptInviteEvent) => void;
+}
+declare function AcceptInvite(props: AcceptInviteProps): react.JSX.Element;
+interface PendingTermsProps extends Omit<AuthFormProps, 'links' | 'returnTo' | 'createAccounts'> {
+    /**
+     * Called once the person accepted. Nothing else happens: the application
+     * decides what follows. A Promise keeps the button loading until it settles.
+     */
+    onSuccess?: () => void | Promise<unknown>;
+}
+/**
+ * The legal documents the signed-in person still owes (a new version of the
+ * terms, say), linked, with the action that accepts them. It shows nothing
+ * while it reads them, when nothing is owed, and once they are accepted.
+ * Nothing stops the person meanwhile: the application decides what waits.
+ */
+declare function PendingTerms(props: PendingTermsProps): react.JSX.Element | null;
+/** The parts of `<Account />`, by name: what `sections` lists. */
+type AccountSection = 'profile' | 'email' | 'password' | 'linked' | 'secondStep' | 'phone' | 'passkeys' | 'agents' | 'sessions';
+/**
+ * What `<Account />` tells the application after each change it saved, for
+ * the application's own toast or its own data to follow.
+ */
+type AccountEvent = {
+    kind: 'profile.saved';
+    name: string;
+} | {
+    kind: 'email.change_requested';
+    email: string;
+} | {
+    kind: 'password.changed';
+} | {
+    kind: 'identity.linked';
+    provider: string;
+} | {
+    kind: 'identity.unlinked';
+    provider: string;
+} | {
+    kind: 'mfa.enabled';
+} | {
+    kind: 'mfa.disabled';
+} | {
+    kind: 'recovery_codes.regenerated';
+} | {
+    kind: 'phone.added';
+    channel: 'sms' | 'whatsapp';
+} | {
+    kind: 'phone.removed';
+} | {
+    kind: 'passkey.added';
+    id: string;
+} | {
+    kind: 'passkey.removed';
+    id: string;
+} | {
+    kind: 'agent.disconnected';
+    id: string;
+} | {
+    kind: 'sessions.ended';
+};
+interface AccountProps extends Omit<AuthFormProps, 'links' | 'returnTo' | 'onSuccess'> {
+    /** Called after "sign out everywhere". Default: go to `/`. A Promise keeps the button loading until it settles. */
+    onSignedOut?: () => void | Promise<unknown>;
+    /** The moment of a session, as the application writes dates. Default: the browser's own way, in the reader's time zone. */
+    formatDate?: (iso: string) => string;
+    /**
+     * The parts shown, in this order. Default: all of them, as listed in
+     * `AccountSection`. A part with nothing to show (the password of an account
+     * without one, agents when none is connected) stays out either way.
+     */
+    sections?: AccountSection[];
+    /** Called after every change saved, with what changed. */
+    onSaved?: (event: AccountEvent) => void;
+}
+/**
+ * The signed-in person's account, in the application: their name, their
+ * password, the second step, and where they are signed in. Each part saves on
+ * its own. Like the other forms, it carries no styles.
+ */
+declare function Account(props: AccountProps): react.JSX.Element;
+/** What each part of the account screen takes, shown on its own: `<Account />`'s props but `sections`. */
+type AccountPartProps = Omit<AccountProps, 'sections'>;
+/** The person's name. */
+declare function AccountProfile(props: AccountPartProps): react.JSX.Element;
+/** Changing the address: a link goes to the new one. */
+declare function AccountEmail(props: AccountPartProps): react.JSX.Element;
+/** Changing the password, for an account that has one. */
+declare function AccountPassword(props: AccountPartProps): react.JSX.Element;
+/** The providers the account signs in with. */
+declare function AccountLinked(props: AccountPartProps): react.JSX.Element;
+/** The second step with an authenticator app, and the recovery codes. */
+declare function AccountSecondStep(props: AccountPartProps): react.JSX.Element;
+/** The phone codes go to, where the workspace sends them. */
+declare function AccountPhone(props: AccountPartProps): react.JSX.Element;
+/** The account's passkeys. */
+declare function AccountPasskeys(props: AccountPartProps): react.JSX.Element;
+/** The AI agents the person connected, when there is one. */
+declare function AccountAgents(props: AccountPartProps): react.JSX.Element;
+/** Where the person is signed in, and "sign out everywhere". */
+declare function AccountSessions(props: AccountPartProps): react.JSX.Element;
+/** An action `<OrganizationMembers hide={...} />` never offers. */
+type OrganizationMembersAction = 'archive' | 'delete' | 'rename' | 'leave';
+/**
+ * What `<OrganizationMembers />` tells the application after each change it
+ * saved, for the application's own toast or its own data to follow.
+ */
+type OrganizationMembersEvent = {
+    kind: 'member.added';
+    organizationId: string;
+    userId: string;
+    email: string;
+    role: string;
+} | {
+    kind: 'member.role_changed';
+    organizationId: string;
+    userId: string;
+    role: string;
+    previousRole: string;
+} | {
+    kind: 'member.removed';
+    organizationId: string;
+    userId: string;
+} | {
+    kind: 'member.left';
+    organizationId: string;
+    userId: string;
+} | {
+    kind: 'member.invited_again';
+    organizationId: string;
+    userId: string;
+} | {
+    kind: 'organization.renamed';
+    organizationId: string;
+    name: string;
+} | {
+    kind: 'organization.archived';
+    organizationId: string;
+} | {
+    kind: 'organization.deleted';
+    organizationId: string;
+};
+interface OrganizationMembersProps extends Omit<AuthFormProps, 'links' | 'returnTo' | 'onSuccess' | 'createAccounts'> {
+    /** The organization, by the id Cauthy gave it. */
+    organizationId: string;
+    /** The moment of a membership, as the application writes dates. Default: the browser's own way. */
+    formatDate?: (iso: string) => string;
+    /**
+     * The roles offered when adding a member or changing one's role: those for
+     * which it answers true. A member already holding another role keeps it,
+     * and it shows. Default: every role the person may give.
+     */
+    roles?: (role: string, choice: OrganizationRoleChoice) => boolean;
+    /** Actions never offered, whatever the person's role allows. */
+    hide?: OrganizationMembersAction[];
+    /** A role's name wherever one shows: a member's, the role choices, adding one. Default: the name the catalog gives it. */
+    roleLabel?: (choice: OrganizationRoleChoice) => string;
+    /** Called after every change saved, with what changed. */
+    onSaved?: (event: OrganizationMembersEvent) => void;
+}
+/**
+ * The people of one of the signed-in person's organizations, administered
+ * from the application. What it offers follows the person's role in the
+ * system's catalog: cauthy:members read lists the people; manage adds them by
+ * address (one with no account is invited), changes their role and sends an
+ * invitation again; remove removes them. Anybody may leave. Only an owner
+ * gives the owner role or changes an owner. cauthy:organization update,
+ * archive and delete rename the organization, archive it, delete it. Cauthy
+ * checks each change with the person's own session; the application
+ * authorizes nothing. Like the other forms, it carries no styles.
+ */
+declare function OrganizationMembers(props: OrganizationMembersProps): react.JSX.Element;
+
+type ListPart = 'organizations' | 'organizationList' | 'organization' | 'organizationRole' | 'retry';
+interface OrganizationsProps extends Omit<OrganizationMembersProps, 'organizationId'> {
+    /** Only one system's organizations. */
+    system?: string;
+    /** The one shown first. Default: the first of the list. */
+    defaultOrganizationId?: string;
+    /** Called when the person picks one. */
+    onSelect?: (organization: OrganizationSeat) => void;
+    /** Show the people of the one picked. Default: true. */
+    showMembers?: boolean;
+    /** A class for each part of the list; the members part takes `classNames`. */
+    listClassNames?: Partial<Record<ListPart, string>>;
+}
+declare function Organizations(props: OrganizationsProps): react.JSX.Element;
+
+export { AcceptInvite, type AcceptInviteEvent, type AcceptInviteProps, Account, AccountAgents, AccountEmail, type AccountEvent, AccountLinked, type AccountPartProps, AccountPasskeys, AccountPassword, AccountPhone, AccountProfile, type AccountProps, AccountSecondStep, type AccountSection, AccountSessions, type AuthAlertProps, type AuthBadgeProps, type AuthButtonProps, type AuthCheckboxProps, type AuthComponents, type AuthConfirmOptions, type AuthDividerProps, type AuthFieldProps, type AuthFormLayoutProps, type AuthFormProps, type AuthInputProps, type AuthLinkProps, type AuthSelectProps, type AuthTextProps, type AuthTexts, CauthyProvider, type CauthyProviderProps, ForgotPassword, GoogleOneTap, type GoogleOneTapProps, OrganizationMembers, type OrganizationMembersAction, type OrganizationMembersEvent, type OrganizationMembersProps, Organizations, type OrganizationsProps, PendingTerms, type PendingTermsProps, ResetPassword, type SessionContext, SignIn, SignUp, type UseOrganizations, UserButton, type UserButtonProps, type UserButtonTexts, VerifyEmail, initialsOf, useAuth, useOrganizations, useSession, useSignInFlow };