cauthy-auth 0.32.0 → 0.34.0

package/README.md

@@ -90,12 +90,13 @@ import { OrganizationMembers } from 'cauthy-auth/react'
   organizationId={org.id}
   roles={(role) => role !== 'billing'}             // the roles offered when adding or changing one
   hide={['archive', 'delete']}                    // never offered: 'archive', 'delete', 'rename', 'leave'
+  roleLabel={(c) => t(`roles.${c.role}`)}          // a role's name wherever one shows. Default: the catalog's
   onSaved={(e) => toast(e.kind)}                  // member.added, member.role_changed, member.removed, member.left,
 />                                                // member.invited_again, organization.renamed, .archived, .deleted
 
 const { organizations } = useAuth()
 const [org] = await organizations.list()         // org.can: { readMembers, manageMembers, removeMembers, update, archive, delete }
-await organizations.add(org.id, { email: 'ana@example.com', role: 'reader' })
+await organizations.add(org.id, { email: 'ana@example.com', role: 'reader' })   // already a member: error member_exists, role unchanged
 await organizations.setRole(org.id, userId, 'admin')
 await organizations.remove(org.id, userId)        // anybody may remove themselves: leave
 await organizations.rename(org.id, 'Acme Books')  // r.organization
@@ -173,15 +174,25 @@ The ready-made forms wear the look set for your application in Cauthy's dashboar
 import 'cauthy-auth/styles.css'
 ```
 
-Or draw them with your own `components` and `classNames`, and pass `unstyled`. Every part the forms draw can be yours; a part not given is drawn as before. With every part given and `unstyled`, the forms add only structural wrappers (`div`, `form`, `section`, lists):
+Or draw them with your own `components` and `classNames`, and pass `unstyled`. Every part the forms draw can be yours; a part not given is drawn as before. With every part given and `unstyled`, the forms add no element of their own but lists:
 
 ```tsx
