fix(ui): seed QRs use the SeedQR standard so hardware wallets can scan them

Plain-text seed QRs didn't scan into Passport Prime — wallets that
import seeds by QR (Passport, SeedSigner, Keystone, Nunchuk, Sparrow)
expect the SeedQR standard: each BIP39 word as its zero-padded 4-digit
wordlist index, concatenated into a numeric QR.

- new utils/seedqr.ts encodes BIP39 words per the SeedSigner spec
  (@scure/bip39 wordlist; vector-checked abandon=0000, zoo=2047)
- new shared SeedRevealPanel (Words/QR tabs, tap-to-reveal blur) now
  backs the LND reveal AND the Settings→Backup recovery-phrase reveal,
  so every current and future seed reveal behaves the same
- onboarding seed + Settings reveal: QR defaults to SeedQR with a
  plain-text toggle
- LND seed stays plain-text-only with an explicit note: aezeed is not
  BIP39 and only restores into LND-based wallets (Zeus/Blixt/another
  node) — SeedQR-encoding it would just mislead

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

neode-ui/src/views/OnboardingSeedGenerate.vue

@@ -69,9 +69,21 @@
 
             <div v-else class="flex flex-col items-center gap-2 py-2">
               <canvas ref="seedQrCanvas" class="rounded-lg bg-white p-2"></canvas>
+              <div class="flex p-0.5 bg-white/5 rounded-md">
+                <button
+                  v-for="f in ([{ key: 'seedqr', label: 'SeedQR' }, { key: 'text', label: 'Plain text' }] as const)"
+                  :key="f.key"
+                  type="button"
+                  @click="qrFormat = f.key"
+                  class="px-2.5 py-1 rounded text-[11px] font-medium transition-colors"
+                  :class="qrFormat === f.key ? 'bg-white/15 text-white' : 'text-white/50 hover:text-white/80'"
+                >{{ f.label }}</button>
+              </div>
               <p class="text-xs text-white/50 text-center max-w-[420px]">
-                The code contains your seed words — scan only into a wallet you trust,
-                and treat it exactly like the words themselves.
+                {{ qrFormat === 'seedqr'
+                  ? 'SeedQR — scans into Passport, SeedSigner, Keystone and other wallets that import seeds by QR.'
+                  : 'Plain text words — for wallets that read the phrase as text.' }}
+                Treat this code exactly like the words themselves.
               </p>
             </div>
 
@@ -121,17 +133,30 @@ const continueButton = ref<HTMLButtonElement | null>(null)
 const words = ref<string[]>([])
 
 // Words / QR code view of the seed — words are the default first view.
+// The QR tab defaults to SeedQR (BIP39 word-index digit stream), the format
+// hardware wallets like Passport Prime / SeedSigner actually import; plain
+// text stays available for wallets that read the phrase as text.
 const seedTab = ref<'words' | 'qr'>('words')
+const qrFormat = ref<'seedqr' | 'text'>('seedqr')
 const seedQrCanvas = ref<HTMLCanvasElement | null>(null)
-watch(seedTab, async (tab) => {
-  if (tab !== 'qr') return
+
+async function renderSeedQr() {
   await nextTick()
   if (!seedQrCanvas.value || words.value.length === 0) return
   try {
+    let payload = words.value.join(' ')
+    if (qrFormat.value === 'seedqr') {
+      const { toSeedQrDigits } = await import('@/utils/seedqr')
+      const digits = await toSeedQrDigits(words.value)
+      if (digits) payload = digits
+      else qrFormat.value = 'text' // non-BIP39 word — only text is honest
+    }
     const QRCode = await import('qrcode')
-    await QRCode.toCanvas(seedQrCanvas.value, words.value.join(' '), { width: 240, margin: 1 })
+    await QRCode.toCanvas(seedQrCanvas.value, payload, { width: 240, margin: 1 })
   } catch { /* QR is a convenience — the words remain authoritative */ }
-})
+}
+watch(seedTab, (tab) => { if (tab === 'qr') void renderSeedQr() })
+watch(qrFormat, () => { if (seedTab.value === 'qr') void renderSeedQr() })
 const confirmed = ref(false)
 const loading = ref(false)
 const waitingForServer = ref(false)

