src/auth/flow-view.test.ts

@@ -113,6 +113,7 @@ test("the code field guards a pasted space: one-time-code autofill + numeric inp
   );
   assert.deepEqual(view.fields.find((f) => f.name === "code"), {
     autocomplete: "one-time-code", // Kratos sends none for the OTP node — enable OS/email autofill
+    hint: "Digits only — no spaces.", // the pattern refusal alone reads as a bare "match the requested format"
     icon: "i-shield",
     id: "field-code",
     inputmode: "numeric",

src/auth/flow-view.ts

@@ -11,6 +11,7 @@ import type { Flow, FlowType, UiNode } from "./kratos-public.ts";
 export interface FlowField {
   autocomplete?: string;
   error?: { text: string };
+  hint?: string; // muted helper text under the input
   icon?: string; // Lucide sprite id for the input
   id: string;
   inputmode?: string; // virtual-keyboard hint (e.g. "numeric" for the OTP code)
@@ -139,7 +140,7 @@ function toField(node: UiNode, name: string, type: string, t: Translate): FlowFi
     ...(autocomplete ? { autocomplete } : {}),
     ...(errorMsg ? { error: { text: kratosText(t, errorMsg.text, idKey(errorMsg.id)) } } : {}),
     ...(icon ? { icon } : {}),
-    ...(isCode ? { inputmode: "numeric", pattern: "[0-9]*" } : {}),
+    ...(isCode ? { hint: t("auth.field.code.hint"), inputmode: "numeric", pattern: "[0-9]*" } : {}),
     ...(node.attributes["required"] === true ? { required: true } : {}),
     ...(value ? { value } : {}),
   };

src/i18n/locales/en-US.ts

@@ -9,6 +9,7 @@ const messages = {
   "auth.continue": "Continue",
   // Kratos labels its own form fields; these translate the ones the built-in identity schema uses,
   // keyed on the input name. A deployment's extra traits keep Kratos' label until a plugin covers them.
+  "auth.field.code.hint": "Digits only — no spaces.",
   "auth.field.email": "Email",
   "auth.field.identifier": "Email",
   "auth.field.password": "Password",

src/i18n/locales/sv-SE.ts

@@ -2,6 +2,7 @@ import type { CoreMessages } from "./en-US.ts";
 
 const messages: CoreMessages = {
   "auth.continue": "Fortsätt",
+  "auth.field.code.hint": "Endast siffror — inga mellanslag.",
   "auth.field.email": "E-postadress",
   "auth.field.identifier": "E-postadress",
   "auth.field.password": "Lösenord",