@arcblock/did-connect-core 4.1.53 → 4.1.54

package/dist/ui/index.bundle.js

@@ -381,12 +381,19 @@ var messages = {
     emailExplanation: "We will send you a verification code. No password needed.",
     otherMethods: "Other ways to sign in",
     passkeyCreateAccount: "Create an account with Passkey",
-    lastUsed: "Last used: {method}",
+    lastUsed: "Last used",
     passkeyExplanation: "Create a new account using your fingerprint, face, or device unlock. Your device will ask you to save a Passkey. Already have an account? Go back to sign in.",
     continueWith: "Continue with {provider}",
     oauthWaiting: "Continue in the {provider} window",
     oauthIncomplete: "Sign-in is not complete. Reopen the window or choose another method.",
     oauthReopen: "Reopen window",
+    oauthUnconfirmed: "We could not confirm sign-in. Reload this page to check your session before trying again.",
+    oauthCheckSession: "Reload and check sign-in",
+    oauthCancelled: "Stopped waiting for sign-in. If the provider window is still open, close it before retrying.",
+    oauthDenied: "Authorization was declined. Try again or choose another sign-in method.",
+    oauthBlocked: "Your browser blocked the sign-in window. Reopen it or continue on this page.",
+    oauthTimedOut: "Sign-in timed out. Reopen the window to start again.",
+    oauthFailed: "We could not complete sign-in. Try again or choose another method.",
     oauthFullPage: "Continue on this page",
     emailEdit: "Change email",
     emailCooldown: "Resend in {seconds}s",
@@ -447,12 +454,19 @@ var messages = {
     emailExplanation: "\u6211\u4EEC\u4F1A\u53D1\u9001\u9A8C\u8BC1\u7801\uFF0C\u65E0\u9700\u5BC6\u7801\u3002",
     otherMethods: "\u5176\u4ED6\u767B\u5F55\u65B9\u5F0F",
     passkeyCreateAccount: "\u4F7F\u7528 Passkey \u521B\u5EFA\u8D26\u6237",
-    lastUsed: "\u4E0A\u6B21\u4F7F\u7528\uFF1A{method}",
+    lastUsed: "\u4E0A\u6B21\u4F7F\u7528",
     passkeyExplanation: "\u4F7F\u7528\u6307\u7EB9\u3001\u9762\u5BB9\u6216\u8BBE\u5907\u89E3\u9501\u65B9\u5F0F\u521B\u5EFA\u65B0\u8D26\u6237\uFF0C\u65E0\u9700\u5BC6\u7801\u3002\u8BBE\u5907\u4F1A\u63D0\u793A\u4FDD\u5B58 Passkey\u3002\u5DF2\u6709\u8D26\u6237\uFF1F\u8BF7\u8FD4\u56DE\u767B\u5F55\u3002",
     continueWith: "\u4F7F\u7528 {provider} \u7EE7\u7EED",
     oauthWaiting: "\u8BF7\u5728 {provider} \u7A97\u53E3\u4E2D\u7EE7\u7EED",
     oauthIncomplete: "\u767B\u5F55\u5C1A\u672A\u5B8C\u6210\u3002\u60A8\u53EF\u4EE5\u91CD\u65B0\u6253\u5F00\u7A97\u53E3\u6216\u9009\u62E9\u5176\u4ED6\u65B9\u5F0F\u3002",
     oauthReopen: "\u91CD\u65B0\u6253\u5F00\u7A97\u53E3",
+    oauthUnconfirmed: "\u6682\u65F6\u65E0\u6CD5\u786E\u8BA4\u767B\u5F55\u7ED3\u679C\u3002\u8BF7\u5148\u91CD\u65B0\u52A0\u8F7D\u9875\u9762\u68C0\u67E5\u767B\u5F55\u72B6\u6001\uFF0C\u518D\u51B3\u5B9A\u662F\u5426\u91CD\u8BD5\u3002",
+    oauthCheckSession: "\u91CD\u65B0\u52A0\u8F7D\u5E76\u68C0\u67E5\u767B\u5F55\u72B6\u6001",
+    oauthCancelled: "\u5DF2\u505C\u6B62\u7B49\u5F85\u767B\u5F55\u3002\u82E5\u6388\u6743\u7A97\u53E3\u4ECD\u7136\u6253\u5F00\uFF0C\u8BF7\u5173\u95ED\u540E\u518D\u91CD\u8BD5\u3002",
+    oauthDenied: "\u60A8\u672A\u540C\u610F\u6388\u6743\u3002\u53EF\u4EE5\u91CD\u8BD5\u6216\u9009\u62E9\u5176\u4ED6\u767B\u5F55\u65B9\u5F0F\u3002",
+    oauthBlocked: "\u6D4F\u89C8\u5668\u62E6\u622A\u4E86\u767B\u5F55\u7A97\u53E3\u3002\u8BF7\u91CD\u65B0\u6253\u5F00\uFF0C\u6216\u5728\u5F53\u524D\u9875\u9762\u7EE7\u7EED\u3002",
+    oauthTimedOut: "\u767B\u5F55\u7B49\u5F85\u5DF2\u8D85\u65F6\u3002\u8BF7\u91CD\u65B0\u6253\u5F00\u7A97\u53E3\u518D\u8BD5\u3002",
+    oauthFailed: "\u672A\u80FD\u5B8C\u6210\u767B\u5F55\u3002\u8BF7\u91CD\u8BD5\u6216\u9009\u62E9\u5176\u4ED6\u65B9\u5F0F\u3002",
     oauthFullPage: "\u5728\u5F53\u524D\u9875\u9762\u7EE7\u7EED",
     emailEdit: "\u4FEE\u6539\u90AE\u7BB1",
     emailCooldown: "{seconds} \u79D2\u540E\u91CD\u53D1",
@@ -513,12 +527,19 @@ var messages = {
     emailExplanation: "\u6211\u5011\u6703\u50B3\u9001\u9A57\u8B49\u78BC\uFF0C\u7121\u9700\u5BC6\u78BC\u3002",
     otherMethods: "\u5176\u4ED6\u767B\u5165\u65B9\u5F0F",
     passkeyCreateAccount: "\u4F7F\u7528 Passkey \u5EFA\u7ACB\u5E33\u6236",
-    lastUsed: "\u4E0A\u6B21\u4F7F\u7528\uFF1A{method}",
+    lastUsed: "\u4E0A\u6B21\u4F7F\u7528",
     passkeyExplanation: "\u4F7F\u7528\u6307\u7D0B\u3001\u9762\u5BB9\u6216\u88DD\u7F6E\u89E3\u9396\u65B9\u5F0F\u5EFA\u7ACB\u65B0\u5E33\u6236\uFF0C\u7121\u9700\u5BC6\u78BC\u3002\u88DD\u7F6E\u6703\u63D0\u793A\u5132\u5B58 Passkey\u3002\u5DF2\u6709\u5E33\u6236\uFF1F\u8ACB\u8FD4\u56DE\u767B\u5165\u3002",
     continueWith: "\u4F7F\u7528 {provider} \u7E7C\u7E8C",
     oauthWaiting: "\u8ACB\u5728 {provider} \u8996\u7A97\u4E2D\u7E7C\u7E8C",
     oauthIncomplete: "\u767B\u5165\u5C1A\u672A\u5B8C\u6210\u3002\u60A8\u53EF\u4EE5\u91CD\u65B0\u958B\u555F\u8996\u7A97\u6216\u9078\u64C7\u5176\u4ED6\u65B9\u5F0F\u3002",
     oauthReopen: "\u91CD\u65B0\u958B\u555F\u8996\u7A97",
+    oauthUnconfirmed: "\u66AB\u6642\u7121\u6CD5\u78BA\u8A8D\u767B\u5165\u7D50\u679C\u3002\u8ACB\u5148\u91CD\u65B0\u8F09\u5165\u9801\u9762\u6AA2\u67E5\u767B\u5165\u72C0\u614B\uFF0C\u518D\u6C7A\u5B9A\u662F\u5426\u91CD\u8A66\u3002",
+    oauthCheckSession: "\u91CD\u65B0\u8F09\u5165\u4E26\u6AA2\u67E5\u767B\u5165\u72C0\u614B",
+    oauthCancelled: "\u5DF2\u505C\u6B62\u7B49\u5F85\u767B\u5165\u3002\u82E5\u6388\u6B0A\u8996\u7A97\u4ECD\u7136\u958B\u555F\uFF0C\u8ACB\u95DC\u9589\u5F8C\u518D\u91CD\u8A66\u3002",
+    oauthDenied: "\u60A8\u672A\u540C\u610F\u6388\u6B0A\u3002\u53EF\u4EE5\u91CD\u8A66\u6216\u9078\u64C7\u5176\u4ED6\u767B\u5165\u65B9\u5F0F\u3002",
+    oauthBlocked: "\u700F\u89BD\u5668\u5C01\u9396\u4E86\u767B\u5165\u8996\u7A97\u3002\u8ACB\u91CD\u65B0\u958B\u555F\uFF0C\u6216\u5728\u76EE\u524D\u9801\u9762\u7E7C\u7E8C\u3002",
+    oauthTimedOut: "\u767B\u5165\u7B49\u5F85\u5DF2\u903E\u6642\u3002\u8ACB\u91CD\u65B0\u958B\u555F\u8996\u7A97\u518D\u8A66\u3002",
+    oauthFailed: "\u672A\u80FD\u5B8C\u6210\u767B\u5165\u3002\u8ACB\u91CD\u8A66\u6216\u9078\u64C7\u5176\u4ED6\u65B9\u5F0F\u3002",
     oauthFullPage: "\u5728\u76EE\u524D\u9801\u9762\u7E7C\u7E8C",
     emailEdit: "\u4FEE\u6539\u96FB\u5B50\u90F5\u4EF6",
     emailCooldown: "{seconds} \u79D2\u5F8C\u91CD\u65B0\u50B3\u9001",
@@ -579,12 +600,19 @@ var messages = {
     emailExplanation: "\u78BA\u8A8D\u30B3\u30FC\u30C9\u3092\u9001\u4FE1\u3057\u307E\u3059\u3002\u30D1\u30B9\u30EF\u30FC\u30C9\u306F\u4E0D\u8981\u3067\u3059\u3002",
     otherMethods: "\u4ED6\u306E\u30ED\u30B0\u30A4\u30F3\u65B9\u6CD5",
     passkeyCreateAccount: "Passkey \u3067\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u4F5C\u6210",
-    lastUsed: "\u524D\u56DE\u306E\u65B9\u6CD5\uFF1A{method}",
+    lastUsed: "\u524D\u56DE\u4F7F\u7528",
     passkeyExplanation: "\u6307\u7D0B\u3001\u9854\u8A8D\u8A3C\u3001\u307E\u305F\u306F\u30C7\u30D0\u30A4\u30B9\u306E\u30ED\u30C3\u30AF\u89E3\u9664\u3067\u65B0\u3057\u3044\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u4F5C\u6210\u3057\u307E\u3059\u3002\u30D1\u30B9\u30EF\u30FC\u30C9\u306F\u4E0D\u8981\u3067\u3059\u3002\u30C7\u30D0\u30A4\u30B9\u304C Passkey \u306E\u4FDD\u5B58\u3092\u6C42\u3081\u307E\u3059\u3002\u30A2\u30AB\u30A6\u30F3\u30C8\u3092\u304A\u6301\u3061\u3067\u3059\u304B\uFF1F\u30ED\u30B0\u30A4\u30F3\u306B\u623B\u3063\u3066\u304F\u3060\u3055\u3044\u3002",
     continueWith: "{provider} \u3067\u7D9A\u3051\u308B",
     oauthWaiting: "{provider} \u306E\u30A6\u30A3\u30F3\u30C9\u30A6\u3067\u7D9A\u3051\u3066\u304F\u3060\u3055\u3044",
     oauthIncomplete: "\u30ED\u30B0\u30A4\u30F3\u306F\u307E\u3060\u5B8C\u4E86\u3057\u3066\u3044\u307E\u305B\u3093\u3002\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u304D\u76F4\u3059\u304B\u3001\u5225\u306E\u65B9\u6CD5\u3092\u9078\u3093\u3067\u304F\u3060\u3055\u3044\u3002",
     oauthReopen: "\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u304D\u76F4\u3059",
+    oauthUnconfirmed: "\u30ED\u30B0\u30A4\u30F3\u7D50\u679C\u3092\u78BA\u8A8D\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002\u518D\u8A66\u884C\u306E\u524D\u306B\u30DA\u30FC\u30B8\u3092\u518D\u8AAD\u307F\u8FBC\u307F\u3057\u3066\u72B6\u614B\u3092\u78BA\u8A8D\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+    oauthCheckSession: "\u518D\u8AAD\u307F\u8FBC\u307F\u3057\u3066\u30ED\u30B0\u30A4\u30F3\u3092\u78BA\u8A8D",
+    oauthCancelled: "\u30ED\u30B0\u30A4\u30F3\u306E\u5F85\u6A5F\u3092\u7D42\u4E86\u3057\u307E\u3057\u305F\u3002\u8A8D\u8A3C\u30A6\u30A3\u30F3\u30C9\u30A6\u304C\u958B\u3044\u3066\u3044\u308B\u5834\u5408\u306F\u3001\u9589\u3058\u3066\u304B\u3089\u518D\u8A66\u884C\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+    oauthDenied: "\u8A8D\u8A3C\u304C\u8A31\u53EF\u3055\u308C\u307E\u305B\u3093\u3067\u3057\u305F\u3002\u518D\u8A66\u884C\u3059\u308B\u304B\u3001\u5225\u306E\u65B9\u6CD5\u3092\u9078\u3093\u3067\u304F\u3060\u3055\u3044\u3002",
+    oauthBlocked: "\u30D6\u30E9\u30A6\u30B6\u304C\u30ED\u30B0\u30A4\u30F3\u753B\u9762\u3092\u30D6\u30ED\u30C3\u30AF\u3057\u307E\u3057\u305F\u3002\u958B\u304D\u76F4\u3059\u304B\u3001\u3053\u306E\u30DA\u30FC\u30B8\u3067\u7D9A\u3051\u3066\u304F\u3060\u3055\u3044\u3002",
+    oauthTimedOut: "\u30ED\u30B0\u30A4\u30F3\u304C\u30BF\u30A4\u30E0\u30A2\u30A6\u30C8\u3057\u307E\u3057\u305F\u3002\u30A6\u30A3\u30F3\u30C9\u30A6\u3092\u958B\u304D\u76F4\u3057\u3066\u304F\u3060\u3055\u3044\u3002",
+    oauthFailed: "\u30ED\u30B0\u30A4\u30F3\u3092\u5B8C\u4E86\u3067\u304D\u307E\u305B\u3093\u3067\u3057\u305F\u3002\u518D\u8A66\u884C\u3059\u308B\u304B\u3001\u5225\u306E\u65B9\u6CD5\u3092\u9078\u3093\u3067\u304F\u3060\u3055\u3044\u3002",
     oauthFullPage: "\u3053\u306E\u30DA\u30FC\u30B8\u3067\u7D9A\u3051\u308B",
     emailEdit: "\u30E1\u30FC\u30EB\u30A2\u30C9\u30EC\u30B9\u3092\u5909\u66F4",
     emailCooldown: "{seconds} \u79D2\u5F8C\u306B\u518D\u9001\u4FE1",
@@ -2980,28 +3008,41 @@ h1 {
   border-color: var(--border-strong);
 }
 .locale-trigger svg { width: 14px; height: 14px; flex-shrink: 0; }
+/* One compact menu surface; rows are choices, not nested pill buttons. */
 .locale-menu {
-  display: none;
-  flex-direction: column;
-  align-items: stretch;
-  gap: 4px;
-  margin-top: 4px;
+  display: none; position: absolute; top: calc(100% + 6px); right: 0; z-index: 4;
+  min-width: 144px; width: max-content; max-width: min(240px,calc(100vw - 64px));
+  padding: 4px; background: var(--bg-card); border: 1px solid var(--border);
+  border-radius: 10px; box-shadow: var(--shadow-lg);
 }
-.locale-switcher.open .locale-menu {
-  display: flex;
+.locale-switcher.open .locale-menu { display: flex; flex-direction: column; }
+.locale-menu .locale-btn {
+  width: 100%; min-height: 36px; height: auto; padding: 7px 10px; gap: 8px;
+  border: 0; border-radius: 6px; background: transparent; text-align: left;
+  font-size: 13px; line-height: 1.4; overflow-wrap: anywhere;
 }
-.locale-btn[aria-checked="true"] {
-  color: var(--text);
-  border-color: var(--border-strong);
-}
-.locale-check { font-size: 11px; line-height: 1; }
+.locale-menu .locale-btn:hover, .locale-menu .locale-btn:focus-visible { background: var(--bg-hover); color: var(--text); }
+.locale-menu .locale-btn[aria-checked="true"] { color: var(--text); font-weight: 600; }
+.locale-check { width: 14px; flex: 0 0 14px; font-size: 12px; line-height: 1; }
+@media (pointer: coarse) { .locale-menu .locale-btn { min-height: 44px; } }
+.has-last-used { flex-wrap: wrap; }
+.last-used { display: inline-block; font-size: 11px; font-weight: 400; line-height: 1.4;
+  padding: 2px 6px; border: 1px solid currentColor; border-radius: 4px; opacity: .72; white-space: nowrap; }
 .card { position: relative; }
 
 /* Long localized method labels remain readable on narrow screens. */
 .methods-grid { grid-template-columns: 1fr; }
 .method-btn { min-height: 48px; white-space: normal; }
 .passkey-alt { min-height: 44px; font-weight: 600; }
-.oauth-recovery { font-size: 14px; line-height: 1.5; margin: 12px 0; }
+.oauth-recovery { font-size: 14px; line-height: 1.5; margin: 12px 0; padding: 12px;
+  border: 1px solid var(--border); border-radius: var(--radius); color: var(--text-secondary); text-align: left; }
+.oauth-recovery p { margin: 0 0 8px; overflow-wrap: anywhere; }
+.oauth-recovery-actions { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
+.oauth-recovery-actions button, .oauth-recovery-actions a { font: inherit; font-size: 13px; min-height: 44px;
+  display: inline-flex; align-items: center; padding: 4px 0; color: var(--text); border: 0; background: none; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
+.oauth-recovery-actions[hidden], .oauth-recovery-actions [hidden] { display: none; }
+.oauth-recovery-actions :focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
+
 @media (max-width: 480px) { .card { padding: 24px 20px; width: 100%; box-sizing: border-box; } h1 { font-size: 24px; } }
 
 .passkey-create-entry { display: flex; justify-content: center; align-items: center; width: 100%; box-sizing: border-box; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-surface); color: var(--text); padding: 10px 14px; }
@@ -3014,11 +3055,7 @@ h1 {
 .card-modal .locale-switcher { min-width: 0; max-width: 100%; }
 .card-modal .locale-trigger { max-width: 100%; height: 36px; }
 .locale-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.card-modal .locale-menu { position: absolute; top: calc(100% + 8px); left: 0; z-index: 4; margin-top: 0;
-  width: max-content; max-width: min(260px,calc(100vw - 80px)); padding: 6px;
-  background: var(--bg-card); border: 1px solid var(--border-strong); border-radius: 10px; box-shadow: var(--shadow-lg); }
-.card-modal .locale-menu .locale-btn { min-height: 40px; height: auto; text-align: left; border-radius: 6px; }
-.card-modal .locale-menu .locale-btn span { overflow-wrap: anywhere; }
+.card-modal .locale-menu { left: 0; right: auto; }
 
 .card { padding: 52px 24px 24px; box-sizing: border-box; }
 .card-modal { width: 100%; }
@@ -3027,7 +3064,13 @@ h1 {
 .card.card-modal, :host([data-theme="light"]) .card.card-modal { box-shadow: none; }
 /* A translateY entrance expands an auto scroller by 4px until it finishes. */
 .card-modal[data-view] { animation: none; }
-.card-modal .back-btn { position: static; display: flex; width: max-content; max-width: 100%; margin: 0 0 16px; }
+/* Sub-step navigation shares the close button's center line in both modes. */
+.back-btn { top: 8px; left: 24px; height: 44px; max-width: calc(100% - 160px); line-height: 1.4; text-align: left; }
+.back-btn:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; border-radius: 4px; }
+.card-modal .back-btn { position: absolute; top: 8px; left: 24px; margin: 0; }
+.card-modal:has(.back-btn) .card-tools { left: auto; right: 64px; max-width: calc(100% - 160px); }
+.passkey-creating > .home-link { display: none; }
+@media (max-width:480px) { .back-btn, .card-modal .back-btn { left: 18px; } }
 .card-modal h1 { display: block; overflow: visible; -webkit-line-clamp: unset; line-clamp: unset; line-height: 1.4; padding-block: 2px; }
 .card-modal h1[tabindex="-1"]:focus { outline: none; }
 .card-modal h1, .card-modal h2, .card-modal .subtitle, .card-modal .status { overflow-wrap: anywhere; }
@@ -3474,6 +3517,8 @@ var LoginPage = class {
   }
   /** Locale sits on the card's top-right row, level with Back / Cancel. */
   renderCardTools(card) {
+    if (!(this.options.showLocaleSelector ?? this.options.mode !== "dialog"))
+      return;
     const tools = document.createElement("div");
     tools.className = "card-tools";
     this.renderLocaleSwitcher(tools);
@@ -3531,6 +3576,8 @@ var LoginPage = class {
     trigger.addEventListener("click", (event) => {
       event.stopPropagation();
       setOpen(menu.hidden);
+      if (!menu.hidden)
+        menu.querySelector('[aria-checked="true"]')?.focus();
     });
     for (const item of locales) {
       const checked = item.code === current.code;
@@ -3540,12 +3587,13 @@ var LoginPage = class {
       btn.setAttribute("role", "menuitemradio");
       btn.setAttribute("aria-checked", checked ? "true" : "false");
       btn.dataset.locale = item.code;
+      btn.tabIndex = -1;
       btn.title = item.label;
-      if (checked) {
+      {
         const mark = document.createElement("span");
         mark.className = "locale-check";
         mark.setAttribute("aria-hidden", "true");
-        mark.textContent = "\u2713";
+        mark.textContent = checked ? "\u2713" : "";
         btn.appendChild(mark);
       }
       const label = document.createElement("span");
@@ -3557,6 +3605,24 @@ var LoginPage = class {
       });
       menu.appendChild(btn);
     }
+    wrapper.addEventListener("keydown", (event) => {
+      const items = [...menu.querySelectorAll(".locale-btn")];
+      const active = this.shadow?.activeElement ?? document.activeElement;
+      const index = items.indexOf(active);
+      if (event.key === "Escape") {
+        event.preventDefault();
+        event.stopPropagation();
+        setOpen(false);
+        trigger.focus();
+      } else if (event.key === "Tab")
+        setOpen(false);
+      else if (["ArrowDown", "ArrowUp", "Home", "End"].includes(event.key)) {
+        event.preventDefault();
+        setOpen(true);
+        const next = event.key === "Home" ? 0 : event.key === "End" ? items.length - 1 : index < 0 ? event.key === "ArrowUp" ? items.length - 1 : 0 : (index + (event.key === "ArrowUp" ? -1 : 1) + items.length) % items.length;
+        items[next]?.focus();
+      }
+    });
     const onOutsideClick = (event) => {
       const path = event.composedPath();
       if (path.includes(wrapper))
@@ -3607,25 +3673,25 @@ var LoginPage = class {
         break;
     }
   }
+  /** Keep recognition next to the action, without a second page subtitle. */
+  markLastUsed(button, method, locale) {
+    if (!this.options.preferenceKey)
+      return;
+    try {
+      if (localStorage.getItem(`did-login-method:${this.options.preferenceKey}`) !== method)
+        return;
+      const hint = document.createElement("span");
+      hint.className = "last-used";
+      hint.textContent = t("lastUsed", locale);
+      button.classList.add("has-last-used");
+      button.appendChild(hint);
+    } catch {
+    }
+  }
   renderMethodsView(card, locale, methods) {
     if (this.options.mode !== "dialog")
       this.renderHomeLink(card, locale);
     this.renderBrandHeader(card, locale);
-    if (this.options.preferenceKey) {
-      try {
-        const last = localStorage.getItem(`did-login-method:${this.options.preferenceKey}`);
-        const labels = { passkey: "Passkey", oauth: "OAuth", email: t("emailButton", locale), "did-connect": "DID Wallet" };
-        const provider = last?.startsWith("oauth:") ? this.options.oauthProviders?.find((p) => p.enabled && `oauth:${p.id}` === last) : void 0;
-        const label = provider?.name ?? (last ? labels[last] : void 0);
-        if (last && label && (methods.includes(last) || provider && methods.includes("oauth"))) {
-          const hint = document.createElement("p");
-          hint.className = "subtitle";
-          hint.textContent = t("lastUsed", locale, { method: label });
-          card.appendChild(hint);
-        }
-      } catch {
-      }
-    }
     const requestedPasskey = this.options.methods.includes("passkey");
     if (requestedPasskey && !methods.includes("passkey")) {
       const warn = document.createElement("div");
@@ -3895,11 +3961,12 @@ var LoginPage = class {
       }
     });
   }
-  renderBackButton(parent, locale) {
+  renderBackButton(parent, locale, onBack = () => this.switchView("methods")) {
     const btn = document.createElement("button");
+    btn.type = "button";
     btn.className = "back-btn";
     btn.innerHTML = `${ICON_BACK_ARROW} ${escapeHtml(t("back", locale))}`;
-    btn.addEventListener("click", () => this.switchView("methods"));
+    btn.addEventListener("click", onBack);
     parent.appendChild(btn);
   }
   /**
@@ -4107,11 +4174,8 @@ var LoginPage = class {
       createBtn.id = "passkey-btn";
       createBtn.innerHTML = `${ICON_PASSKEY} ${escapeHtml(t("passkeyCreate", locale))}`;
       section.appendChild(createBtn);
-      const backLink = document.createElement("button");
-      backLink.type = "button";
-      backLink.className = "passkey-alt";
-      backLink.textContent = t("passkeyBackToSignIn", locale);
-      section.appendChild(backLink);
+      parent.querySelector(".back-btn")?.remove();
+      this.renderBackButton(parent, locale, () => renderSignInState());
       const doCreate = async () => {
         if (createBtn.disabled)
           return;
@@ -4141,7 +4205,6 @@ var LoginPage = class {
         if (e.key === "Enter")
           doCreate();
       });
-      backLink.addEventListener("click", () => renderSignInState());
       createBtn.focus();
     };
     const doSignIn = async () => {
@@ -4176,6 +4239,7 @@ var LoginPage = class {
     };
     const renderSignInState = () => {
       this.cardEl?.classList.remove("passkey-creating");
+      parent.querySelector(".back-btn")?.remove();
       this.abort?.abort();
       this.generation++;
       const heading = this.cardEl?.querySelector("h1");
@@ -4187,6 +4251,7 @@ var LoginPage = class {
       signInBtn.className = this.cardEl?.classList.contains("social-first") ? "btn btn-secondary" : "btn";
       signInBtn.id = "passkey-btn";
       signInBtn.innerHTML = `${ICON_PASSKEY} ${escapeHtml(t("passkeySignIn", locale))}`;
+      this.markLastUsed(signInBtn, "passkey", locale);
       section.appendChild(signInBtn);
       signInBtn.addEventListener("click", () => doSignIn());
       const createLink = document.createElement("button");
@@ -4208,159 +4273,240 @@ var LoginPage = class {
   startOAuthPopup(providerId, btn) {
     this.oauthCleanup?.();
     const epoch = this.generation;
+    const locale = this.options.locale;
     const servicePrefix = this.config.servicePrefix ?? "/.well-known/service";
     const oauthBase = this.options.masterOAuthOrigin ? `${this.options.masterOAuthOrigin}${servicePrefix}` : servicePrefix;
     const oauthOrigin = new URL(oauthBase, window.location.href).origin;
-    const loginUrl = `${oauthBase}/api/oauth/${encodeURIComponent(providerId)}/login?returnUrl=${encodeURIComponent(window.location.href)}`;
-    const width = 500;
-    const height = 620;
-    const left = window.screenX + (window.innerWidth - width) / 2;
-    const top = window.screenY + (window.innerHeight - height) / 2;
-    const popup = window.open(loginUrl, "oauth-login:popup", `left=${left},top=${top},width=${width},height=${height},resizable,scrollbars=yes,status=1,popup`);
-    if (!popup) {
-      this.options.onBeforeRedirect?.();
-      window.location.href = loginUrl;
-      return;
+    let returnUrl = window.location.href;
+    if (this.options.mode !== "dialog" && window.location.pathname === `${servicePrefix}/login`) {
+      const requested = new URLSearchParams(window.location.search).get("return_to");
+      try {
+        const target = new URL(requested || "/", window.location.origin);
+        returnUrl = target.origin === window.location.origin && !/^\/[/\\]/.test(target.pathname) ? target.href : `${window.location.origin}/`;
+      } catch {
+        returnUrl = `${window.location.origin}/`;
+      }
     }
+    const loginUrl = `${oauthBase}/api/oauth/${encodeURIComponent(providerId)}/login?returnUrl=${encodeURIComponent(returnUrl)}`;
+    const provider = this.options.oauthProviders?.find((p) => p.id === providerId)?.name ?? providerId;
     const originalHTML = btn.innerHTML;
-    btn.textContent = t("oauthWaiting", this.options.locale, { provider: this.options.oauthProviders?.find((p) => p.id === providerId)?.name ?? providerId });
-    btn.disabled = true;
-    btn.classList.add("oauth-btn-loading");
+    let popup = null;
+    let settled = false;
+    let exchanging = false;
+    let probing = false;
+    let pollTimer;
+    let sessionTimer;
+    let abandonTimer;
+    const current = () => !settled && this.mounted && epoch === this.generation;
+    const locked = [];
+    const lockMethods = () => {
+      for (const button of this.cardEl?.querySelectorAll(".method-btn, .passkey-create-entry, #passkey-btn, .locale-trigger, .locale-btn") ?? []) {
+        locked.push({ button, disabled: button.disabled });
+        button.disabled = true;
+      }
+    };
     const recovery = document.createElement("div");
     recovery.className = "oauth-recovery";
     recovery.setAttribute("role", "status");
     const hint = document.createElement("p");
-    hint.textContent = t("oauthIncomplete", this.options.locale);
+    const actions = document.createElement("div");
+    actions.className = "oauth-recovery-actions";
+    const reopen = document.createElement("button");
+    reopen.type = "button";
+    reopen.className = "oauth-retry";
+    reopen.textContent = t("oauthReopen", locale);
+    reopen.hidden = true;
+    reopen.onclick = () => {
+      this.select("oauth");
+      this.activeProvider = providerId;
+      this.startOAuthPopup(providerId, btn);
+    };
     const fullPage = document.createElement("a");
     fullPage.href = loginUrl;
-    fullPage.textContent = t("oauthFullPage", this.options.locale);
-    fullPage.addEventListener("click", () => {
+    fullPage.textContent = t("oauthFullPage", locale);
+    fullPage.addEventListener("click", (event) => {
+      const reconcile = recovery.dataset.state === "oauthUnconfirmed";
+      if (exchanging && !settled) {
+        event.preventDefault();
+        return;
+      }
+      if (reconcile)
+        event.preventDefault();
       this.options.onBeforeRedirect?.();
       this.oauthCleanup?.();
+      if (reconcile)
+        window.location.reload();
     });
-    recovery.append(hint, fullPage);
-    recovery.hidden = true;
+    const cancel = document.createElement("button");
+    cancel.type = "button";
+    cancel.className = "oauth-cancel";
+    cancel.textContent = t("cancel", locale);
+    actions.append(reopen, fullPage, cancel);
+    recovery.append(hint, actions);
     btn.parentElement?.after(recovery);
-    const restore = () => {
-      recovery.hidden = false;
-      this.emit("incomplete");
+    const restoreButton = () => {
       btn.innerHTML = originalHTML;
       btn.disabled = false;
       btn.classList.remove("oauth-btn-loading");
     };
-    let settled = false;
-    let sessionPollTimer;
+    const closePopup = () => {
+      try {
+        popup?.close();
+      } catch {
+      }
+    };
+    const cleanup = () => {
+      settled = true;
+      clearInterval(pollTimer);
+      clearInterval(sessionTimer);
+      clearTimeout(abandonTimer);
+      window.removeEventListener("message", onMessage);
+      for (const item of locked.splice(0))
+        item.button.disabled = item.disabled;
+      restoreButton();
+    };
+    const showRecovery = (key) => {
+      hint.textContent = t(key, locale, { provider });
+      recovery.dataset.state = key;
+      actions.hidden = false;
+      reopen.hidden = false;
+      cancel.hidden = true;
+      restoreButton();
+    };
+    const fail = (key) => {
+      if (!current())
+        return;
+      cleanup();
+      closePopup();
+      showRecovery(key);
+      this.emit("incomplete");
+    };
     const succeed = () => {
-      if (settled || !this.mounted || epoch !== this.generation)
+      if (!current())
         return;
-      settled = true;
       cleanup();
-      btn.textContent = t("success", this.options.locale);
+      closePopup();
+      recovery.remove();
+      btn.textContent = t("success", locale);
+      btn.disabled = true;
       this.handleSuccess();
     };
-    const onMessage = async (event) => {
-      if (event.origin !== oauthOrigin || event.source !== popup)
+    cancel.onclick = () => {
+      if (exchanging)
         return;
-      if (!event.data || event.data.type !== "authorization_response")
+      fail("oauthCancelled");
+      btn.focus();
+    };
+    const onMessage = async (event) => {
+      if (event.origin !== oauthOrigin || event.source !== popup || !popup)
         return;
-      if (settled || !this.mounted || epoch !== this.generation)
+      if (!event.data || event.data.type !== "authorization_response" || !current() || exchanging)
         return;
-      if (pollTimer !== void 0) {
-        clearInterval(pollTimer);
-        pollTimer = void 0;
-      }
-      try {
-        popup.close();
-      } catch {
-      }
+      clearInterval(pollTimer);
+      clearInterval(sessionTimer);
       if (event.data.error) {
-        restore();
-        cleanup();
+        fail(event.data.error === "access_denied" ? "oauthDenied" : event.data.error === "cancelled" ? "oauthCancelled" : "oauthFailed");
         return;
       }
       const { code, state } = event.data.response ?? event.data;
-      if (!code) {
-        restore();
-        cleanup();
+      if (typeof code !== "string" || !code || typeof state !== "string" || !state) {
+        fail("oauthFailed");
         return;
       }
-      btn.textContent = t("verifying", this.options.locale);
+      exchanging = true;
+      lockMethods();
+      actions.hidden = true;
+      closePopup();
+      hint.textContent = t("verifying", locale);
+      btn.textContent = t("verifying", locale);
       btn.disabled = true;
       try {
         const oauthBody = { provider: providerId, code, state };
         if (this.options.invitationId)
           oauthBody.invitationId = this.options.invitationId;
-        await this.http.post(`${servicePrefix}/api/oauth/login`, oauthBody);
+        await this.http.post(`${servicePrefix}/api/oauth/login`, oauthBody, { signal: this.abort?.signal });
         succeed();
-      } catch (oauthErr) {
-        if (settled || !this.mounted || epoch !== this.generation)
+      } catch (err) {
+        if (!current())
           return;
-        const errMsg = oauthErr instanceof Error ? oauthErr.message : "";
-        const errCode = oauthErr instanceof Error && "code" in oauthErr ? oauthErr.code : "";
-        if (errCode === "FORBIDDEN" || errMsg === "registration_closed" || errCode === "registration_closed") {
-          settled = true;
+        const code2 = err instanceof Error && "code" in err ? String(err.code) : "";
+        const message = err instanceof Error ? err.message : "";
+        if (code2 === "FORBIDDEN" || code2 === "registration_closed" || message === "registration_closed") {
           cleanup();
-          this.showFullError(friendlyError(oauthErr, this.options.locale));
-        } else {
-          restore();
-        }
+          recovery.remove();
+          this.showFullError(friendlyError(err, locale));
+        } else
+          fail("oauthFailed");
       }
     };
-    let pollTimer = setInterval(() => {
+    this.oauthCleanup = () => {
+      cleanup();
+      recovery.remove();
+      closePopup();
+    };
+    window.addEventListener("message", onMessage);
+    try {
+      popup = window.open(loginUrl, "oauth-login:popup", `left=${window.screenX + (window.innerWidth - 500) / 2},top=${window.screenY + (window.innerHeight - 620) / 2},width=500,height=620,resizable,scrollbars=yes,status=1,popup`);
+    } catch {
+    }
+    if (!popup) {
+      fail("oauthBlocked");
+      return;
+    }
+    hint.textContent = t("oauthWaiting", locale, { provider });
+    btn.textContent = t("oauthWaiting", locale, { provider });
+    btn.disabled = true;
+    btn.classList.add("oauth-btn-loading");
+    const checkSession = async () => {
+      if (!current() || exchanging || probing)
+        return;
+      probing = true;
+      try {
+        const session = await this.http.get(`${servicePrefix}/api/did/session`);
+        if (current() && !exchanging && session?.authenticated === true)
+          succeed();
+      } catch {
+      } finally {
+        probing = false;
+      }
+    };
+    pollTimer = setInterval(() => {
       let closed = false;
       try {
-        closed = popup.closed;
+        closed = !!popup?.closed;
       } catch {
         return;
       }
-      if (!closed)
+      if (!closed || !current())
         return;
-      if (pollTimer !== void 0) {
-        clearInterval(pollTimer);
-        pollTimer = void 0;
-      }
-      restore();
-      const checkSession = () => {
-        void this.http.get(`${servicePrefix}/api/did/session`).then((session) => {
-          if (session?.authenticated)
-            succeed();
-        }).catch(() => {
-        });
-      };
-      checkSession();
-      sessionPollTimer = setInterval(checkSession, 500);
+      clearInterval(pollTimer);
+      showRecovery("oauthIncomplete");
+      cancel.hidden = false;
+      void checkSession();
+      sessionTimer = setInterval(() => {
+        void checkSession();
+      }, 2e3);
     }, 500);
-    const abandonTimer = setTimeout(() => {
-      if (settled)
+    abandonTimer = setTimeout(() => {
+      if (!current())
+        return;
+      if (!exchanging) {
+        fail("oauthTimedOut");
         return;
-      cleanup();
-      restore();
-    }, 5 * 60 * 1e3);
-    const cleanup = () => {
-      settled = true;
-      btn.innerHTML = originalHTML;
-      btn.disabled = false;
-      btn.classList.remove("oauth-btn-loading");
-      if (pollTimer !== void 0) {
-        clearInterval(pollTimer);
-        pollTimer = void 0;
-      }
-      if (sessionPollTimer !== void 0) {
-        clearInterval(sessionPollTimer);
-        sessionPollTimer = void 0;
       }
-      clearTimeout(abandonTimer);
-      window.removeEventListener("message", onMessage);
-    };
-    this.oauthCleanup = () => {
+      this.abort?.abort();
       cleanup();
-      recovery.remove();
-      try {
-        popup.close();
-      } catch {
-      }
-    };
-    window.addEventListener("message", onMessage);
+      closePopup();
+      lockMethods();
+      hint.textContent = t("oauthUnconfirmed", locale);
+      recovery.dataset.state = "oauthUnconfirmed";
+      actions.hidden = false;
+      reopen.hidden = true;
+      cancel.hidden = true;
+      fullPage.href = window.location.href;
+      fullPage.textContent = t("oauthCheckSession", locale);
+      this.emit("incomplete");
+    }, 5 * 60 * 1e3);
   }
   // (removed dead code: renderEmailButton — email now renders through renderSecondaryGrid)
   /**
@@ -4383,6 +4529,7 @@ var LoginPage = class {
         btn.dataset.provider = provider.id;
         const icon = getOAuthIcon(provider.id);
         btn.innerHTML = `${icon} ${escapeHtml(t("continueWith", locale, { provider: provider.name }))}`;
+        this.markLastUsed(btn, `oauth:${provider.id}`, locale);
         grid.appendChild(btn);
         btn.addEventListener("click", () => {
           this.select("oauth");
@@ -4396,6 +4543,7 @@ var LoginPage = class {
       btn.className = "method-btn";
       btn.id = "email-btn";
       btn.innerHTML = `${ICON_EMAIL} ${escapeHtml(t("emailButton", locale))}`;
+      this.markLastUsed(btn, "email", locale);
       grid.appendChild(btn);
       btn.addEventListener("click", () => {
         this.select("email");
@@ -4408,6 +4556,7 @@ var LoginPage = class {
       btn.id = "did-wallet-btn";
       const walletLabel = grid.children.length > 0 ? t("didWalletButtonShort", locale) : t("didWalletButton", locale);
       btn.innerHTML = `${ICON_DID_WALLET} ${escapeHtml(walletLabel)}`;
+      this.markLastUsed(btn, "did-connect", locale);
       grid.appendChild(btn);
       btn.addEventListener("click", () => {
         this.select("did-connect");
@@ -4710,6 +4859,9 @@ var LoginDialog = class {
   mount() {
     if (this.dialog)
       return;
+    const hostLocale = document.documentElement.lang;
+    if (hostLocale)
+      this.options.locale = hostLocale;
     let focused = document.activeElement;
     while (focused?.shadowRoot?.activeElement)
       focused = focused.shadowRoot.activeElement;