-<SignIn unstyled components={{ Button, Input, Checkbox, Select, Field, Text, Badge, Link, Divider, Alert, Confirm }} />
+<SignIn unstyled components={{ Form, Button, Input, Checkbox, Select, Field, Text, Badge, Link, Divider, Alert, Confirm }} />
 ```
 
+`Form` is every element the forms put around their parts: each form and each of its steps, and each part of `<Account />` and `<OrganizationMembers />`. Give it your design system's stack and the gaps between fields and buttons are yours, with no CSS on the page:
+
+```tsx
+const Form: AuthComponents['Form'] = ({ as, children, ...rest }) =>
+  as === 'form' ? <Stack as="form" gap={3} {...rest}>{children}</Stack> : <Stack gap={3} {...rest}>{children}</Stack>
+```
+
+`Button` is told what kind of button it is: `primary` sends the form; `secondary` is any other way (a provider, a passkey, a sign-in link, SSO, cancel, send again); `danger` removes, leaves, deletes, disconnects, signs out everywhere or turns the second step off. `loading` is true on the one button whose action is under way; every button is `disabled` meanwhile.
+
 | Part | Is given |
 | --- | --- |
-| `Button` | `type`, `disabled`, `className`, `onClick`, `children` |
+| `Form` | `as` (`form` or `div`), `onSubmit`, `noValidate`, `aria-busy`, `className`, `section`, `children`. Render a `<form>` for `as="form"`, for Enter to send it. `section` names each part of `<Account />` (`profile`, `passkeys`… as in `AccountSection`) and of `<OrganizationMembers />` (`members`, `add-member`, `organization`, `rename`), to draw each as a card |
+| `Button` | `type`, `variant` (`primary`, `secondary`, `danger`), `loading`, `disabled`, `className`, `onClick`, `children` |
 | `Input` | `id`, `name`, `type`, `value`, `autoComplete`, `required`, `className`, `aria-invalid`, `aria-describedby`, `onChange(e)` |
 | `Checkbox` | `id`, `name`, `checked`, `required`, `disabled`, `className`, `onChange(checked)`, `children` (its label) |
 | `Select` | `id`, `name`, `value`, `options: { value, label }[]`, `disabled`, `className`, `aria-label`, `onChange(value)` |
@@ -193,6 +204,14 @@ Or draw them with your own `components` and `classNames`, and pass `unstyled`. E
 | `Alert` | `tone` (`danger`, `info`, `success`), `children`. Announce it: `role="alert"` or `role="status"` |
 | `Confirm` | A function, `({ title, body, confirmLabel, cancelLabel, danger }) => Promise<boolean>`: your own dialog before removing a member, leaving, archiving or deleting. Without it, the question shows inline |
 
+A form checks every field before it sends anything: each one wrong shows its error at once, in the order they are drawn, and the first takes the focus. `<SignUp />` draws its fields once the workspace has said what it asks (a company's name, the legal boxes), so nothing moves as they come.
+
+What Cauthy mails from these forms (a sign-in link, a new password, a confirmation) goes in the page's language (`<html lang>`). Give `<CauthyProvider locale>` your application's own instead, or a function for a person who can change it:
+
+```tsx
+<CauthyProvider locale={() => i18n.language}>
+```
+
 `texts` changes any sentence. Its keys are stable: `email`, `password`, `name`, `code`, `signIn`, `signUp`, `continueWith`, `orWithEmail`, `forgotPassword`, `noAccount`, `createAccount`, `company`, `iAccept`, `and`, `termsOfService`, `privacyPolicy`, `haveAccount`, `sendLink`, `linkSent`, `codeHelp`, `codeHelpPhone`, `codeHelpEmail`, `sendEmailAgain`, `sendCodeSms`, `sendCodeWhatsapp`, `codeSent`, `pushSend`, `pushPick`, `pushWaiting`, `phone`, `phoneHelp`, `phoneOn`, `phoneOff`, `addPhone`, `removePhone`, `bySms`, `byWhatsapp`, `channel`, `verify`, `checkEmail`, `backToSignIn`, `emailMeALink`, `usePasskey`, `codeFromMail`, `signInLinkSent`, `newPassword`, `savePassword`, `passwordChanged`, `confirming`, `emailConfirmed`, `invitedTo`, `invitedToOrganization`, `invitedAs`, `choosePassword`, `acceptInvite`, `openingInvitation`, `invitationInvalid`, `profile`, `save`, `saved`, `currentPassword`, `changePassword`, `passwordChangedHere`, `secondStep`, `secondStepOn`, `secondStepOff`, `turnOn`, `turnOff`, `addToApp`, `openInApp`, `recoveryCodes`, `newRecoveryCodes`, `keepCodes`, `passkeys`, `managePasskeys`, `passkeysHelp`, `noPasskeys`, `passkeyName`, `addPasskey` (unused), `addPasskeyDevice`, `addSecurityKey`, `passkeyKinds`, `removePasskey`, `passkeyAdded`, `passkeyUnnamed`, `sessions`, `signOutEverywhere`, `agents`, `agentsHelp`, `disconnect`, `anAgent`, `unknownDevice`, `emailAddress`, `newEmail`, `changeEmail`, `emailSent`, `linkedAccounts`, `noLinkedAccounts`, `linkWith`, `unlink`, `linked`, `ssoOnly`, `members`, `membersHidden`, `organizationMissing`, `memberYou`, `memberInvited`, `memberManager`, `memberRole`, `memberAdd`, `memberAdded`, `memberRemove`, `memberRemoveConfirm`, `memberLeave`, `memberLeaveConfirm`, `memberInviteAgain`, `memberInvitationSent`, `organization`, `organizationRename`, `organizationRenamed`, `organizationArchive`, `organizationArchiveConfirm`, `organizationArchived`, `organizationDelete`, `organizationDeleteConfirm`, `organizationDeleted`, `yes`, `cancel`, `termsChanged`, `termsChangedHelp`, `acceptTerms`, and `errors` by error code. Built in: English and Spanish (`locale`). The dashboard can start the look from your stylesheet (shadcn/ui and Tailwind, Stackmyth, or variables of your own); `npx cauthy-auth theme --css src/app/globals.css` reads it the same way from a terminal.
 
 Connect your application to Cauthy in one step, from Cauthy's dashboard ("Connect a System") or from a terminal. In the application's folder, `init` reads its framework (Next.js, TanStack Start, React Router or Remix, SvelteKit, Vite + React, Express, Hono, Fastify), makes the client, writes every variable to its env file, `CAUTHY_SECRET` included, and lays down the route and a sign-in page, never over a file that is there:
@@ -209,6 +228,8 @@ const org = await auth.system.organizations.create({ name: 'Acme' })
 await auth.system.members.add(org.id, { role: 'owner', email: 'ana@acme.com' })
 ```
 
+`members.add` only adds: a person who already belongs keeps their role, and it throws `CauthyApiError` with `code: 'member_exists'` (409). Change a role with `members.setRole`, or pass `onlyNew: false` to set the role of whoever is already there. `<OrganizationMembers />` and `organizations.add` never change a member's role either: they answer `member_exists` (the text is `errors.member_exists`).
+
 Its invitations open your `pages.acceptInvite` when the application knows its public origin (`baseURL`, `CAUTHY_BASE_URL`); otherwise Cauthy's own page.
 
 A backend that is handed a Cauthy access token checks it with Cauthy's published keys: no secret, no call per request.

package/dist/{cauthy-CKfvvv_i.d.ts → cauthy-BUozWD72.d.ts}

@@ -1,4 +1,4 @@
-import { J as JsonValue, S as Session, t as SessionStatus, s as SessionOrganization, f as CheckQuestion, k as OrganizationRef, g as CheckResult, d as CauthySystem, q as PublicSession, c as CauthyOptions } from './system-BvvoNs2y.js';
+import { J as JsonValue, S as Session, t as SessionStatus, s as SessionOrganization, f as CheckQuestion, k as OrganizationRef, g as CheckResult, d as CauthySystem, q as PublicSession, c as CauthyOptions } from './system-Bz4haPrI.js';
 import { JWTVerifyGetKey } from 'jose';
 
 /** Something that happened in Cauthy, as a subscriber is told. Moments are UTC. */

