@swype-org/react-sdk 0.2.361 → 0.2.372

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -636,6 +636,21 @@ function resolveSelectSourceOption(choices, options, chainName, tokenSymbol, rec
636
636
  ));
637
637
  }
638
638
 
639
+ // src/walletFlow.ts
640
+ var MOBILE_USER_AGENT_PATTERN = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
641
+ function isMobileUserAgent(userAgent) {
642
+ if (!userAgent) {
643
+ return false;
644
+ }
645
+ return MOBILE_USER_AGENT_PATTERN.test(userAgent);
646
+ }
647
+ function shouldUseWalletConnector(options) {
648
+ return options.useWalletConnector ?? !isMobileUserAgent(options.userAgent);
649
+ }
650
+ function resolveCoinbasePreferenceOptions(userAgent) {
651
+ return isMobileUserAgent(userAgent) ? "all" : "eoaOnly";
652
+ }
653
+
639
654
  // src/walletBridge/protocol.ts
640
655
  var BRIDGE_PROTOCOL_VERSION = 1;
641
656
  function parseBridgeMessage(data) {
@@ -1006,18 +1021,28 @@ function FingerprintVisitorPing() {
1006
1021
  return null;
1007
1022
  }
1008
1023
  function buildStaticConnectors() {
1024
+ const userAgent = typeof navigator === "undefined" ? null : navigator.userAgent;
1009
1025
  return [
1010
1026
  // `unstable_shimAsyncInject` covers wallets whose content scripts wire
1011
1027
  // up after page load (Phantom, Trust, MetaMask in the iframe).
1012
1028
  connectors.injected({ unstable_shimAsyncInject: 2e3 }),
1013
- // `preference: 'all'` (default) lets the Coinbase Wallet SDK prefer an
1014
- // injected provider when one is present. This matters inside Base's
1015
- // mobile in-app WebView: with `smartWalletOnly`, the SDK routes signing
1016
- // through `keys.coinbase.com`, which in an iOS WKWebView navigates the
1017
- // webview itself (full page reload after each signature). With `all`,
1018
- // the SDK uses the Base WebView's injected `window.ethereum` directly,
1019
- // keeping signing in-process. Desktop/extension users are unaffected.
1020
- connectors.coinbaseWallet({ appName: "Swype", preference: { options: "all" } })
1029
+ // Coinbase Wallet SDK connection preference is platform-specific
1030
+ // (see `resolveCoinbasePreferenceOptions`):
1031
+ // Desktop → `eoaOnly`: in smart-wallet mode the Base extension hands
1032
+ // the dapp a separate, often-empty smart-wallet account instead of the
1033
+ // user's funded EOA "no assets". `eoaOnly` binds the funded EOA.
1034
+ // Mobile (Base in-app WebView) `all`: signing must use the injected
1035
+ // `window.ethereum`; the SDK path reloads the iOS WKWebView after each
1036
+ // signature.
1037
+ //
1038
+ // Exactly ONE Coinbase connector: two `@coinbase/wallet-sdk` instances in
1039
+ // one page collide on shared `window` listeners + the Communicator (Privy
1040
+ // connector-init timeout, listener leaks, duplicated `client-project-name`
1041
+ // that 400s the connect), so we never register a second one.
1042
+ connectors.coinbaseWallet({
1043
+ appName: "Blink",
1044
+ preference: { options: resolveCoinbasePreferenceOptions(userAgent) }
1045
+ })
1021
1046
  ];
1022
1047
  }
1023
1048
  function buildWagmiConfig(bridgedWallets) {
@@ -1167,9 +1192,10 @@ function buildTargetMatchers(target) {
1167
1192
  aliases.add("io.metamask");
1168
1193
  }
1169
1194
  if (value === "base" || value === "base account" || value === "base app" || value.includes("coinbase")) {
1170
- aliases.add("base");
1171
1195
  aliases.add("coinbase");
1172
1196
  aliases.add("coinbasewalletsdk");
1197
+ aliases.add("com.coinbase.wallet");
1198
+ aliases.add("baseaccount");
1173
1199
  }
1174
1200
  if (value.includes("trust")) {
1175
1201
  aliases.add("trust");
@@ -1243,19 +1269,70 @@ async function withTimeout(promise, ms, label) {
1243
1269
  if (timer !== void 0) clearTimeout(timer);
1244
1270
  }
1245
1271
  }
1246
- function isReloadingCoinbaseConnector(connector) {
1272
+ function isCoinbaseSdkConnector(connector) {
1247
1273
  if (!connector) return false;
1248
1274
  return connectorMatchesWallet(
1249
1275
  { id: connector.id, name: connector.name ?? "" },
1250
1276
  { wagmiConnectorId: "coinbaseWalletSDK" }
1251
1277
  );
1252
1278
  }
1279
+ var COINBASE_SDK_STORAGE_PREFIXES = ["-CBWSDK", "-walletlink"];
1280
+ var COINBASE_SIGNER_TYPE_STORAGE_KEY = "-CBWSDK:SignerConfigurator:SignerType";
1281
+ function loadCoinbaseSignerType() {
1282
+ if (typeof window === "undefined" || !window.localStorage) return null;
1283
+ try {
1284
+ return window.localStorage.getItem(COINBASE_SIGNER_TYPE_STORAGE_KEY);
1285
+ } catch {
1286
+ return null;
1287
+ }
1288
+ }
1289
+ function clearCoinbaseWalletSdkSession() {
1290
+ if (typeof window === "undefined" || !window.localStorage) return;
1291
+ try {
1292
+ const store = window.localStorage;
1293
+ const keysToRemove = [];
1294
+ for (let i = 0; i < store.length; i += 1) {
1295
+ const key = store.key(i);
1296
+ if (key && COINBASE_SDK_STORAGE_PREFIXES.some((prefix) => key.startsWith(prefix))) {
1297
+ keysToRemove.push(key);
1298
+ }
1299
+ }
1300
+ keysToRemove.forEach((key) => store.removeItem(key));
1301
+ console.info("[blink-sdk][disconnect] cleared Coinbase Wallet SDK session", {
1302
+ clearedKeys: keysToRemove.length
1303
+ });
1304
+ } catch (err) {
1305
+ console.info("[blink-sdk][disconnect] failed to clear Coinbase Wallet SDK session", err);
1306
+ }
1307
+ }
1308
+ function resetWagmiConnectionInMemory(wagmiConfig, connector) {
1309
+ if (!connector) return;
1310
+ try {
1311
+ const target = connector;
1312
+ const connections = [...wagmiConfig.state.connections.values()];
1313
+ const match = connections.find((conn) => {
1314
+ const live2 = conn.connector;
1315
+ if (target.uid && live2.uid) return live2.uid === target.uid;
1316
+ return live2.id === target.id;
1317
+ });
1318
+ const live = match?.connector;
1319
+ if (!live?.emitter) return;
1320
+ live.emitter.emit("disconnect");
1321
+ console.info("[blink-sdk][disconnect] reset wagmi in-memory connection via emitter", {
1322
+ connectorId: live.id
1323
+ });
1324
+ } catch (err) {
1325
+ console.info("[blink-sdk][disconnect] failed to reset wagmi in-memory connection", err);
1326
+ }
1327
+ }
1253
1328
  async function safeDisconnect(wagmiConfig, connector) {
1254
- if (isReloadingCoinbaseConnector(connector)) {
1329
+ if (isCoinbaseSdkConnector(connector)) {
1255
1330
  console.info(
1256
- "[blink-sdk][disconnect] skipping wagmi disconnect for Coinbase WalletLink connector",
1331
+ "[blink-sdk][disconnect] clearing Coinbase Wallet SDK session instead of wagmi disconnect",
1257
1332
  { connectorId: connector?.id }
1258
1333
  );
1334
+ clearCoinbaseWalletSdkSession();
1335
+ resetWagmiConnectionInMemory(wagmiConfig, connector);
1259
1336
  return;
1260
1337
  }
1261
1338
  await core.disconnect(wagmiConfig, { connector }).catch(() => {
@@ -3909,6 +3986,23 @@ function isUserRejection(msg) {
3909
3986
  const lower = msg.toLowerCase();
3910
3987
  return lower.includes("rejected") || lower.includes("denied");
3911
3988
  }
3989
+ var EmptyConnectionAccountError = class extends Error {
3990
+ constructor(message = "Wallet connected but returned no account address.") {
3991
+ super(message);
3992
+ this.name = "EmptyConnectionAccountError";
3993
+ }
3994
+ };
3995
+ var EVM_ADDRESS_RE = /^0x[0-9a-fA-F]{40}$/;
3996
+ function assertNonEmptyConnectedAddress(address, ctx) {
3997
+ if (typeof address === "string" && EVM_ADDRESS_RE.test(address)) {
3998
+ return;
3999
+ }
4000
+ appendDebug("error", "OPEN_PROVIDER: empty-or-invalid-connected-address", {
4001
+ ...ctx,
4002
+ address: address ?? null
4003
+ });
4004
+ throw new EmptyConnectionAccountError();
4005
+ }
3912
4006
  function requiresExplicitEvmNonce(account) {
3913
4007
  return connectorMatchesWallet(account?.connector, { providerName: "trust" }) || connectorMatchesWallet(account?.connector, { providerName: "phantom" });
3914
4008
  }
@@ -4142,7 +4236,8 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4142
4236
  accountConnectorId: account.connector?.id ?? null,
4143
4237
  accountConnectorName: account.connector?.name ?? null,
4144
4238
  targetId: targetId ?? null,
4145
- resolvedConnectorId: connector?.id ?? null
4239
+ resolvedConnectorId: connector?.id ?? null,
4240
+ availableConnectorIds: connectors.map((c) => c.id)
4146
4241
  };
4147
4242
  let disconnectedMismatchedConnector = false;
4148
4243
  if (account.isConnected && account.address) {
@@ -4150,6 +4245,7 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4150
4245
  if (connectorMatchesTarget) {
4151
4246
  const hexChainId2 = account.chainId ? `0x${account.chainId.toString(16)}` : void 0;
4152
4247
  const branch = !targetId ? "early-return-no-target" : "early-return-connector-match";
4248
+ assertNonEmptyConnectedAddress(account.address, { ...logContext, branch });
4153
4249
  console.info("[blink-sdk][open-provider] Skipping connectAsync; wagmi already connected.", {
4154
4250
  ...logContext,
4155
4251
  branch
@@ -4173,6 +4269,20 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4173
4269
  disconnectedMismatchedConnector = true;
4174
4270
  }
4175
4271
  if (!disconnectedMismatchedConnector) {
4272
+ const targetIsCoinbase = connectorMatchesWallet(connector, {
4273
+ wagmiConnectorId: "coinbaseWalletSDK"
4274
+ });
4275
+ const isDesktopUa = !isMobileUserAgent(
4276
+ typeof navigator === "undefined" ? null : navigator.userAgent
4277
+ );
4278
+ if (targetIsCoinbase && isDesktopUa && loadCoinbaseSignerType() === "scw") {
4279
+ console.info(
4280
+ "[blink-sdk][open-provider] Clearing stale Coinbase Smart Wallet (scw) session before reconnect so eoaOnly binds the EOA.",
4281
+ logContext
4282
+ );
4283
+ appendDebug("info", "OPEN_PROVIDER: clearing stale scw session before reconnect", logContext);
4284
+ clearCoinbaseWalletSdkSession();
4285
+ }
4176
4286
  console.info("[blink-sdk][open-provider] Attempting silent reconnect.", logContext);
4177
4287
  appendDebug("info", "OPEN_PROVIDER: attempting silent reconnect", logContext);
4178
4288
  const reconnections = await core.reconnect(wagmiConfig).catch(() => []);
@@ -4187,6 +4297,7 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4187
4297
  reconnectedConnectorId: reconnectedAccount.connector?.id ?? null,
4188
4298
  reconnectionCount: reconnections.length
4189
4299
  };
4300
+ assertNonEmptyConnectedAddress(reconnectedAccount.address, reconnectLogContext);
4190
4301
  console.info(
4191
4302
  "[blink-sdk][open-provider] Silent reconnect succeeded; skipping connectAsync.",
4192
4303
  reconnectLogContext
@@ -4254,6 +4365,10 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4254
4365
  });
4255
4366
  const result = await connectAsync({ connector });
4256
4367
  const hexChainId = `0x${result.chainId.toString(16)}`;
4368
+ assertNonEmptyConnectedAddress(result.accounts[0], {
4369
+ ...logContext,
4370
+ branch: "connectAsync-result"
4371
+ });
4257
4372
  return actionSuccess(
4258
4373
  action,
4259
4374
  `Connected to ${connector.name}. Account: ${result.accounts[0]}, Chain: ${hexChainId}`,
@@ -4261,15 +4376,23 @@ async function executeOpenProvider(action, wagmiConfig, connectors, connectAsync
4261
4376
  );
4262
4377
  } catch (err) {
4263
4378
  const msg = err instanceof Error ? err.message : "Failed to connect wallet";
4264
- if (options?.externalAuthorizationAvailable && isUserRejection(msg) && action.metadata?.chainFamily !== "svm") {
4265
- appendDebug("info", "OPEN_PROVIDER: user-rejection-soft-halt", {
4379
+ const emptyAccount = err instanceof EmptyConnectionAccountError;
4380
+ if (options?.externalAuthorizationAvailable && (isUserRejection(msg) || emptyAccount) && action.metadata?.chainFamily !== "svm") {
4381
+ appendDebug("info", "OPEN_PROVIDER: soft-halt", {
4266
4382
  actionId: action.id,
4267
- externalAuthorizationAvailable: true
4383
+ externalAuthorizationAvailable: true,
4384
+ reason: emptyAccount ? "empty-account" : "user-rejection"
4268
4385
  });
4269
4386
  return actionPending(
4270
4387
  action,
4271
4388
  "awaiting-external-authorization",
4272
- "Wallet connection prompt dismissed \u2014 awaiting completion via cross-device authorization."
4389
+ emptyAccount ? "Wallet returned no account \u2014 awaiting completion via cross-device authorization." : "Wallet connection prompt dismissed \u2014 awaiting completion via cross-device authorization."
4390
+ );
4391
+ }
4392
+ if (emptyAccount) {
4393
+ return actionError(
4394
+ action,
4395
+ "We couldn't read an address from that wallet. Please reconnect and make sure an account is selected."
4273
4396
  );
4274
4397
  }
4275
4398
  if (action.metadata?.chainFamily === "svm") {
@@ -6975,18 +7098,6 @@ function updateTrackedSession(sessions, ownerSessionId, reportedSession, actionS
6975
7098
  }
6976
7099
  }
6977
7100
 
6978
- // src/walletFlow.ts
6979
- var MOBILE_USER_AGENT_PATTERN = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
6980
- function isMobileUserAgent(userAgent) {
6981
- if (!userAgent) {
6982
- return false;
6983
- }
6984
- return MOBILE_USER_AGENT_PATTERN.test(userAgent);
6985
- }
6986
- function shouldUseWalletConnector(options) {
6987
- return options.useWalletConnector ?? !isMobileUserAgent(options.userAgent);
6988
- }
6989
-
6990
7101
  // src/enterAmountInput.ts
6991
7102
  var MAX_FRACTION_DIGITS = 2;
6992
7103
  function isDigit(value) {
@@ -8586,6 +8697,52 @@ var buttonStyle = (color, hovered) => ({
8586
8697
  flexShrink: 0,
8587
8698
  transition: "background 0.15s ease"
8588
8699
  });
8700
+ var INTERCOM_HELP_URL = "https://intercom.help/blinkcash/en/";
8701
+ var TERMS_URL = "https://blink.cash/terms";
8702
+ function SupportFooter() {
8703
+ const { tokens } = useBlinkConfig();
8704
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle2(tokens.textMuted), children: [
8705
+ /* @__PURE__ */ jsxRuntime.jsx(
8706
+ "a",
8707
+ {
8708
+ href: INTERCOM_HELP_URL,
8709
+ target: "_blank",
8710
+ rel: "noopener noreferrer",
8711
+ style: linkStyle(tokens.textMuted),
8712
+ children: "Help"
8713
+ }
8714
+ ),
8715
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", style: dotStyle(tokens.textTertiary), children: "\u2022" }),
8716
+ /* @__PURE__ */ jsxRuntime.jsx(
8717
+ "a",
8718
+ {
8719
+ href: TERMS_URL,
8720
+ target: "_blank",
8721
+ rel: "noopener noreferrer",
8722
+ style: linkStyle(tokens.textMuted),
8723
+ children: "Terms"
8724
+ }
8725
+ )
8726
+ ] });
8727
+ }
8728
+ var containerStyle2 = (color) => ({
8729
+ display: "flex",
8730
+ alignItems: "center",
8731
+ justifyContent: "center",
8732
+ gap: 10,
8733
+ fontSize: "0.8rem",
8734
+ color,
8735
+ padding: "4px 0"
8736
+ });
8737
+ var linkStyle = (color) => ({
8738
+ color,
8739
+ fontWeight: 500,
8740
+ textDecoration: "none"
8741
+ });
8742
+ var dotStyle = (color) => ({
8743
+ color,
8744
+ fontSize: "0.8rem"
8745
+ });
8589
8746
  function SettingsMenu({ onLogout }) {
8590
8747
  const { tokens } = useBlinkConfig();
8591
8748
  const [open, setOpen] = react.useState(false);
@@ -8601,34 +8758,54 @@ function SettingsMenu({ onLogout }) {
8601
8758
  document.addEventListener("mousedown", handleClickOutside);
8602
8759
  return () => document.removeEventListener("mousedown", handleClickOutside);
8603
8760
  }, [open]);
8604
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: menuRef, style: containerStyle2, children: [
8761
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: menuRef, style: containerStyle3, children: [
8605
8762
  /* @__PURE__ */ jsxRuntime.jsx(IconButton, { onClick: toggle, "aria-label": "Settings", children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", children: [
8606
8763
  /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "5", r: "2", fill: "currentColor" }),
8607
8764
  /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "2", fill: "currentColor" }),
8608
8765
  /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "19", r: "2", fill: "currentColor" })
8609
8766
  ] }) }),
8610
- open && /* @__PURE__ */ jsxRuntime.jsx("div", { style: dropdownStyle(tokens), children: /* @__PURE__ */ jsxRuntime.jsxs(
8611
- "button",
8612
- {
8613
- type: "button",
8614
- onClick: () => {
8615
- setOpen(false);
8616
- onLogout();
8617
- },
8618
- style: menuItemStyle(tokens),
8619
- children: [
8620
- /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 8, flexShrink: 0 }, children: [
8621
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 21H5a2 2 0 01-2-2V5a2 2 0 012-2h4", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
8622
- /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "16 17 21 12 16 7", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
8623
- /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "21", y1: "12", x2: "9", y2: "12", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
8624
- ] }),
8625
- "Log out"
8626
- ]
8627
- }
8628
- ) })
8767
+ open && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: dropdownStyle(tokens), children: [
8768
+ /* @__PURE__ */ jsxRuntime.jsxs(
8769
+ "a",
8770
+ {
8771
+ href: INTERCOM_HELP_URL,
8772
+ target: "_blank",
8773
+ rel: "noopener noreferrer",
8774
+ onClick: () => setOpen(false),
8775
+ style: menuItemStyle(tokens.text),
8776
+ children: [
8777
+ /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 8, flexShrink: 0 }, children: [
8778
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "9", stroke: tokens.text, strokeWidth: "2" }),
8779
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.5 9a2.5 2.5 0 014.5 1.5c0 1.5-2 2-2 3", stroke: tokens.text, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
8780
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "17", r: "1", fill: tokens.text })
8781
+ ] }),
8782
+ "Help"
8783
+ ]
8784
+ }
8785
+ ),
8786
+ /* @__PURE__ */ jsxRuntime.jsxs(
8787
+ "button",
8788
+ {
8789
+ type: "button",
8790
+ onClick: () => {
8791
+ setOpen(false);
8792
+ onLogout();
8793
+ },
8794
+ style: menuItemStyle(tokens.error),
8795
+ children: [
8796
+ /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 8, flexShrink: 0 }, children: [
8797
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 21H5a2 2 0 01-2-2V5a2 2 0 012-2h4", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
8798
+ /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "16 17 21 12 16 7", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
8799
+ /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "21", y1: "12", x2: "9", y2: "12", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
8800
+ ] }),
8801
+ "Log out"
8802
+ ]
8803
+ }
8804
+ )
8805
+ ] })
8629
8806
  ] });
