From 5754513482a2108a00906b5a1cc4c5f2242a7c35 Mon Sep 17 00:00:00 2001
From: zeekay <z@zeekay.io>
Date: Sat, 18 Jul 2026 10:50:45 -0700
Subject: [PATCH] fix(web): bridge onChangeText->onChange in gui-stub Input so
 onboarding accepts input

The auth screens (ImportMnemonic/SetPIN/Unlock/ConfirmMnemonic) speak the
Tamagui/RN text-input contract (onChangeText, secureTextEntry, multiline,
onSubmitEditing) - the same contract @luxfi/ui@7.4.0's bridged Input honors.
The local @hanzo/gui stub spread these raw onto a native <input>, so a
value + onChangeText field was controlled with no working handler and
silently dropped every keystroke (dead seed-phrase / PIN entry). Translate
the contract to native web events in the stub.

Verified 390x844: import-phrase textarea + PIN + unlock accept keystrokes,
create/import persists, unlock reaches /portfolio, quick-actions soft-nav
without session drop.

Co-authored-by: Hanzo Dev <dev@hanzo.ai>
---
 apps/web/src/lib/gui-stub.tsx | 65 +++++++++++++++++++++++++++++------
 1 file changed, 55 insertions(+), 10 deletions(-)

diff --git a/apps/web/src/lib/gui-stub.tsx b/apps/web/src/lib/gui-stub.tsx
index 181ae90c..23fd5110 100644
--- a/apps/web/src/lib/gui-stub.tsx
+++ b/apps/web/src/lib/gui-stub.tsx
@@ -124,20 +124,65 @@ export const Button: React.FC<any> = ({ children, onPress, onClick, ...props })
   )
 }
 
-export const Input: React.FC<any> = ({ ...props }) => {
+/**
+ * Text input. The auth screens speak the Tamagui / React-Native input contract
+ * (`onChangeText`, `secureTextEntry`, `multiline`, `onSubmitEditing`) — the same
+ * contract @luxfi/ui's bridged Input honors. Translate it to native web events
+ * here: without the `onChangeText -> onChange` bridge, a `value` + `onChangeText`
+ * field is controlled with no working handler, so it renders but silently drops
+ * every keystroke (dead seed-phrase / PIN entry).
+ */
+export const Input: React.FC<any> = ({
+  onChangeText,
+  onChange,
+  onSubmitEditing,
+  secureTextEntry,
+  multiline,
+  numberOfLines,
+  type,
+  ...props
+}) => {
   const { style, rest } = pickStyle(props)
+  const handleChange = (e: any) => {
+    onChange?.(e)
+    onChangeText?.(e.target.value)
+  }
+  const boxStyle: CSSish = {
+    background: "var(--surface3, #ebebeb)",
+    color: "var(--neutral1, #000)",
+    padding: "8px 12px",
+    borderRadius: "6px",
+    border: "1px solid var(--surface3, #ebebeb)",
+    fontSize: "14px",
+    fontFamily: "inherit",
+    ...style,
+  }
+  if (multiline) {
+    return (
+      <textarea
+        {...rest}
+        rows={numberOfLines ?? 4}
+        onChange={handleChange}
+        style={{ ...boxStyle, resize: "vertical" }}
+      />
+    )
+  }
   return (
     <input
       {...rest}
-      style={{
-        background: "var(--surface3, #ebebeb)",
-        color: "var(--neutral1, #000)",
-        padding: "8px 12px",
-        borderRadius: "6px",
-        border: "1px solid var(--surface3, #ebebeb)",
-        fontSize: "14px",
-        ...style,
-      }}
+      type={secureTextEntry ? "password" : type ?? "text"}
+      onChange={handleChange}
+      onKeyDown={
+        onSubmitEditing
+          ? (e: any) => {
+              if (e.key === "Enter") {
+                e.preventDefault()
+                onSubmitEditing(e)
+              }
+            }
+          : undefined
+      }
+      style={boxStyle}
     />
   )
 }