package/dist/{cauthy-2jtP2LVQ.d.mts → cauthy-C-GoRXy9.d.mts}

@@ -1,4 +1,4 @@
-import { J as JsonValue, S as Session, t as SessionStatus, s as SessionOrganization, f as CheckQuestion, k as OrganizationRef, g as CheckResult, d as CauthySystem, q as PublicSession, c as CauthyOptions } from './system-BrrJsrFW.mjs';
+import { J as JsonValue, S as Session, t as SessionStatus, s as SessionOrganization, f as CheckQuestion, k as OrganizationRef, g as CheckResult, d as CauthySystem, q as PublicSession, c as CauthyOptions } from './system-DUGV040y.mjs';
 import { JWTVerifyGetKey } from 'jose';
 
 /** Something that happened in Cauthy, as a subscriber is told. Moments are UTC. */

package/dist/cli.js

@@ -1084,7 +1084,7 @@ function createSystem(given = {}) {
         return toMember(await data(
           "POST",
           `/v1/organizations/${id(orgId)}/members`,
-          { role: m.role, user_id: m.userId, email: m.email, name: m.name, locale: m.locale, client_id: clientId },
+          { role: m.role, user_id: m.userId, email: m.email, name: m.name, locale: m.locale, client_id: clientId, only_new: m.onlyNew !== false },
           inviteHeaders
         ));
       },

package/dist/client.d.mts

@@ -1,6 +1,6 @@
 import { CauthyTheme } from './theme.mjs';
-import { q as PublicSession, f as CheckQuestion, k as OrganizationRef, g as CheckResult } from './system-BrrJsrFW.mjs';
-export { h as CheckRule } from './system-BrrJsrFW.mjs';
+import { q as PublicSession, f as CheckQuestion, k as OrganizationRef, g as CheckResult } from './system-DUGV040y.mjs';
+export { h as CheckRule } from './system-DUGV040y.mjs';
 import { A as AuthField, b as PasswordPolicy } from './validate-sEXG82po.mjs';
 export { D as DEFAULT_PASSWORD_POLICY, F as FieldProblem, M as MIN_PASSWORD, P as PasswordClass, a as PasswordLocale, c as PasswordReason, d as checkCode, e as checkEmail, f as checkName, g as checkNewPassword, h as checkPassword, i as describePasswordPolicy, j as explainPasswordProblems, p as passwordPolicyOf, k as passwordProblems } from './validate-sEXG82po.mjs';
 import 'jose';
@@ -291,7 +291,11 @@ interface OrganizationsClient {
     members(organizationId: string): Promise<OrganizationPerson[] | null>;
     /** The roles a member may be given, or null when the person may not see them. */
     roles(organizationId: string): Promise<OrganizationRoleChoice[] | null>;
-    /** Adds a person by their address; an address with no account gets one and its invitation. */
+    /**
+     * Adds a person by their address; an address with no account gets one and
+     * its invitation. It only adds: a person who already belongs keeps their
+     * role and the result is the error `member_exists` (change it with `setRole`).
+     */
     add(organizationId: string, form: {
         email: string;
         role: string;

package/dist/client.d.ts

@@ -1,6 +1,6 @@
 import { CauthyTheme } from './theme.js';
-import { q as PublicSession, f as CheckQuestion, k as OrganizationRef, g as CheckResult } from './system-BvvoNs2y.js';
-export { h as CheckRule } from './system-BvvoNs2y.js';
+import { q as PublicSession, f as CheckQuestion, k as OrganizationRef, g as CheckResult } from './system-Bz4haPrI.js';
+export { h as CheckRule } from './system-Bz4haPrI.js';
 import { A as AuthField, b as PasswordPolicy } from './validate-sEXG82po.js';
 export { D as DEFAULT_PASSWORD_POLICY, F as FieldProblem, M as MIN_PASSWORD, P as PasswordClass, a as PasswordLocale, c as PasswordReason, d as checkCode, e as checkEmail, f as checkName, g as checkNewPassword, h as checkPassword, i as describePasswordPolicy, j as explainPasswordProblems, p as passwordPolicyOf, k as passwordProblems } from './validate-sEXG82po.js';
 import 'jose';
@@ -291,7 +291,11 @@ interface OrganizationsClient {
     members(organizationId: string): Promise<OrganizationPerson[] | null>;
     /** The roles a member may be given, or null when the person may not see them. */
     roles(organizationId: string): Promise<OrganizationRoleChoice[] | null>;
-    /** Adds a person by their address; an address with no account gets one and its invitation. */
+    /**
+     * Adds a person by their address; an address with no account gets one and
+     * its invitation. It only adds: a person who already belongs keeps their
+     * role and the result is the error `member_exists` (change it with `setRole`).
+     */
     add(organizationId: string, form: {
         email: string;
         role: string;