8630
8807
  }
8631
- var containerStyle2 = {
8808
+ var containerStyle3 = {
8632
8809
  position: "relative"
8633
8810
  };
8634
8811
  var dropdownStyle = (tokens) => ({
@@ -8644,7 +8821,7 @@ var dropdownStyle = (tokens) => ({
8644
8821
  zIndex: 100,
8645
8822
  overflow: "hidden"
8646
8823
  });
8647
- var menuItemStyle = (tokens) => ({
8824
+ var menuItemStyle = (color) => ({
8648
8825
  width: "100%",
8649
8826
  display: "flex",
8650
8827
  alignItems: "center",
@@ -8655,7 +8832,9 @@ var menuItemStyle = (tokens) => ({
8655
8832
  fontFamily: "inherit",
8656
8833
  fontSize: "0.85rem",
8657
8834
  fontWeight: 500,
8658
- color: tokens.error
8835
+ color,
8836
+ textDecoration: "none",
8837
+ boxSizing: "border-box"
8659
8838
  });
8660
8839
  function ScreenHeader({ title, right, onBack, left, badge, onLogout, center }) {
8661
8840
  const { tokens } = useBlinkConfig();
@@ -8716,7 +8895,7 @@ var badgeStyle = (color) => ({
8716
8895
  });
8717
8896
  function PoweredByFooter() {
8718
8897
  const { tokens } = useBlinkConfig();
8719
- return /* @__PURE__ */ jsxRuntime.jsx("div", { style: containerStyle3(tokens.textMuted), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: rowStyle, children: [
8898
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { style: containerStyle4(tokens.textMuted), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: rowStyle, children: [
8720
8899
  /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
8721
8900
  "path",
8722
8901
  {
@@ -8727,7 +8906,7 @@ function PoweredByFooter() {
8727
8906
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Powered by Blink" })
8728
8907
  ] }) });
8729
8908
  }
8730
- var containerStyle3 = (color) => ({
8909
+ var containerStyle4 = (color) => ({
8731
8910
  display: "flex",
8732
8911
  flexDirection: "column",
8733
8912
  alignItems: "center",
@@ -9437,12 +9616,12 @@ var defaultIcon = /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "
9437
9616
  ) });
9438
9617
  function InfoBanner({ children, icon }) {
9439
9618
  const { tokens } = useBlinkConfig();
9440
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle4(tokens.accent), children: [
9619
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle5(tokens.accent), children: [
9441
9620
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: iconStyle, children: icon ?? defaultIcon }),
9442
9621
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: textStyle, children })
9443
9622
  ] });
9444
9623
  }
9445
- var containerStyle4 = (accent) => ({
9624
+ var containerStyle5 = (accent) => ({
9446
9625
  display: "flex",
9447
9626
  alignItems: "flex-start",
9448
9627
  gap: 10,
@@ -9460,7 +9639,7 @@ var iconStyle = {
9460
9639
  };
9461
9640
  var textStyle = { flex: 1 };
9462
9641
  function WarningBanner({ title, children }) {
9463
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle5, children: [
9642
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle6, children: [
9464
9643
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: headerStyle2, children: [
9465
9644
  /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", style: iconStyle2, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z", fill: "#F57C00" }) }),
9466
9645
  /* @__PURE__ */ jsxRuntime.jsx("strong", { children: title })
@@ -9468,7 +9647,7 @@ function WarningBanner({ title, children }) {
9468
9647
  /* @__PURE__ */ jsxRuntime.jsx("div", { style: bodyStyle2, children })
9469
9648
  ] });
9470
9649
  }
9471
- var containerStyle5 = {
9650
+ var containerStyle6 = {
9472
9651
  padding: "14px 16px",
9473
9652
  background: "#FFF8E1",
9474
9653
  border: "1px solid #FFE082",
@@ -9518,7 +9697,7 @@ function NotificationBanner({
9518
9697
  }) {
9519
9698
  const { tokens } = useBlinkConfig();
9520
9699
  const color = variant === "negative" ? NEGATIVE_FG : tokens.text;
9521
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle6(tokens.bgRecessed), children: [
9700
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle7(tokens.bgRecessed), children: [
9522
9701
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: { ...iconWrapStyle2, color }, children: icon ?? defaultIcon2 }),
9523
9702
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { ...textColStyle, color }, children: [
9524
9703
  /* @__PURE__ */ jsxRuntime.jsx("p", { style: titleStyle3, children: title }),
@@ -9526,7 +9705,7 @@ function NotificationBanner({
9526
9705
  ] })
9527
9706
  ] });
9528
9707
  }
9529
- var containerStyle6 = (bg) => ({
9708
+ var containerStyle7 = (bg) => ({
9530
9709
  display: "flex",
9531
9710
  alignItems: "flex-start",
9532
9711
  gap: 16,
@@ -9621,7 +9800,7 @@ function OtpInput({ value, onChange, length = 6, disabled }) {
9621
9800
  onChange(pasted);
9622
9801
  focusInput(Math.min(pasted.length, length - 1));
9623
9802
  }, [onChange, length, focusInput]);
9624
- return /* @__PURE__ */ jsxRuntime.jsx("div", { style: containerStyle7, children: digits.map((digit, i) => /* @__PURE__ */ jsxRuntime.jsx(
9803
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { style: containerStyle8, children: digits.map((digit, i) => /* @__PURE__ */ jsxRuntime.jsx(
9625
9804
  "input",
9626
9805
  {
9627
9806
  ref: (el) => {
@@ -9642,7 +9821,7 @@ function OtpInput({ value, onChange, length = 6, disabled }) {
9642
9821
  i
9643
9822
  )) });
9644
9823
  }
9645
- var containerStyle7 = {
9824
+ var containerStyle8 = {
9646
9825
  display: "flex",
9647
9826
  gap: 8,
9648
9827
  justifyContent: "center",
@@ -10607,6 +10786,38 @@ function FaceIdIcon({ size = 24 }) {
10607
10786
  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.5 16c.7.6 1.6 1 2.5 1s1.8-.4 2.5-1", stroke: "currentColor", strokeWidth: "1.7", strokeLinecap: "round" })
10608
10787
  ] });
10609
10788
  }
10789
+ function WalletIcon() {
10790
+ return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
10791
+ /* @__PURE__ */ jsxRuntime.jsx(
10792
+ "path",
10793
+ {
10794
+ d: "M4 7.5A2.5 2.5 0 0 1 6.5 5h11A2.5 2.5 0 0 1 20 7.5v9A2.5 2.5 0 0 1 17.5 19h-11A2.5 2.5 0 0 1 4 16.5v-9Zm2.5-1a1 1 0 0 0-1 1V9h13v-1.5a1 1 0 0 0-1-1h-11ZM5.5 10.5v6a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-6h-13Z",
10795
+ fill: "currentColor"
10796
+ }
10797
+ ),
10798
+ /* @__PURE__ */ jsxRuntime.jsx(
10799
+ "path",
10800
+ {
10801
+ d: "M14.5 13.75a.75.75 0 0 1 .75-.75h2a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1-.75-.75Z",
10802
+ fill: "currentColor"
10803
+ }
10804
+ )
10805
+ ] });
10806
+ }
10807
+ function QrIcon({ color = "currentColor" } = {}) {
10808
+ return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
10809
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
10810
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "6", width: "2", height: "2", fill: color }),
10811
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
10812
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "16", y: "6", width: "2", height: "2", fill: color }),
10813
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3.5", y: "13.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
10814
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "16", width: "2", height: "2", fill: color }),
10815
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "13.5", width: "2.5", height: "2.5", fill: color }),
10816
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "18", y: "13.5", width: "2.5", height: "2.5", fill: color }),
10817
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "18", width: "2.5", height: "2.5", fill: color }),
10818
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "18", y: "18", width: "2.5", height: "2.5", fill: color })
10819
+ ] });
10820
+ }
10610
10821
  function LogoCircle({ src, fallback, preserveShape, size = 36 }) {
10611
10822
  const { tokens } = useBlinkConfig();
10612
10823
  return /* @__PURE__ */ jsxRuntime.jsx("span", { style: logoCircleStyle(size, tokens.bgCard, tokens.textMuted), children: src ? /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt: "", style: logoImageStyle(preserveShape) }) : fallback });