neode-ui/src/views/appDetails/LndSeedBackup.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { ref, watch, nextTick, onMounted } from 'vue'
+import { ref, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { rpcClient } from '@/api/rpc-client'
+import SeedRevealPanel from '@/components/SeedRevealPanel.vue'
 
 // Lightning seed (aezeed) backup card. Shown on the LND app detail page.
 // The backend captures the aezeed at wallet-init time; until the user
@@ -65,25 +66,9 @@ function openReveal() {
   revealError.value = ''
   revealedWords.value = []
   wordsHidden.value = true
-  seedTab.value = 'words' // words first — QR is the opt-in second view
   showRevealModal.value = true
 }
 
-// Words / QR code tabs (wallet-settings segmented style). The QR encodes the
-// space-joined seed words for wallets that support seed import by scan.
-const seedTab = ref<'words' | 'qr'>('words')
-const seedQrCanvas = ref<HTMLCanvasElement | null>(null)
-
-async function renderSeedQr() {
-  await nextTick()
-  if (!seedQrCanvas.value || revealedWords.value.length === 0) return
-  try {
-    const QRCode = await import('qrcode')
-    await QRCode.toCanvas(seedQrCanvas.value, revealedWords.value.join(' '), { width: 260, margin: 1 })
-  } catch { /* QR is a convenience — the words remain authoritative */ }
-}
-watch(seedTab, (t) => { if (t === 'qr') void renderSeedQr() })
-
 async function submitReveal() {
   if (revealing.value || !revealPassword.value) return
   revealing.value = true
@@ -182,48 +167,7 @@ async function confirmBackedUp() {
         </template>
 
         <template v-else>
-          <div class="flex gap-1 mb-3 p-1 bg-white/5 rounded-lg">
-            <button
-              v-for="tab in ([{ key: 'words', label: 'Words' }, { key: 'qr', label: 'QR code' }] as const)"
-              :key="tab.key"
-              type="button"
-              @click="seedTab = tab.key"
-              class="flex-1 px-2 py-1.5 rounded text-xs font-medium transition-colors"
-              :class="seedTab === tab.key ? 'bg-white/15 text-white' : 'text-white/50 hover:text-white/80'"
-            >{{ tab.label }}</button>
-          </div>
-
-          <template v-if="seedTab === 'words'">
-            <p class="text-sm text-white/60 mb-3">Write these down and store them offline. Tap to {{ wordsHidden ? 'reveal' : 'hide' }}.</p>
-            <div class="relative">
-              <div
-                class="grid grid-cols-2 sm:grid-cols-3 gap-2 p-3 bg-white/5 rounded-lg transition-all select-text"
-                :class="wordsHidden ? 'blur-md' : ''"
-                @click="wordsHidden = !wordsHidden"
-              >
-                <div v-for="(w, i) in revealedWords" :key="i" class="flex items-center gap-1.5 text-sm">
-                  <span class="text-white/30 text-xs w-5 text-right">{{ i + 1 }}.</span>
-                  <span class="text-white font-mono">{{ w }}</span>
-                </div>
-              </div>
-              <button v-if="wordsHidden" type="button" class="absolute inset-0 flex items-center justify-center text-xs text-white/70 font-medium" @click="wordsHidden = false">Tap to reveal</button>
-            </div>
-          </template>
-
-          <template v-else>
-            <p class="text-sm text-white/60 mb-3">Scan with a wallet that supports seed import by QR. Tap to {{ wordsHidden ? 'reveal' : 'hide' }}.</p>
-            <div class="relative">
-              <div
-                class="flex justify-center p-3 bg-white/5 rounded-lg transition-all"
-                :class="wordsHidden ? 'blur-md' : ''"
-                @click="wordsHidden = !wordsHidden"
-              >
-                <canvas ref="seedQrCanvas" class="rounded-lg bg-white p-2"></canvas>
-              </div>
-              <button v-if="wordsHidden" type="button" class="absolute inset-0 flex items-center justify-center text-xs text-white/70 font-medium" @click="wordsHidden = false">Tap to reveal</button>
-            </div>
-            <p class="text-xs text-white/40 mt-2">The code contains your seed words — treat it exactly like the words themselves.</p>
-          </template>
+          <SeedRevealPanel :words="revealedWords" aezeed />
 
           <div class="flex gap-2 pt-4">
             <button type="button" @click="copyRevealedWords" class="flex-1 glass-button rounded-lg px-4 py-2 text-sm font-medium">{{ wordsCopied ? 'Copied!' : 'Copy' }}</button>

neode-ui/src/views/settings/BackupSection.vue

@@ -2,6 +2,7 @@
 import { ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { rpcClient } from '@/api/rpc-client'
+import SeedRevealPanel from '@/components/SeedRevealPanel.vue'
 
 const { t } = useI18n()
 
@@ -329,20 +330,7 @@ defineExpose({ loadBackups })
         </template>
 
         <template v-else>
-          <p class="text-sm text-white/60 mb-3">Write these down and store them offline. Tap to {{ wordsHidden ? 'reveal' : 'hide' }}.</p>
-          <div class="relative">
-            <div
-              class="grid grid-cols-2 sm:grid-cols-3 gap-2 p-3 bg-white/5 rounded-lg transition-all select-text"
-              :class="wordsHidden ? 'blur-md' : ''"
-              @click="wordsHidden = !wordsHidden"
-            >
-              <div v-for="(w, i) in revealedWords" :key="i" class="flex items-center gap-1.5 text-sm">
-                <span class="text-white/30 text-xs w-5 text-right">{{ i + 1 }}.</span>
-                <span class="text-white font-mono">{{ w }}</span>
-              </div>
-            </div>
-            <button v-if="wordsHidden" type="button" class="absolute inset-0 flex items-center justify-center text-xs text-white/70 font-medium" @click="wordsHidden = false">Tap to reveal</button>
-          </div>
+          <SeedRevealPanel :words="revealedWords" />
           <div class="flex gap-2 pt-4">
             <button type="button" @click="copyRevealedWords" class="flex-1 glass-button rounded-lg px-4 py-2 text-sm font-medium">{{ wordsCopied ? 'Copied!' : 'Copy' }}</button>
             <button type="button" @click="closeReveal" class="flex-1 glass-button rounded-lg px-4 py-2 text-sm font-medium bg-orange-500/20 border-orange-400/30">Done</button>