@swype-org/react-sdk 0.2.360 → 0.2.364
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 +193 -222
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +193 -222
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -8583,25 +8583,45 @@ function SettingsMenu({ onLogout }) {
|
|
|
8583
8583
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "2", fill: "currentColor" }),
|
|
8584
8584
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "19", r: "2", fill: "currentColor" })
|
|
8585
8585
|
] }) }),
|
|
8586
|
-
open && /* @__PURE__ */
|
|
8587
|
-
|
|
8588
|
-
|
|
8589
|
-
|
|
8590
|
-
|
|
8591
|
-
|
|
8592
|
-
|
|
8593
|
-
|
|
8594
|
-
|
|
8595
|
-
|
|
8596
|
-
|
|
8597
|
-
|
|
8598
|
-
|
|
8599
|
-
|
|
8600
|
-
|
|
8601
|
-
|
|
8602
|
-
|
|
8603
|
-
|
|
8604
|
-
|
|
8586
|
+
open && /* @__PURE__ */ jsxs("div", { style: dropdownStyle(tokens), children: [
|
|
8587
|
+
/* @__PURE__ */ jsxs(
|
|
8588
|
+
"a",
|
|
8589
|
+
{
|
|
8590
|
+
href: "https://intercom.help/blinkcash/en/",
|
|
8591
|
+
target: "_blank",
|
|
8592
|
+
rel: "noopener noreferrer",
|
|
8593
|
+
onClick: () => setOpen(false),
|
|
8594
|
+
style: menuItemStyle(tokens.text),
|
|
8595
|
+
children: [
|
|
8596
|
+
/* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 8, flexShrink: 0 }, children: [
|
|
8597
|
+
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9", stroke: tokens.text, strokeWidth: "2" }),
|
|
8598
|
+
/* @__PURE__ */ 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" }),
|
|
8599
|
+
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "17", r: "1", fill: tokens.text })
|
|
8600
|
+
] }),
|
|
8601
|
+
"Help"
|
|
8602
|
+
]
|
|
8603
|
+
}
|
|
8604
|
+
),
|
|
8605
|
+
/* @__PURE__ */ jsxs(
|
|
8606
|
+
"button",
|
|
8607
|
+
{
|
|
8608
|
+
type: "button",
|
|
8609
|
+
onClick: () => {
|
|
8610
|
+
setOpen(false);
|
|
8611
|
+
onLogout();
|
|
8612
|
+
},
|
|
8613
|
+
style: menuItemStyle(tokens.error),
|
|
8614
|
+
children: [
|
|
8615
|
+
/* @__PURE__ */ jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 8, flexShrink: 0 }, children: [
|
|
8616
|
+
/* @__PURE__ */ jsx("path", { d: "M9 21H5a2 2 0 01-2-2V5a2 2 0 012-2h4", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
|
|
8617
|
+
/* @__PURE__ */ jsx("polyline", { points: "16 17 21 12 16 7", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
|
|
8618
|
+
/* @__PURE__ */ jsx("line", { x1: "21", y1: "12", x2: "9", y2: "12", stroke: tokens.error, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
|
|
8619
|
+
] }),
|
|
8620
|
+
"Log out"
|
|
8621
|
+
]
|
|
8622
|
+
}
|
|
8623
|
+
)
|
|
8624
|
+
] })
|
|
8605
8625
|
] });
|
|
8606
8626
|
}
|
|
8607
8627
|
var containerStyle2 = {
|
|
@@ -8620,7 +8640,7 @@ var dropdownStyle = (tokens) => ({
|
|
|
8620
8640
|
zIndex: 100,
|
|
8621
8641
|
overflow: "hidden"
|
|
8622
8642
|
});
|
|
8623
|
-
var menuItemStyle = (
|
|
8643
|
+
var menuItemStyle = (color) => ({
|
|
8624
8644
|
width: "100%",
|
|
8625
8645
|
display: "flex",
|
|
8626
8646
|
alignItems: "center",
|
|
@@ -8631,7 +8651,9 @@ var menuItemStyle = (tokens) => ({
|
|
|
8631
8651
|
fontFamily: "inherit",
|
|
8632
8652
|
fontSize: "0.85rem",
|
|
8633
8653
|
fontWeight: 500,
|
|
8634
|
-
color
|
|
8654
|
+
color,
|
|
8655
|
+
textDecoration: "none",
|
|
8656
|
+
boxSizing: "border-box"
|
|
8635
8657
|
});
|
|
8636
8658
|
function ScreenHeader({ title, right, onBack, left, badge, onLogout, center }) {
|
|
8637
8659
|
const { tokens } = useBlinkConfig();
|
|
@@ -9144,8 +9166,11 @@ var TOKEN_LOGOS = {
|
|
|
9144
9166
|
};
|
|
9145
9167
|
var CHAIN_LOGOS = {
|
|
9146
9168
|
base: BASE_CHAIN_LOGO,
|
|
9169
|
+
// Testnets use the parent chain's logo (sandbox/smokebox environments).
|
|
9170
|
+
"base sepolia": BASE_CHAIN_LOGO,
|
|
9147
9171
|
ethereum: ETHEREUM_CHAIN_LOGO,
|
|
9148
9172
|
"ethereum mainnet": ETHEREUM_CHAIN_LOGO,
|
|
9173
|
+
sepolia: ETHEREUM_CHAIN_LOGO,
|
|
9149
9174
|
polygon: POLYGON_CHAIN_LOGO,
|
|
9150
9175
|
"polygon mainnet": POLYGON_CHAIN_LOGO,
|
|
9151
9176
|
arbitrum: ARBITRUM_CHAIN_LOGO,
|
|
@@ -10580,6 +10605,38 @@ function FaceIdIcon({ size = 24 }) {
|
|
|
10580
10605
|
/* @__PURE__ */ 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" })
|
|
10581
10606
|
] });
|
|
10582
10607
|
}
|
|
10608
|
+
function WalletIcon() {
|
|
10609
|
+
return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
|
|
10610
|
+
/* @__PURE__ */ jsx(
|
|
10611
|
+
"path",
|
|
10612
|
+
{
|
|
10613
|
+
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",
|
|
10614
|
+
fill: "currentColor"
|
|
10615
|
+
}
|
|
10616
|
+
),
|
|
10617
|
+
/* @__PURE__ */ jsx(
|
|
10618
|
+
"path",
|
|
10619
|
+
{
|
|
10620
|
+
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",
|
|
10621
|
+
fill: "currentColor"
|
|
10622
|
+
}
|
|
10623
|
+
)
|
|
10624
|
+
] });
|
|
10625
|
+
}
|
|
10626
|
+
function QrIcon({ color = "currentColor" } = {}) {
|
|
10627
|
+
return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
|
|
10628
|
+
/* @__PURE__ */ jsx("rect", { x: "3.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
10629
|
+
/* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "2", height: "2", fill: color }),
|
|
10630
|
+
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
10631
|
+
/* @__PURE__ */ jsx("rect", { x: "16", y: "6", width: "2", height: "2", fill: color }),
|
|
10632
|
+
/* @__PURE__ */ jsx("rect", { x: "3.5", y: "13.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
10633
|
+
/* @__PURE__ */ jsx("rect", { x: "6", y: "16", width: "2", height: "2", fill: color }),
|
|
10634
|
+
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "13.5", width: "2.5", height: "2.5", fill: color }),
|
|
10635
|
+
/* @__PURE__ */ jsx("rect", { x: "18", y: "13.5", width: "2.5", height: "2.5", fill: color }),
|
|
10636
|
+
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "18", width: "2.5", height: "2.5", fill: color }),
|
|
10637
|
+
/* @__PURE__ */ jsx("rect", { x: "18", y: "18", width: "2.5", height: "2.5", fill: color })
|
|
10638
|
+
] });
|
|
10639
|
+
}
|
|
10583
10640
|
function LogoCircle({ src, fallback, preserveShape, size = 36 }) {
|
|
10584
10641
|
const { tokens } = useBlinkConfig();
|
|
10585
10642
|
return /* @__PURE__ */ jsx("span", { style: logoCircleStyle(size, tokens.bgCard, tokens.textMuted), children: src ? /* @__PURE__ */ jsx("img", { src, alt: "", style: logoImageStyle(preserveShape) }) : fallback });
|
|
@@ -11265,7 +11322,7 @@ function DepositOptionsScreen({
|
|
|
11265
11322
|
),
|
|
11266
11323
|
children: [
|
|
11267
11324
|
/* @__PURE__ */ jsx("span", { style: manualLabelStyle(tokens.text), children: "Send Crypto Manually" }),
|
|
11268
|
-
/* @__PURE__ */ jsx(
|
|
11325
|
+
/* @__PURE__ */ jsx(QrIcon2, { color: tokens.text })
|
|
11269
11326
|
]
|
|
11270
11327
|
}
|
|
11271
11328
|
)
|
|
@@ -11273,7 +11330,7 @@ function DepositOptionsScreen({
|
|
|
11273
11330
|
] })
|
|
11274
11331
|
] });
|
|
11275
11332
|
}
|
|
11276
|
-
function
|
|
11333
|
+
function QrIcon2({ color }) {
|
|
11277
11334
|
return /* @__PURE__ */ jsxs(
|
|
11278
11335
|
"svg",
|
|
11279
11336
|
{
|
|
@@ -11463,7 +11520,7 @@ function WelcomeBackScreen({
|
|
|
11463
11520
|
),
|
|
11464
11521
|
children: [
|
|
11465
11522
|
/* @__PURE__ */ jsx("span", { style: manualLabelStyle2(tokens.text), children: "Send Crypto Manually" }),
|
|
11466
|
-
/* @__PURE__ */ jsx(
|
|
11523
|
+
/* @__PURE__ */ jsx(QrIcon3, { color: tokens.text })
|
|
11467
11524
|
]
|
|
11468
11525
|
}
|
|
11469
11526
|
)
|
|
@@ -11471,7 +11528,7 @@ function WelcomeBackScreen({
|
|
|
11471
11528
|
] })
|
|
11472
11529
|
] });
|
|
11473
11530
|
}
|
|
11474
|
-
function
|
|
11531
|
+
function QrIcon3({ color }) {
|
|
11475
11532
|
return /* @__PURE__ */ jsxs(
|
|
11476
11533
|
"svg",
|
|
11477
11534
|
{
|
|
@@ -13581,7 +13638,7 @@ function SelectDepositSourceScreen({
|
|
|
13581
13638
|
label: "Send manually",
|
|
13582
13639
|
color: tokens.text,
|
|
13583
13640
|
onClick: onSendManually,
|
|
13584
|
-
icon: /* @__PURE__ */ jsx(
|
|
13641
|
+
icon: /* @__PURE__ */ jsx(QrIcon, { color: tokens.text })
|
|
13585
13642
|
}
|
|
13586
13643
|
),
|
|
13587
13644
|
onAddProvider && /* @__PURE__ */ jsx(
|
|
@@ -13697,38 +13754,6 @@ function ActionRow({
|
|
|
13697
13754
|
}
|
|
13698
13755
|
);
|
|
13699
13756
|
}
|
|
13700
|
-
function QrIcon3({ color }) {
|
|
13701
|
-
return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
|
|
13702
|
-
/* @__PURE__ */ jsx("rect", { x: "3.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
13703
|
-
/* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "2", height: "2", fill: color }),
|
|
13704
|
-
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "3.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
13705
|
-
/* @__PURE__ */ jsx("rect", { x: "16", y: "6", width: "2", height: "2", fill: color }),
|
|
13706
|
-
/* @__PURE__ */ jsx("rect", { x: "3.5", y: "13.5", width: "7", height: "7", rx: "1", stroke: color, strokeWidth: "1.4" }),
|
|
13707
|
-
/* @__PURE__ */ jsx("rect", { x: "6", y: "16", width: "2", height: "2", fill: color }),
|
|
13708
|
-
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "13.5", width: "2.5", height: "2.5", fill: color }),
|
|
13709
|
-
/* @__PURE__ */ jsx("rect", { x: "18", y: "13.5", width: "2.5", height: "2.5", fill: color }),
|
|
13710
|
-
/* @__PURE__ */ jsx("rect", { x: "13.5", y: "18", width: "2.5", height: "2.5", fill: color }),
|
|
13711
|
-
/* @__PURE__ */ jsx("rect", { x: "18", y: "18", width: "2.5", height: "2.5", fill: color })
|
|
13712
|
-
] });
|
|
13713
|
-
}
|
|
13714
|
-
function WalletIcon() {
|
|
13715
|
-
return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
|
|
13716
|
-
/* @__PURE__ */ jsx(
|
|
13717
|
-
"path",
|
|
13718
|
-
{
|
|
13719
|
-
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",
|
|
13720
|
-
fill: "currentColor"
|
|
13721
|
-
}
|
|
13722
|
-
),
|
|
13723
|
-
/* @__PURE__ */ jsx(
|
|
13724
|
-
"path",
|
|
13725
|
-
{
|
|
13726
|
-
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",
|
|
13727
|
-
fill: "currentColor"
|
|
13728
|
-
}
|
|
13729
|
-
)
|
|
13730
|
-
] });
|
|
13731
|
-
}
|
|
13732
13757
|
var actionRowStyle = (color, hovered) => ({
|
|
13733
13758
|
display: "flex",
|
|
13734
13759
|
alignItems: "center",
|
|
@@ -13968,7 +13993,13 @@ function DepositScreen({
|
|
|
13968
13993
|
100% { background-position: -200% 0; }
|
|
13969
13994
|
}
|
|
13970
13995
|
` }),
|
|
13971
|
-
/* @__PURE__ */ jsx(
|
|
13996
|
+
/* @__PURE__ */ jsx(
|
|
13997
|
+
ScreenHeader,
|
|
13998
|
+
{
|
|
13999
|
+
left: /* @__PURE__ */ jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style: wordmarkImgStyle4 }),
|
|
14000
|
+
onLogout
|
|
14001
|
+
}
|
|
14002
|
+
),
|
|
13972
14003
|
/* @__PURE__ */ jsxs("div", { style: redesignHeroStackStyle(mobileEntryWithKeypad), children: [
|
|
13973
14004
|
showDesktopInputHero ? /* @__PURE__ */ jsxs("div", { style: entryDesktopHeroRowStyle(desktopInputHeroColor, getDesktopHeroFontSize(liveMobileHeroValue)), children: [
|
|
13974
14005
|
/* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: entryDollarStyle(isZero), children: "$" }),
|
|
@@ -14108,6 +14139,11 @@ function FaceIdIcon2() {
|
|
|
14108
14139
|
)
|
|
14109
14140
|
] });
|
|
14110
14141
|
}
|
|
14142
|
+
var wordmarkImgStyle4 = {
|
|
14143
|
+
height: 31,
|
|
14144
|
+
width: "auto",
|
|
14145
|
+
display: "block"
|
|
14146
|
+
};
|
|
14111
14147
|
var bannerSlotStyle2 = {
|
|
14112
14148
|
display: "flex",
|
|
14113
14149
|
justifyContent: "center",
|
|
@@ -15327,6 +15363,7 @@ function OpenWalletScreen({
|
|
|
15327
15363
|
onLogout
|
|
15328
15364
|
}) {
|
|
15329
15365
|
const { tokens } = useBlinkConfig();
|
|
15366
|
+
const [showQrView, setShowQrView] = useState(false);
|
|
15330
15367
|
const displayName = walletName ?? "your wallet";
|
|
15331
15368
|
const logoSrc = walletLogoUrl ?? (walletName ? KNOWN_LOGOS[walletName.toLowerCase()] : void 0);
|
|
15332
15369
|
const autoOpenedRef = useRef(null);
|
|
@@ -15344,61 +15381,6 @@ function OpenWalletScreen({
|
|
|
15344
15381
|
const handleOpen = useCallback(() => {
|
|
15345
15382
|
openDeeplink(deeplinkUri);
|
|
15346
15383
|
}, [deeplinkUri]);
|
|
15347
|
-
const logoBlock = /* @__PURE__ */ jsxs("div", { style: logoFrameStyle, children: [
|
|
15348
|
-
/* @__PURE__ */ jsx(
|
|
15349
|
-
"svg",
|
|
15350
|
-
{
|
|
15351
|
-
width: "96",
|
|
15352
|
-
height: "96",
|
|
15353
|
-
viewBox: "0 0 96 96",
|
|
15354
|
-
fill: "none",
|
|
15355
|
-
style: logoRingSvgStyle,
|
|
15356
|
-
"aria-hidden": true,
|
|
15357
|
-
children: /* @__PURE__ */ jsx(
|
|
15358
|
-
"circle",
|
|
15359
|
-
{
|
|
15360
|
-
cx: "48",
|
|
15361
|
-
cy: "48",
|
|
15362
|
-
r: "47",
|
|
15363
|
-
stroke: tokens.textMuted,
|
|
15364
|
-
strokeOpacity: "0.18",
|
|
15365
|
-
strokeWidth: "2",
|
|
15366
|
-
fill: "none"
|
|
15367
|
-
}
|
|
15368
|
-
)
|
|
15369
|
-
}
|
|
15370
|
-
),
|
|
15371
|
-
/* @__PURE__ */ jsx(
|
|
15372
|
-
"svg",
|
|
15373
|
-
{
|
|
15374
|
-
width: "96",
|
|
15375
|
-
height: "96",
|
|
15376
|
-
viewBox: "0 0 96 96",
|
|
15377
|
-
fill: "none",
|
|
15378
|
-
style: spinningRingSvgStyle,
|
|
15379
|
-
"aria-hidden": true,
|
|
15380
|
-
children: /* @__PURE__ */ jsx(
|
|
15381
|
-
"path",
|
|
15382
|
-
{
|
|
15383
|
-
d: "M 71.7 89.04 A 47 47 0 1 1 89.04 71.7",
|
|
15384
|
-
stroke: tokens.textMuted,
|
|
15385
|
-
strokeOpacity: "0.65",
|
|
15386
|
-
strokeWidth: "2",
|
|
15387
|
-
fill: "none",
|
|
15388
|
-
strokeLinecap: "round"
|
|
15389
|
-
}
|
|
15390
|
-
)
|
|
15391
|
-
}
|
|
15392
|
-
),
|
|
15393
|
-
/* @__PURE__ */ jsx("div", { style: logoCircleStyle2(tokens.bgRecessed), children: logoSrc && /* @__PURE__ */ jsx(
|
|
15394
|
-
"img",
|
|
15395
|
-
{
|
|
15396
|
-
src: logoSrc,
|
|
15397
|
-
alt: displayName,
|
|
15398
|
-
style: walletLogoUrl ? reownLogoStyle : logoStyle2
|
|
15399
|
-
}
|
|
15400
|
-
) })
|
|
15401
|
-
] });
|
|
15402
15384
|
const heroBlock = /* @__PURE__ */ jsxs("div", { style: heroFrameStyle, "aria-hidden": true, children: [
|
|
15403
15385
|
/* @__PURE__ */ jsx(
|
|
15404
15386
|
"svg",
|
|
@@ -15447,42 +15429,25 @@ function OpenWalletScreen({
|
|
|
15447
15429
|
] });
|
|
15448
15430
|
if (!useDeeplink) {
|
|
15449
15431
|
const hasQr = !!deeplinkUri;
|
|
15450
|
-
const
|
|
15451
|
-
|
|
15452
|
-
|
|
15453
|
-
|
|
15454
|
-
|
|
15455
|
-
|
|
15456
|
-
|
|
15457
|
-
|
|
15458
|
-
|
|
15459
|
-
|
|
15460
|
-
|
|
15461
|
-
|
|
15462
|
-
|
|
15463
|
-
}
|
|
15464
|
-
|
|
15465
|
-
|
|
15466
|
-
|
|
15467
|
-
|
|
15468
|
-
|
|
15469
|
-
/* @__PURE__ */ jsxs("div", { style: desktopContentStyle, children: [
|
|
15470
|
-
/* @__PURE__ */ jsxs("div", { style: primaryClusterStyle, children: [
|
|
15471
|
-
logoBlock,
|
|
15472
|
-
/* @__PURE__ */ jsxs("h2", { style: headingStyle12(tokens.text), children: [
|
|
15473
|
-
"Setting up ",
|
|
15474
|
-
displayName,
|
|
15475
|
-
"\u2026"
|
|
15476
|
-
] }),
|
|
15477
|
-
/* @__PURE__ */ jsx("p", { style: bodyStyle4(tokens.text), children: "Approve the connection in your wallet extension." }),
|
|
15478
|
-
/* @__PURE__ */ jsxs("div", { style: inlineWaitStyle(tokens.textMuted), children: [
|
|
15479
|
-
/* @__PURE__ */ jsx(Spinner, { size: 14 }),
|
|
15480
|
-
/* @__PURE__ */ jsx("span", { children: "Waiting for authorization\u2026" })
|
|
15481
|
-
] })
|
|
15482
|
-
] }),
|
|
15483
|
-
/* @__PURE__ */ jsxs("div", { style: qrSectionStyle, children: [
|
|
15484
|
-
/* @__PURE__ */ jsx("span", { style: qrDividerLabelStyle(tokens.textMuted), children: "or scan with your phone" }),
|
|
15485
|
-
hasQr ? /* @__PURE__ */ jsx(QrCode, { value: deeplinkUri, size: 180 }) : /* @__PURE__ */ jsx(
|
|
15432
|
+
const sharedStyles = /* @__PURE__ */ jsx("style", { children: `
|
|
15433
|
+
@keyframes blink-open-wallet-qr-shimmer {
|
|
15434
|
+
0% { background-position: 200% 0; }
|
|
15435
|
+
100% { background-position: -200% 0; }
|
|
15436
|
+
}
|
|
15437
|
+
@keyframes blink-open-wallet-ring-spin {
|
|
15438
|
+
to { transform: rotate(360deg); }
|
|
15439
|
+
}
|
|
15440
|
+
` });
|
|
15441
|
+
if (showQrView) {
|
|
15442
|
+
return /* @__PURE__ */ jsxs(
|
|
15443
|
+
ScreenLayout,
|
|
15444
|
+
{
|
|
15445
|
+
footer: error ? /* @__PURE__ */ jsx(InfoBanner, { children: error }) : void 0,
|
|
15446
|
+
children: [
|
|
15447
|
+
sharedStyles,
|
|
15448
|
+
/* @__PURE__ */ jsx(ScreenHeader, { onBack: () => setShowQrView(false), onLogout }),
|
|
15449
|
+
/* @__PURE__ */ jsxs("div", { style: desktopContentStyle, children: [
|
|
15450
|
+
/* @__PURE__ */ jsx("div", { style: qrCardStyle, children: hasQr ? /* @__PURE__ */ jsx(QrCode, { value: deeplinkUri, size: 180 }) : /* @__PURE__ */ jsx(
|
|
15486
15451
|
"div",
|
|
15487
15452
|
{
|
|
15488
15453
|
role: "status",
|
|
@@ -15490,10 +15455,63 @@ function OpenWalletScreen({
|
|
|
15490
15455
|
"aria-busy": "true",
|
|
15491
15456
|
style: qrShimmerStyle2(tokens.bgHover, tokens.border)
|
|
15492
15457
|
}
|
|
15493
|
-
),
|
|
15494
|
-
/* @__PURE__ */
|
|
15458
|
+
) }),
|
|
15459
|
+
/* @__PURE__ */ jsxs("div", { style: primaryClusterStyle, children: [
|
|
15460
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle12(tokens.text), children: "Authorize Your Passkey" }),
|
|
15461
|
+
/* @__PURE__ */ jsxs("p", { style: bodyStyle4(tokens.text), children: [
|
|
15462
|
+
"Scan the QR code to open ",
|
|
15463
|
+
displayName,
|
|
15464
|
+
"."
|
|
15465
|
+
] })
|
|
15466
|
+
] })
|
|
15495
15467
|
] })
|
|
15496
|
-
]
|
|
15468
|
+
]
|
|
15469
|
+
}
|
|
15470
|
+
);
|
|
15471
|
+
}
|
|
15472
|
+
return /* @__PURE__ */ jsxs(
|
|
15473
|
+
ScreenLayout,
|
|
15474
|
+
{
|
|
15475
|
+
footer: /* @__PURE__ */ jsxs("div", { style: footerStackStyle5, children: [
|
|
15476
|
+
error && /* @__PURE__ */ jsx(InfoBanner, { children: error }),
|
|
15477
|
+
/* @__PURE__ */ jsxs(
|
|
15478
|
+
SecondaryButton,
|
|
15479
|
+
{
|
|
15480
|
+
onClick: onRetryAuthorization,
|
|
15481
|
+
disabled: !onRetryAuthorization,
|
|
15482
|
+
children: [
|
|
15483
|
+
/* @__PURE__ */ jsx(WalletIcon, {}),
|
|
15484
|
+
"Open ",
|
|
15485
|
+
displayName,
|
|
15486
|
+
" Extension"
|
|
15487
|
+
]
|
|
15488
|
+
}
|
|
15489
|
+
),
|
|
15490
|
+
/* @__PURE__ */ jsxs("div", { style: orDividerStyle, children: [
|
|
15491
|
+
/* @__PURE__ */ jsx("span", { style: orDividerRuleStyle(tokens.textTertiary) }),
|
|
15492
|
+
/* @__PURE__ */ jsx("span", { style: orDividerLabelStyle(tokens.textMuted), children: "OR" }),
|
|
15493
|
+
/* @__PURE__ */ jsx("span", { style: orDividerRuleStyle(tokens.textTertiary) })
|
|
15494
|
+
] }),
|
|
15495
|
+
/* @__PURE__ */ jsxs(
|
|
15496
|
+
SecondaryButton,
|
|
15497
|
+
{
|
|
15498
|
+
onClick: () => setShowQrView(true),
|
|
15499
|
+
disabled: !hasQr,
|
|
15500
|
+
children: [
|
|
15501
|
+
/* @__PURE__ */ jsx(QrIcon, {}),
|
|
15502
|
+
"Continue on your phone"
|
|
15503
|
+
]
|
|
15504
|
+
}
|
|
15505
|
+
)
|
|
15506
|
+
] }),
|
|
15507
|
+
children: [
|
|
15508
|
+
sharedStyles,
|
|
15509
|
+
/* @__PURE__ */ jsx(ScreenHeader, { onBack, onLogout }),
|
|
15510
|
+
/* @__PURE__ */ jsx("div", { style: desktopContentStyle, children: /* @__PURE__ */ jsxs("div", { style: primaryClusterStyle, children: [
|
|
15511
|
+
heroBlock,
|
|
15512
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle12(tokens.text), children: "Authorize Your Passkey" }),
|
|
15513
|
+
/* @__PURE__ */ jsx("p", { style: bodyStyle4(tokens.text), children: "If your wallet didn\u2019t open automatically, tap below." })
|
|
15514
|
+
] }) })
|
|
15497
15515
|
]
|
|
15498
15516
|
}
|
|
15499
15517
|
);
|
|
@@ -15590,50 +15608,33 @@ var footerStackStyle5 = {
|
|
|
15590
15608
|
flexDirection: "column",
|
|
15591
15609
|
gap: 8
|
|
15592
15610
|
};
|
|
15593
|
-
var
|
|
15594
|
-
position: "relative",
|
|
15595
|
-
width: 96,
|
|
15596
|
-
height: 96,
|
|
15611
|
+
var qrCardStyle = {
|
|
15597
15612
|
display: "flex",
|
|
15598
15613
|
alignItems: "center",
|
|
15599
15614
|
justifyContent: "center",
|
|
15615
|
+
background: "#FFFFFF",
|
|
15616
|
+
padding: 16,
|
|
15617
|
+
borderRadius: 16,
|
|
15600
15618
|
flexShrink: 0
|
|
15601
15619
|
};
|
|
15602
|
-
var
|
|
15603
|
-
position: "absolute",
|
|
15604
|
-
top: "50%",
|
|
15605
|
-
left: "50%",
|
|
15606
|
-
transform: "translate(-50%, -50%)"
|
|
15607
|
-
};
|
|
15608
|
-
var spinningRingSvgStyle = {
|
|
15609
|
-
position: "absolute",
|
|
15610
|
-
top: 0,
|
|
15611
|
-
left: 0,
|
|
15612
|
-
transformOrigin: "center",
|
|
15613
|
-
animation: "blink-open-wallet-ring-spin 0.9s linear infinite"
|
|
15614
|
-
};
|
|
15615
|
-
var logoCircleStyle2 = (bg) => ({
|
|
15616
|
-
width: 80,
|
|
15617
|
-
height: 80,
|
|
15618
|
-
borderRadius: "50%",
|
|
15619
|
-
background: bg,
|
|
15620
|
+
var orDividerStyle = {
|
|
15620
15621
|
display: "flex",
|
|
15621
15622
|
alignItems: "center",
|
|
15622
15623
|
justifyContent: "center",
|
|
15623
|
-
|
|
15624
|
-
|
|
15625
|
-
|
|
15626
|
-
width: 48,
|
|
15627
|
-
height: 48,
|
|
15628
|
-
borderRadius: 12,
|
|
15629
|
-
objectFit: "contain"
|
|
15630
|
-
};
|
|
15631
|
-
var reownLogoStyle = {
|
|
15632
|
-
width: 48,
|
|
15633
|
-
height: 48,
|
|
15634
|
-
borderRadius: "50%",
|
|
15635
|
-
objectFit: "cover"
|
|
15624
|
+
gap: 10,
|
|
15625
|
+
paddingLeft: 16,
|
|
15626
|
+
paddingRight: 16
|
|
15636
15627
|
};
|
|
15628
|
+
var orDividerRuleStyle = (color) => ({
|
|
15629
|
+
flex: 1,
|
|
15630
|
+
height: 1,
|
|
15631
|
+
background: color
|
|
15632
|
+
});
|
|
15633
|
+
var orDividerLabelStyle = (color) => ({
|
|
15634
|
+
fontSize: "0.75rem",
|
|
15635
|
+
fontWeight: 500,
|
|
15636
|
+
color
|
|
15637
|
+
});
|
|
15637
15638
|
var headingStyle12 = (color) => ({
|
|
15638
15639
|
fontSize: "1.5rem",
|
|
15639
15640
|
fontWeight: 700,
|
|
@@ -15650,21 +15651,6 @@ var bodyStyle4 = (color) => ({
|
|
|
15650
15651
|
margin: 0,
|
|
15651
15652
|
maxWidth: 320
|
|
15652
15653
|
});
|
|
15653
|
-
var inlineWaitStyle = (color) => ({
|
|
15654
|
-
display: "inline-flex",
|
|
15655
|
-
alignItems: "center",
|
|
15656
|
-
gap: 8,
|
|
15657
|
-
color,
|
|
15658
|
-
fontSize: "0.85rem"
|
|
15659
|
-
});
|
|
15660
|
-
var qrSectionStyle = {
|
|
15661
|
-
display: "flex",
|
|
15662
|
-
flexDirection: "column",
|
|
15663
|
-
alignItems: "center",
|
|
15664
|
-
gap: 12,
|
|
15665
|
-
width: "100%",
|
|
15666
|
-
maxWidth: 320
|
|
15667
|
-
};
|
|
15668
15654
|
var qrShimmerStyle2 = (baseColor, highlightColor) => ({
|
|
15669
15655
|
width: 180,
|
|
15670
15656
|
height: 180,
|
|
@@ -15673,21 +15659,6 @@ var qrShimmerStyle2 = (baseColor, highlightColor) => ({
|
|
|
15673
15659
|
backgroundSize: "200% 100%",
|
|
15674
15660
|
animation: "blink-open-wallet-qr-shimmer 1.4s ease-in-out infinite"
|
|
15675
15661
|
});
|
|
15676
|
-
var qrDividerLabelStyle = (color) => ({
|
|
15677
|
-
fontSize: "0.75rem",
|
|
15678
|
-
fontWeight: 600,
|
|
15679
|
-
letterSpacing: "0.06em",
|
|
15680
|
-
textTransform: "uppercase",
|
|
15681
|
-
color
|
|
15682
|
-
});
|
|
15683
|
-
var qrCaptionStyle = (color) => ({
|
|
15684
|
-
fontSize: "0.85rem",
|
|
15685
|
-
color,
|
|
15686
|
-
margin: 0,
|
|
15687
|
-
textAlign: "center",
|
|
15688
|
-
maxWidth: 320,
|
|
15689
|
-
lineHeight: 1.4
|
|
15690
|
-
});
|
|
15691
15662
|
var mobileContentStyle = {
|
|
15692
15663
|
flex: 1,
|
|
15693
15664
|
display: "flex",
|
|
@@ -15809,7 +15780,7 @@ function ApprovingInWalletScreen({
|
|
|
15809
15780
|
{
|
|
15810
15781
|
onBack,
|
|
15811
15782
|
onLogout,
|
|
15812
|
-
center: /* @__PURE__ */ jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style:
|
|
15783
|
+
center: /* @__PURE__ */ jsx("img", { src: BLINK_WORDMARK, alt: "Blink", style: wordmarkImgStyle5 })
|
|
15813
15784
|
}
|
|
15814
15785
|
),
|
|
15815
15786
|
/* @__PURE__ */ jsxs("div", { style: contentStyle16, children: [
|
|
@@ -15913,7 +15884,7 @@ function LockIcon4() {
|
|
|
15913
15884
|
}
|
|
15914
15885
|
) });
|
|
15915
15886
|
}
|
|
15916
|
-
var
|
|
15887
|
+
var wordmarkImgStyle5 = {
|
|
15917
15888
|
height: 22,
|
|
15918
15889
|
width: "auto",
|
|
15919
15890
|
display: "block",
|
|
@@ -16046,7 +16017,7 @@ function ConfirmSignScreen({
|
|
|
16046
16017
|
children: [
|
|
16047
16018
|
/* @__PURE__ */ jsx(ScreenHeader, { onLogout }),
|
|
16048
16019
|
/* @__PURE__ */ jsxs("div", { style: contentStyle17, children: [
|
|
16049
|
-
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style:
|
|
16020
|
+
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style: logoStyle2 }) : /* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
16050
16021
|
/* @__PURE__ */ jsx("h2", { style: headingStyle14(tokens.text), children: heading }),
|
|
16051
16022
|
/* @__PURE__ */ jsx("p", { style: subtitleStyle12(tokens.textSecondary), children: subtitle }),
|
|
16052
16023
|
/* @__PURE__ */ jsxs("div", { style: successBadgeStyle(tokens), children: [
|
|
@@ -16067,7 +16038,7 @@ var contentStyle17 = {
|
|
|
16067
16038
|
textAlign: "center",
|
|
16068
16039
|
padding: "0 24px"
|
|
16069
16040
|
};
|
|
16070
|
-
var
|
|
16041
|
+
var logoStyle2 = {
|
|
16071
16042
|
width: 56,
|
|
16072
16043
|
height: 56,
|
|
16073
16044
|
borderRadius: 14,
|