cauthy-auth 0.35.1 → 0.36.0

package/README.md

@@ -63,6 +63,8 @@ const { invitation, acceptInvitation } = useAuth()               // or with your
 
 The forms follow what the workspace turned on in Cauthy's dashboard: each provider's button carries its logo (`classNames.providerIcon` styles it), and a workspace that turned off the password or passkeys does not see them offered. `methods()` says so: `passwordSignIn`, `passkey`, `providers[].iconUrl`.
 
+`<SignIn />` puts the quick ways in first: a passkey, each provider, then "Email me a sign-in link", which opens its own short step (the address typed so far, "Send me the link", "Back"). Then "or with your email", the address and password, and the primary "Sign in". Without the password, the address below the "or" asks for the sign-in link itself.
+
 And the person's account, in your application: name, password, second step, sessions.
 
 ```tsx
@@ -220,7 +222,7 @@ What Cauthy mails from these forms (a sign-in link, a new password, a confirmati
 <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`, `loading`, `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.
+`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`, `linkHelp`, `sendMeTheLink`, `back`, `usePasskey`, `codeFromMail`, `signInLinkSent`, `newPassword`, `savePassword`, `passwordChanged`, `confirming`, `loading`, `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:
 

package/dist/react.d.mts

@@ -1190,6 +1190,10 @@ interface AuthTexts {
     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;

package/dist/react.d.ts

@@ -1190,6 +1190,10 @@ interface AuthTexts {
     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;

package/dist/react.js

@@ -816,6 +816,9 @@ var TEXTS = {
     checkEmail: "Almost there: open the link we sent to confirm your address \u2014 it signs you in.",
     backToSignIn: "Back to sign in",
     emailMeALink: "Email me a sign-in link",
+    linkHelp: "We will email you a link that signs you in, no password needed.",
+    sendMeTheLink: "Send me the link",
+    back: "Back",
     usePasskey: "Sign in with a passkey",
     codeFromMail: "Reading it on another device? Enter the code from the email.",
     signInLinkSent: "If that address has an account, a link to sign in is on its way.",
@@ -997,6 +1000,9 @@ var TEXTS = {
     checkEmail: "Casi listo: abre el enlace que te enviamos para confirmar tu correo; te deja adentro.",
     backToSignIn: "Volver a entrar",
     emailMeALink: "Env\xEDame un enlace para entrar",
+    linkHelp: "Te enviamos un enlace al correo que te deja entrar, sin contrase\xF1a.",
+    sendMeTheLink: "Env\xEDame el enlace",
+    back: "Volver",
     usePasskey: "Entrar con una llave de acceso",
     codeFromMail: "\xBFLo est\xE1s leyendo en otro dispositivo? Escribe el c\xF3digo que trae el correo.",
     signInLinkSent: "Si ese correo tiene una cuenta, ya va en camino un enlace para entrar.",
@@ -1692,9 +1698,14 @@ function SignIn(props) {
       f.setError(null);
       return toCompany();
     }
+    if (step === "link") {
+      if (company?.enforced) return toCompany();
+      if (f.check(checkEmail(email))) return sendLink();
+      return;
+    }
     if (step === "password" && !passwordOn) {
       if (company) return toCompany();
-      if (methods?.magicLink) return sendLink();
+      if (methods?.magicLink && f.check(checkEmail(email))) return sendLink();
       return;
     }
     if (step === "password" && !f.check(checkEmail(email), checkPassword(password))) return;
@@ -1735,6 +1746,11 @@ function SignIn(props) {
     if (!r.ok) return f.setError(r.error);
     setStep("sent");
   };
+  const openLink = () => {
+    autofill.current?.abort();
+    f.setError(null);
+    setStep("link");
+  };
   const general = f.error && !f.error.field ? f.error : null;
   const asksEmail = offers.email;
   if (step === "opening") return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Wrap, { f, as: "div", slot: "form", root: f.root, busy: true });
@@ -1748,11 +1764,27 @@ function SignIn(props) {
     ] });
   }
   if (step === "code") return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SecondStepForm, { f, auth });
+  if (step === "link") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrap, { f, as: "form", slot: "form", root: f.root, onSubmit: submit, noValidate: true, children: [
+      general && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Say, { f, tone: "danger", children: f.say(general) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Note, { f, children: f.t.linkHelp }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Field, { f, name: "email", type: "email", label: f.t.email, value: email, autoComplete: "username", required: true, onChange: setEmail }),
+      challenge.node,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "submit", variant: "primary", loading: f.loading("link"), disabled: f.busy, className: f.cx("button"), children: f.t.sendMeTheLink }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "button", variant: "secondary", disabled: f.busy, className: f.cx("providerButton"), onClick: () => {
+        f.setError(null);
+        setStep("password");
+      }, children: f.t.back })
+    ] });
+  }
+  const quickLink = methods?.magicLink === true && passwordOn;
+  const quick = offers.passkey || (methods?.providers.length ?? 0) > 0 || quickLink;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrap, { f, as: "form", slot: "form", root: f.root, onSubmit: submit, noValidate: true, children: [
     general && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Say, { f, tone: "danger", children: f.say(general) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ProviderButtons, { f, providers: methods?.providers ?? [], onPick: (id) => auth.signIn.social(id, { returnTo: props.returnTo }) }),
     offers.passkey && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "button", variant: "secondary", loading: f.loading("passkey"), disabled: f.busy, className: f.cx("providerButton"), onClick: () => void usePasskey(), children: f.t.usePasskey }),
-    asksEmail && ((methods?.providers.length ?? 0) > 0 || offers.passkey) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Or, { f, children: f.t.orWithEmail }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ProviderButtons, { f, providers: methods?.providers ?? [], onPick: (id) => auth.signIn.social(id, { returnTo: props.returnTo }) }),
+    quickLink && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "button", variant: "secondary", disabled: f.busy, className: f.cx("providerButton"), onClick: openLink, children: f.t.emailMeALink }),
+    asksEmail && quick && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Or, { f, children: f.t.orWithEmail }),
     asksEmail && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Field, { f, name: "email", type: "email", label: f.t.email, value: email, autoComplete: methods?.passkeyHere ? "username webauthn" : "username", required: true, onChange: setEmail }),
     company && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(f.Button, { type: "button", variant: company.enforced ? "primary" : "secondary", loading: f.loading("sso"), disabled: f.busy, className: f.cx(company.enforced ? "button" : "providerButton"), onClick: toCompany, children: [
       f.t.continueWith,
@@ -1778,8 +1810,10 @@ function SignIn(props) {
       challenge.node,
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "submit", variant: "primary", loading: f.loading(), disabled: f.busy, className: f.cx("button"), children: f.t.signIn })
     ] }),
-    !company?.enforced && !passwordOn && methods?.magicLink && challenge.node,
-    methods?.magicLink && !company?.enforced && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "button", variant: "secondary", loading: f.loading("link"), disabled: f.busy, className: f.cx("providerButton"), onClick: () => void sendLink(), children: f.t.emailMeALink }),
+    !company?.enforced && !passwordOn && methods?.magicLink && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      challenge.node,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(f.Button, { type: "submit", variant: "primary", loading: f.loading("link"), disabled: f.busy, className: f.cx("button"), children: f.t.sendMeTheLink })
+    ] }),
     methods?.signUp !== false && props.links?.signUp && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Note, { f, footer: true, children: [
       f.t.noAccount,
       " ",