@@ -11076,7 +11287,8 @@ function LoginScreen({
11076
11287
  style: secondaryTextStyle(tokens, loading),
11077
11288
  children: secondaryLabel
11078
11289
  }
11079
- )
11290
+ ),
11291
+ /* @__PURE__ */ jsxRuntime.jsx(SupportFooter, {})
11080
11292
  ] }),
11081
11293
  children: [
11082
11294
  /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack, right: headerRight }),
@@ -11248,7 +11460,7 @@ function DepositOptionsScreen({
11248
11460
  const { tokens, promoTagText } = useBlinkConfig();
11249
11461
  const [manualHovered, setManualHovered] = react.useState(false);
11250
11462
  const [manualPressed, setManualPressed] = react.useState(false);
11251
- return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { hideScrollbar: true, children: [
11463
+ return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { hideScrollbar: true, footer: /* @__PURE__ */ jsxRuntime.jsx(SupportFooter, {}), children: [
11252
11464
  /* @__PURE__ */ jsxRuntime.jsx(
11253
11465
  ScreenHeader,
11254
11466
  {
@@ -11292,7 +11504,7 @@ function DepositOptionsScreen({
11292
11504
  ),
11293
11505
  children: [
11294
11506
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: manualLabelStyle(tokens.text), children: "Send Crypto Manually" }),
11295
- /* @__PURE__ */ jsxRuntime.jsx(QrIcon, { color: tokens.text })
11507
+ /* @__PURE__ */ jsxRuntime.jsx(QrIcon2, { color: tokens.text })
11296
11508
  ]
11297
11509
  }
11298
11510
  )
@@ -11300,7 +11512,7 @@ function DepositOptionsScreen({
11300
11512
  ] })
11301
11513
  ] });
11302
11514
  }
11303
- function QrIcon({ color }) {
11515
+ function QrIcon2({ color }) {
11304
11516
  return /* @__PURE__ */ jsxRuntime.jsxs(
11305
11517
  "svg",
11306
11518
  {
@@ -11403,7 +11615,7 @@ function WelcomeBackScreen({
11403
11615
  const [depositPressed, setDepositPressed] = react.useState(false);
11404
11616
  const [manualHovered, setManualHovered] = react.useState(false);
11405
11617
  const [manualPressed, setManualPressed] = react.useState(false);
11406
- return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { children: [
11618
+ return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { footer: /* @__PURE__ */ jsxRuntime.jsx(SupportFooter, {}), children: [
11407
11619
  /* @__PURE__ */ jsxRuntime.jsx(
11408
11620
  ScreenHeader,
11409
11621
  {
@@ -11490,7 +11702,7 @@ function WelcomeBackScreen({
11490
11702
  ),
11491
11703
  children: [
11492
11704
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: manualLabelStyle2(tokens.text), children: "Send Crypto Manually" }),
11493
- /* @__PURE__ */ jsxRuntime.jsx(QrIcon2, { color: tokens.text })
11705
+ /* @__PURE__ */ jsxRuntime.jsx(QrIcon3, { color: tokens.text })
11494
11706
  ]
11495
11707
  }
11496
11708
  )
@@ -11498,7 +11710,7 @@ function WelcomeBackScreen({
11498
11710
  ] })
11499
11711
  ] });
11500
11712
  }
11501
- function QrIcon2({ color }) {
11713
+ function QrIcon3({ color }) {
11502
11714
  return /* @__PURE__ */ jsxRuntime.jsxs(
11503
11715
  "svg",
11504
11716
  {
@@ -13608,7 +13820,7 @@ function SelectDepositSourceScreen({
13608
13820
  label: "Send manually",
13609
13821
  color: tokens.text,
13610
13822
  onClick: onSendManually,
13611
- icon: /* @__PURE__ */ jsxRuntime.jsx(QrIcon3, { color: tokens.text })
13823
+ icon: /* @__PURE__ */ jsxRuntime.jsx(QrIcon, { color: tokens.text })
13612
13824
  }
13613
13825
  ),
13614
13826
  onAddProvider && /* @__PURE__ */ jsxRuntime.jsx(
@@ -13724,38 +13936,6 @@ function ActionRow({
13724
13936
  }
13725
13937
  );
13726
13938
  }
13727
- function QrIcon3({ color }) {
13728
- return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
13729
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
13730
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "6", width: "2", height: "2", fill: color }),
13731
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
13732
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "16", y: "6", width: "2", height: "2", fill: color }),
13733
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3.5", y: "13.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
13734
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "6", y: "16", width: "2", height: "2", fill: color }),
13735
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "13.5", width: "2.5", height: "2.5", fill: color }),
13736
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "18", y: "13.5", width: "2.5", height: "2.5", fill: color }),
13737
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "13.5", y: "18", width: "2.5", height: "2.5", fill: color }),
13738
- /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "18", y: "18", width: "2.5", height: "2.5", fill: color })
13739
- ] });
13740
- }
13741
- function WalletIcon() {
13742
- return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
13743
- /* @__PURE__ */ jsxRuntime.jsx(
13744
- "path",
13745
- {
13746
- d: "M4 7.5A2.5 2.5 0 0 1 6.5 5h11A2.5 2.5 0 0 1 20 7.5v9A2.5 2.5 0 0 1 17.5 19h-11A2.5 2.5 0 0 1 4 16.5v-9Zm2.5-1a1 1 0 0 0-1 1V9h13v-1.5a1 1 0 0 0-1-1h-11ZM5.5 10.5v6a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-6h-13Z",
13747
- fill: "currentColor"
13748
- }
13749
- ),
13750
- /* @__PURE__ */ jsxRuntime.jsx(
13751
- "path",
13752
- {
13753
- d: "M14.5 13.75a.75.75 0 0 1 .75-.75h2a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1-.75-.75Z",
13754
- fill: "currentColor"
13755
- }
13756
- )
13757
- ] });
13758
- }
13759
13939
  var actionRowStyle = (color, hovered) => ({
13760
13940
  display: "flex",
13761
13941
  alignItems: "center",
@@ -13995,7 +14175,13 @@ function DepositScreen({
13995
14175
  100% { background-position: -200% 0; }
13996
14176
  }
13997
14177
  ` }),
13998
- /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onLogout }),
14178
+ /* @__PURE__ */ jsxRuntime.jsx(
14179
+ ScreenHeader,
14180
+ {
14181
+ left: /* @__PURE__ */ jsxRuntime.jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style: wordmarkImgStyle4 }),
14182
+ onLogout
14183
+ }
14184
+ ),
13999
14185
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: redesignHeroStackStyle(mobileEntryWithKeypad), children: [
14000
14186
  showDesktopInputHero ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: entryDesktopHeroRowStyle(desktopInputHeroColor, getDesktopHeroFontSize(liveMobileHeroValue)), children: [
14001
14187
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", style: entryDollarStyle(isZero), children: "$" }),
@@ -14135,6 +14321,11 @@ function FaceIdIcon2() {
14135
14321
  )
14136
14322
  ] });
14137
14323
  }
14324
+ var wordmarkImgStyle4 = {
14325
+ height: 31,
14326
+ width: "auto",
14327
+ display: "block"
14328
+ };
14138
14329
  var bannerSlotStyle2 = {
14139
14330
  display: "flex",
14140
14331
  justifyContent: "center",
@@ -15137,7 +15328,7 @@ function DepositAddressScreen({
15137
15328
  const waitingForQr = !!depositAddress && !qrReady;
15138
15329
  const awaitingSession = !!selectedOption && !session && !loading;
15139
15330
  const showShimmer = loadingSources || showLoading || waitingForQr || awaitingSession;
15140
- return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { children: [
15331
+ return /* @__PURE__ */ jsxRuntime.jsxs(ScreenLayout, { footer: /* @__PURE__ */ jsxRuntime.jsx(SupportFooter, {}), children: [
15141
15332
  /* @__PURE__ */ jsxRuntime.jsx(
15142
15333
  ScreenHeader,
15143
15334
  {
@@ -15354,6 +15545,7 @@ function OpenWalletScreen({
15354
15545
  onLogout
15355
15546
  }) {
15356
15547
  const { tokens } = useBlinkConfig();
15548
+ const [showQrView, setShowQrView] = react.useState(false);
15357
15549
  const displayName = walletName ?? "your wallet";
15358
15550
  const logoSrc = walletLogoUrl ?? (walletName ? KNOWN_LOGOS[walletName.toLowerCase()] : void 0);
15359
15551
  const autoOpenedRef = react.useRef(null);
@@ -15371,61 +15563,6 @@ function OpenWalletScreen({
15371
15563
  const handleOpen = react.useCallback(() => {
15372
15564
  openDeeplink(deeplinkUri);
15373
15565
  }, [deeplinkUri]);
15374
- const logoBlock = /* @__PURE__ */ jsxRuntime.jsxs("div", { style: logoFrameStyle, children: [
15375
- /* @__PURE__ */ jsxRuntime.jsx(
15376
- "svg",
15377
- {
15378
- width: "96",
15379
- height: "96",
15380
- viewBox: "0 0 96 96",
15381
- fill: "none",
15382
- style: logoRingSvgStyle,
15383
- "aria-hidden": true,
15384
- children: /* @__PURE__ */ jsxRuntime.jsx(
15385
- "circle",
15386
- {
15387
- cx: "48",
15388
- cy: "48",
15389
- r: "47",
15390
- stroke: tokens.textMuted,
15391
- strokeOpacity: "0.18",
15392
- strokeWidth: "2",
15393
- fill: "none"
15394
- }
15395
- )
15396
- }
15397
- ),
15398
- /* @__PURE__ */ jsxRuntime.jsx(
15399
- "svg",
15400
- {
15401
- width: "96",
15402
- height: "96",
15403
- viewBox: "0 0 96 96",
15404
- fill: "none",
15405
- style: spinningRingSvgStyle,
15406
- "aria-hidden": true,
15407
- children: /* @__PURE__ */ jsxRuntime.jsx(
15408
- "path",
15409
- {
15410
- d: "M 71.7 89.04 A 47 47 0 1 1 89.04 71.7",
15411
- stroke: tokens.textMuted,
15412
- strokeOpacity: "0.65",
15413
- strokeWidth: "2",
15414
- fill: "none",
15415
- strokeLinecap: "round"
15416
- }
15417
- )
15418
- }
15419
- ),
15420
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: logoCircleStyle2(tokens.bgRecessed), children: logoSrc && /* @__PURE__ */ jsxRuntime.jsx(
15421
- "img",
15422
- {
15423
- src: logoSrc,
15424
- alt: displayName,
15425
- style: walletLogoUrl ? reownLogoStyle : logoStyle2
15426
- }
15427
- ) })
15428
- ] });
15429
15566
  const heroBlock = /* @__PURE__ */ jsxRuntime.jsxs("div", { style: heroFrameStyle, "aria-hidden": true, children: [
15430
15567
  /* @__PURE__ */ jsxRuntime.jsx(
15431
15568
  "svg",
@@ -15474,42 +15611,25 @@ function OpenWalletScreen({
15474
15611
  ] });
15475
15612
  if (!useDeeplink) {
15476
15613
  const hasQr = !!deeplinkUri;
15477
- const qrCaption = hasQr ? `Wallet on your phone? Scan to open ${displayName} and finish there.` : "Wallet on your phone? Your QR code is being prepared.";
15478
- return /* @__PURE__ */ jsxRuntime.jsxs(
15479
- ScreenLayout,
15480
- {
15481
- footer: error ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: footerStackStyle5, children: [
15482
- /* @__PURE__ */ jsxRuntime.jsx(InfoBanner, { children: error }),
15483
- onRetryAuthorization && /* @__PURE__ */ jsxRuntime.jsx(OutlineButton, { onClick: onRetryAuthorization, children: "Retry" })
15484
- ] }) : void 0,
15485
- children: [
15486
- /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
15487
- @keyframes blink-open-wallet-qr-shimmer {
15488
- 0% { background-position: 200% 0; }
15489
- 100% { background-position: -200% 0; }
15490
- }
15491
- @keyframes blink-open-wallet-ring-spin {
15492
- to { transform: rotate(360deg); }
15493
- }
15494
- ` }),
15495
- /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack, onLogout }),
15496
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: desktopContentStyle, children: [
15497
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: primaryClusterStyle, children: [
15498
- logoBlock,
15499
- /* @__PURE__ */ jsxRuntime.jsxs("h2", { style: headingStyle12(tokens.text), children: [
15500
- "Setting up ",
15501
- displayName,
15502
- "\u2026"
15503
- ] }),
15504
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: bodyStyle4(tokens.text), children: "Approve the connection in your wallet extension." }),
15505
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: inlineWaitStyle(tokens.textMuted), children: [
15506
- /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 14 }),
15507
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Waiting for authorization\u2026" })
15508
- ] })
15509
- ] }),
15510
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: qrSectionStyle, children: [
15511
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: qrDividerLabelStyle(tokens.textMuted), children: "or scan with your phone" }),
15512
- hasQr ? /* @__PURE__ */ jsxRuntime.jsx(QrCode, { value: deeplinkUri, size: 180 }) : /* @__PURE__ */ jsxRuntime.jsx(
15614
+ const sharedStyles = /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
15615
+ @keyframes blink-open-wallet-qr-shimmer {
15616
+ 0% { background-position: 200% 0; }
15617
+ 100% { background-position: -200% 0; }
15618
+ }
15619
+ @keyframes blink-open-wallet-ring-spin {
15620
+ to { transform: rotate(360deg); }
15621
+ }
15622
+ ` });
15623
+ if (showQrView) {
15624
+ return /* @__PURE__ */ jsxRuntime.jsxs(
15625
+ ScreenLayout,
15626
+ {
15627
+ footer: error ? /* @__PURE__ */ jsxRuntime.jsx(InfoBanner, { children: error }) : void 0,
15628
+ children: [
15629
+ sharedStyles,
15630
+ /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack: () => setShowQrView(false), onLogout }),
15631
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: desktopContentStyle, children: [
15632
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: qrCardStyle, children: hasQr ? /* @__PURE__ */ jsxRuntime.jsx(QrCode, { value: deeplinkUri, size: 180 }) : /* @__PURE__ */ jsxRuntime.jsx(
15513
15633
  "div",
15514
15634
  {
15515
15635
  role: "status",
@@ -15517,10 +15637,63 @@ function OpenWalletScreen({
15517
15637
  "aria-busy": "true",
15518
15638
  style: qrShimmerStyle2(tokens.bgHover, tokens.border)
15519
15639
  }
15520
- ),
15521
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: qrCaptionStyle(tokens.textMuted), children: qrCaption })
15640
+ ) }),
15641
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: primaryClusterStyle, children: [
15642
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle12(tokens.text), children: "Authorize Your Passkey" }),
15643
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { style: bodyStyle4(tokens.text), children: [
15644
+ "Scan the QR code to open ",
15645
+ displayName,
15646
+ "."
15647
+ ] })
15648
+ ] })
15522
15649
  ] })
15523
- ] })
15650
+ ]
15651
+ }
15652
+ );
15653
+ }
15654
+ return /* @__PURE__ */ jsxRuntime.jsxs(
15655
+ ScreenLayout,
15656
+ {
15657
+ footer: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: footerStackStyle5, children: [
15658
+ error && /* @__PURE__ */ jsxRuntime.jsx(InfoBanner, { children: error }),
15659
+ /* @__PURE__ */ jsxRuntime.jsxs(
15660
+ SecondaryButton,
15661
+ {
15662
+ onClick: onRetryAuthorization,
15663
+ disabled: !onRetryAuthorization,
15664
+ children: [
15665
+ /* @__PURE__ */ jsxRuntime.jsx(WalletIcon, {}),
15666
+ "Open ",
15667
+ displayName,
15668
+ " Extension"
15669
+ ]
15670
+ }
15671
+ ),
15672
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: orDividerStyle, children: [
15673
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: orDividerRuleStyle(tokens.textTertiary) }),
15674
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: orDividerLabelStyle(tokens.textMuted), children: "OR" }),
15675
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: orDividerRuleStyle(tokens.textTertiary) })
15676
+ ] }),
15677
+ /* @__PURE__ */ jsxRuntime.jsxs(
15678
+ SecondaryButton,
15679
+ {
15680
+ onClick: () => setShowQrView(true),
15681
+ disabled: !hasQr,
15682
+ children: [
15683
+ /* @__PURE__ */ jsxRuntime.jsx(QrIcon, {}),
15684
+ "Continue on your phone"
15685
+ ]
15686
+ }
15687
+ )
15688
+ ] }),
15689
+ children: [
15690
+ sharedStyles,
15691
+ /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack, onLogout }),
15692
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: desktopContentStyle, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: primaryClusterStyle, children: [
15693
+ heroBlock,
15694
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle12(tokens.text), children: "Authorize Your Passkey" }),
15695
+ /* @__PURE__ */ jsxRuntime.jsx("p", { style: bodyStyle4(tokens.text), children: "If your wallet didn\u2019t open automatically, tap below." })
15696
+ ] }) })
15524
15697
  ]
15525
15698
  }
15526
15699
  );
@@ -15617,50 +15790,33 @@ var footerStackStyle5 = {
15617
15790
  flexDirection: "column",
15618
15791
  gap: 8
15619
15792
  };
15620
- var logoFrameStyle = {
15621
- position: "relative",
15622
- width: 96,
15623
- height: 96,
15793
+ var qrCardStyle = {
15624
15794
  display: "flex",
15625
15795
  alignItems: "center",
15626
15796
  justifyContent: "center",
15797
+ background: "#FFFFFF",
15798
+ padding: 16,
15799
+ borderRadius: 16,
15627
15800
  flexShrink: 0
15628
15801
  };
15629
- var logoRingSvgStyle = {
15630
- position: "absolute",
15631
- top: "50%",
15632
- left: "50%",
15633
- transform: "translate(-50%, -50%)"
15634
- };
15635
- var spinningRingSvgStyle = {
15636
- position: "absolute",
15637
- top: 0,
15638
- left: 0,
15639
- transformOrigin: "center",
15640
- animation: "blink-open-wallet-ring-spin 0.9s linear infinite"
15641
- };
15642
- var logoCircleStyle2 = (bg) => ({
15643
- width: 80,
15644
- height: 80,
15645
- borderRadius: "50%",
15646
- background: bg,
15802
+ var orDividerStyle = {
15647
15803
  display: "flex",
15648
15804
  alignItems: "center",
15649
15805
  justifyContent: "center",
15650
- flexShrink: 0
15651
- });
15652
- var logoStyle2 = {
15653
- width: 48,
15654
- height: 48,
15655
- borderRadius: 12,
15656
- objectFit: "contain"
15657
- };
15658
- var reownLogoStyle = {
15659
- width: 48,
15660
- height: 48,
15661
- borderRadius: "50%",
15662
- objectFit: "cover"
15806
+ gap: 10,
15807
+ paddingLeft: 16,
15808
+ paddingRight: 16
15663
15809
  };
15810
+ var orDividerRuleStyle = (color) => ({
15811
+ flex: 1,
15812
+ height: 1,
15813
+ background: color
15814
+ });
15815
+ var orDividerLabelStyle = (color) => ({
15816
+ fontSize: "0.75rem",
15817
+ fontWeight: 500,
15818
+ color
15819
+ });
15664
15820
  var headingStyle12 = (color) => ({
15665
15821
  fontSize: "1.5rem",
15666
15822
  fontWeight: 700,
@@ -15677,21 +15833,6 @@ var bodyStyle4 = (color) => ({
15677
15833
  margin: 0,
15678
15834
  maxWidth: 320
15679
15835
  });
15680
- var inlineWaitStyle = (color) => ({
15681
- display: "inline-flex",
15682
- alignItems: "center",
15683
- gap: 8,
15684
- color,
15685
- fontSize: "0.85rem"
15686
- });
15687
- var qrSectionStyle = {
15688
- display: "flex",
15689
- flexDirection: "column",
15690
- alignItems: "center",
15691
- gap: 12,
15692
- width: "100%",
15693
- maxWidth: 320
15694
- };
15695
15836
  var qrShimmerStyle2 = (baseColor, highlightColor) => ({
15696
15837
  width: 180,
15697
15838
  height: 180,
@@ -15700,21 +15841,6 @@ var qrShimmerStyle2 = (baseColor, highlightColor) => ({
15700
15841
  backgroundSize: "200% 100%",
15701
15842
  animation: "blink-open-wallet-qr-shimmer 1.4s ease-in-out infinite"
15702
15843
  });
15703
- var qrDividerLabelStyle = (color) => ({
15704
- fontSize: "0.75rem",
15705
- fontWeight: 600,
15706
- letterSpacing: "0.06em",
15707
- textTransform: "uppercase",
15708
- color
15709
- });
15710
- var qrCaptionStyle = (color) => ({
15711
- fontSize: "0.85rem",
15712
- color,
15713
- margin: 0,
15714
- textAlign: "center",
15715
- maxWidth: 320,
15716
- lineHeight: 1.4
15717
- });
15718
15844
  var mobileContentStyle = {
15719
15845
  flex: 1,
15720
15846
  display: "flex",
@@ -15836,7 +15962,7 @@ function ApprovingInWalletScreen({
15836
15962
  {
15837
15963
  onBack,
15838
15964
  onLogout,
15839
- center: /* @__PURE__ */ jsxRuntime.jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style: wordmarkImgStyle4 })
15965
+ center: /* @__PURE__ */ jsxRuntime.jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style: wordmarkImgStyle5 })
15840
15966
  }
15841
15967
  ),
15842
15968
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle16, children: [
@@ -15940,7 +16066,7 @@ function LockIcon4() {
15940
16066
  }
15941
16067
  ) });
15942
16068
  }
15943
- var wordmarkImgStyle4 = {
16069
+ var wordmarkImgStyle5 = {
15944
16070
  height: 22,
15945
16071
  width: "auto",
15946
16072
  display: "block",
@@ -16073,7 +16199,7 @@ function ConfirmSignScreen({
16073
16199
  children: [
16074
16200
  /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onLogout }),
16075
16201
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle17, children: [
16076
- logoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoSrc, alt: displayName, style: logoStyle3 }) : /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
16202
+ logoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoSrc, alt: displayName, style: logoStyle2 }) : /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
16077
16203
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle14(tokens.text), children: heading }),
16078
16204
  /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle12(tokens.textSecondary), children: subtitle }),
16079
16205
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: successBadgeStyle(tokens), children: [
@@ -16094,7 +16220,7 @@ var contentStyle17 = {
16094
16220
  textAlign: "center",
16095
16221
  padding: "0 24px"
16096
16222
  };
16097
- var logoStyle3 = {
16223
+ var logoStyle2 = {
16098
16224
  width: 56,
16099
16225
  height: 56,
16100
16226
  borderRadius: 14,