@swype-org/react-sdk 0.2.224 → 0.2.226

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
@@ -10975,10 +10975,7 @@ function DepositOptionsScreen({
10975
10975
  name: "Connect Wallet",
10976
10976
  icon: /* @__PURE__ */ jsxRuntime.jsx(WalletIcon, { color: tokens.text }),
10977
10977
  onClick: onFromWallet,
10978
- right: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: badgeWithArrowStyle, children: [
10979
- /* @__PURE__ */ jsxRuntime.jsx(RecommendedBadge, { tokens }),
10980
- /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 6l6 6-6 6", stroke: tokens.textMuted, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
10981
- ] })
10978
+ right: /* @__PURE__ */ jsxRuntime.jsx("span", { style: badgeWithArrowStyle, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9 6l6 6-6 6", stroke: tokens.textMuted, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
10982
10979
  }
10983
10980
  ),
10984
10981
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -11011,9 +11008,6 @@ function DepositTypeToggle({ tokens }) {
11011
11008
  function ComingSoonBadge({ tokens }) {
11012
11009
  return /* @__PURE__ */ jsxRuntime.jsx("span", { style: comingSoonBadgeStyle(tokens.bgRecessed, tokens.textMuted), children: "Coming soon" });
11013
11010
  }
11014
- function RecommendedBadge({ tokens }) {
11015
- return /* @__PURE__ */ jsxRuntime.jsx("span", { style: recommendedBadgeStyle(tokens.successBg, tokens.success), children: "Recommended" });
11016
- }
11017
11011
  function WalletIcon({ color }) {
11018
11012
  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
11019
11013
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -11174,19 +11168,6 @@ var badgeWithArrowStyle = {
11174
11168
  display: "flex",
11175
11169
  alignItems: "center"
11176
11170
  };
11177
- var recommendedBadgeStyle = (bg, color) => ({
11178
- display: "inline-flex",
11179
- alignItems: "center",
11180
- justifyContent: "center",
11181
- background: bg,
11182
- color,
11183
- fontSize: 10,
11184
- fontWeight: 500,
11185
- lineHeight: 1,
11186
- padding: "4px 8px",
11187
- borderRadius: 8,
11188
- whiteSpace: "nowrap"
11189
- });
11190
11171
  var linkIconImageStyle = (color) => ({
11191
11172
  width: 24,
11192
11173
  height: 24,
@@ -11318,7 +11299,7 @@ function AmountTooLowScreen({
11318
11299
  }
11319
11300
  );
11320
11301
  }
11321
- var DEFAULT_PRESETS = [50, 100, 200, 500];
11302
+ var DEFAULT_PRESETS = [5, 25, 100, 250];
11322
11303
  function EnterAmountScreen({
11323
11304
  value,
11324
11305
  onDigit,
@@ -11895,7 +11876,7 @@ function PasskeyPopupWelcomeScreen({
11895
11876
  ) }),
11896
11877
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle5(tokens.text), children: "Try the better way\nto deposit" }),
11897
11878
  /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle3(tokens.textSecondary), children: "From your wallet, to any app, in one tap." }),
11898
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle3(tokens), children: error })
11879
+ error && false
11899
11880
  ] })
11900
11881
  ]
11901
11882
  }
@@ -11951,17 +11932,6 @@ var footerButtonStyle = {
11951
11932
  paddingTop: 48,
11952
11933
  paddingBottom: 36
11953
11934
  };
11954
- var errorBannerStyle3 = (tokens) => ({
11955
- background: tokens.errorBg,
11956
- border: `1px solid ${tokens.error}66`,
11957
- borderRadius: 16,
11958
- padding: "11px 14px",
11959
- color: tokens.error,
11960
- fontSize: "0.84rem",
11961
- lineHeight: 1.5,
11962
- width: "100%",
11963
- textAlign: "left"
11964
- });
11965
11935
  function PasskeyReadyScreen({
11966
11936
  onLinkWallet,
11967
11937
  onBack,
@@ -12065,7 +12035,7 @@ function VerifyPasskeyScreen({
12065
12035
  ] }) }),
12066
12036
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle7(tokens.text), children: "Verify your passkey" }),
12067
12037
  /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle5(tokens.textSecondary), children: subtitle }),
12068
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle4(tokens), children: error }),
12038
+ error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle3(tokens), children: error }),
12069
12039
  /* @__PURE__ */ jsxRuntime.jsx(InfoBanner, { children: "Your passkey is stored securely on your device. Blink never sees your biometric data." })
12070
12040
  ] })
12071
12041
  ]
@@ -12094,7 +12064,7 @@ var subtitleStyle5 = (color) => ({
12094
12064
  lineHeight: 1.5,
12095
12065
  maxWidth: 280
12096
12066
  });
12097
- var errorBannerStyle4 = (tokens) => ({
12067
+ var errorBannerStyle3 = (tokens) => ({
12098
12068
  background: tokens.errorBg,
12099
12069
  border: `1px solid ${tokens.error}66`,
12100
12070
  borderRadius: 16,
@@ -12448,7 +12418,7 @@ function WalletPickerScreen({
12448
12418
  }
12449
12419
  ),
12450
12420
  /* @__PURE__ */ jsxRuntime.jsx("h1", { style: titleStyle3(tokens.text), children: "Link wallet" }),
12451
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle5(tokens), children: error }),
12421
+ error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle4(tokens), children: error }),
12452
12422
  /* @__PURE__ */ jsxRuntime.jsx("div", { style: sheetStackStyle, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: cardStyle2(tokens.bgCardTranslucent), children: showOtherWallets ? /* @__PURE__ */ jsxRuntime.jsx(
12453
12423
  OtherWalletsPanel,
12454
12424
  {
@@ -12759,7 +12729,7 @@ var loadingWrapperStyle = {
12759
12729
  alignItems: "center",
12760
12730
  justifyContent: "center"
12761
12731
  };
12762
- var errorBannerStyle5 = (tokens) => ({
12732
+ var errorBannerStyle4 = (tokens) => ({
12763
12733
  background: tokens.errorBg,
12764
12734
  border: `1px solid ${tokens.error}66`,
12765
12735
  borderRadius: 16,
@@ -12916,7 +12886,7 @@ function SetupScreen({
12916
12886
  ),
12917
12887
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle8(tokens.text), children: "Next time deposit\nUSDC in one tap" }),
12918
12888
  /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle6(tokens.textSecondary), children: "Set a cap for passkey deposits.\nYou always stay in control." }),
12919
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle6(tokens), children: error }),
12889
+ error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle5(tokens), children: error }),
12920
12890
  /* @__PURE__ */ jsxRuntime.jsx("div", { style: chipsRowStyle, children: PRESETS.map(({ label, value }) => {
12921
12891
  const active = selectedPreset === value;
12922
12892
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -13006,7 +12976,7 @@ var chipStyle = (themeTokens, active) => ({
13006
12976
  color: active ? themeTokens.accentText : themeTokens.text,
13007
12977
  whiteSpace: "nowrap"
13008
12978
  });
13009
- var errorBannerStyle6 = (themeTokens) => ({
12979
+ var errorBannerStyle5 = (themeTokens) => ({
13010
12980
  background: themeTokens.errorBg,
13011
12981
  border: `1px solid ${themeTokens.error}66`,
13012
12982
  borderRadius: 16,
@@ -13017,217 +12987,6 @@ var errorBannerStyle6 = (themeTokens) => ({
13017
12987
  width: "100%",
13018
12988
  textAlign: "left"
13019
12989
  });
13020
- function ManualTransferPasskeyScreen({
13021
- onCreatePasskey,
13022
- loading = false,
13023
- error,
13024
- onBack,
13025
- onClose
13026
- }) {
13027
- const { tokens } = useBlinkConfig();
13028
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle8(tokens), children: [
13029
- onBack && /* @__PURE__ */ jsxRuntime.jsx(
13030
- "button",
13031
- {
13032
- type: "button",
13033
- onClick: onBack,
13034
- "aria-label": "Go back",
13035
- style: { ...navButtonStyle(tokens.bgRecessed, tokens.text), left: 16 },
13036
- children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
13037
- "path",
13038
- {
13039
- d: "M15 18l-6-6 6-6",
13040
- stroke: "currentColor",
13041
- strokeWidth: "2",
13042
- strokeLinecap: "round",
13043
- strokeLinejoin: "round"
13044
- }
13045
- ) })
13046
- }
13047
- ),
13048
- onClose && /* @__PURE__ */ jsxRuntime.jsx(
13049
- "button",
13050
- {
13051
- type: "button",
13052
- onClick: onClose,
13053
- "aria-label": "Close",
13054
- style: { ...navButtonStyle(tokens.bgRecessed, tokens.text), right: 16 },
13055
- children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
13056
- "path",
13057
- {
13058
- d: "M6 6l12 12M18 6L6 18",
13059
- stroke: "currentColor",
13060
- strokeWidth: "2",
13061
- strokeLinecap: "round",
13062
- strokeLinejoin: "round"
13063
- }
13064
- ) })
13065
- }
13066
- ),
13067
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle11, children: [
13068
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: heroStyle, children: [
13069
- /* @__PURE__ */ jsxRuntime.jsx(
13070
- "img",
13071
- {
13072
- src: FACE_ID_ILLUSTRATION,
13073
- alt: "",
13074
- "aria-hidden": "true",
13075
- style: illustrationStyle4
13076
- }
13077
- ),
13078
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: copyStackStyle, children: [
13079
- /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle9(tokens.text), children: "Next time deposit USDC\nin one tap" }),
13080
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle7(tokens.text), children: "Set up once and never bother\nwith QR codes again" }),
13081
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle7(tokens), children: error })
13082
- ] })
13083
- ] }),
13084
- /* @__PURE__ */ jsxRuntime.jsxs(
13085
- "button",
13086
- {
13087
- type: "button",
13088
- onClick: onCreatePasskey,
13089
- disabled: loading,
13090
- style: ctaStyle(tokens, loading),
13091
- children: [
13092
- !loading && /* @__PURE__ */ jsxRuntime.jsx(
13093
- "img",
13094
- {
13095
- src: BLINK_QR_LOGO,
13096
- alt: "",
13097
- "aria-hidden": "true",
13098
- style: ctaIconStyle
13099
- }
13100
- ),
13101
- "Create Blink Passkey"
13102
- ]
13103
- }
13104
- )
13105
- ] })
13106
- ] });
13107
- }
13108
- var containerStyle8 = (tokens) => ({
13109
- position: "relative",
13110
- display: "flex",
13111
- flexDirection: "column",
13112
- width: "100%",
13113
- maxWidth: 420,
13114
- height: "100%",
13115
- margin: "0 auto",
13116
- overflow: "hidden",
13117
- borderRadius: tokens.radiusLg,
13118
- background: tokens.bgCard,
13119
- backdropFilter: "blur(16px)",
13120
- WebkitBackdropFilter: "blur(16px)",
13121
- fontFamily: tokens.fontFamily,
13122
- boxSizing: "border-box"
13123
- });
13124
- var contentStyle11 = {
13125
- flex: 1,
13126
- minHeight: 0,
13127
- display: "flex",
13128
- flexDirection: "column",
13129
- justifyContent: "space-between",
13130
- alignItems: "center",
13131
- padding: "80px 32px 32px",
13132
- gap: 32,
13133
- boxSizing: "border-box"
13134
- };
13135
- var heroStyle = {
13136
- flex: 1,
13137
- minHeight: 0,
13138
- display: "flex",
13139
- flexDirection: "column",
13140
- justifyContent: "center",
13141
- alignItems: "center",
13142
- gap: 32,
13143
- width: "100%"
13144
- };
13145
- var illustrationStyle4 = {
13146
- width: 200,
13147
- height: 200,
13148
- objectFit: "contain",
13149
- display: "block"
13150
- };
13151
- var copyStackStyle = {
13152
- display: "flex",
13153
- flexDirection: "column",
13154
- alignItems: "center",
13155
- gap: 16,
13156
- width: "100%",
13157
- textAlign: "center"
13158
- };
13159
- var headingStyle9 = (color) => ({
13160
- margin: 0,
13161
- color,
13162
- fontSize: 24,
13163
- fontWeight: 700,
13164
- lineHeight: 1,
13165
- letterSpacing: 0,
13166
- whiteSpace: "pre-line"
13167
- });
13168
- var subtitleStyle7 = (color) => ({
13169
- margin: 0,
13170
- color,
13171
- fontSize: 16,
13172
- fontWeight: 400,
13173
- lineHeight: 1.25,
13174
- whiteSpace: "pre-line"
13175
- });
13176
- var ctaStyle = (tokens, disabled) => ({
13177
- display: "flex",
13178
- alignItems: "center",
13179
- justifyContent: "center",
13180
- gap: 8,
13181
- width: "100%",
13182
- height: 56,
13183
- padding: "4px 24px",
13184
- border: "none",
13185
- borderRadius: 36,
13186
- background: `linear-gradient(180deg, ${tokens.accent}, ${tokens.accentHover})`,
13187
- color: tokens.accentText,
13188
- fontSize: 20,
13189
- fontWeight: 700,
13190
- fontFamily: "inherit",
13191
- cursor: disabled ? "default" : "pointer",
13192
- opacity: disabled ? 0.5 : 1,
13193
- transition: "opacity 0.15s ease",
13194
- boxSizing: "border-box"
13195
- });
13196
- var ctaIconStyle = {
13197
- width: 32,
13198
- height: 32,
13199
- objectFit: "contain",
13200
- display: "block",
13201
- borderRadius: 8
13202
- };
13203
- var navButtonStyle = (bg, color) => ({
13204
- position: "absolute",
13205
- top: 16,
13206
- zIndex: 1,
13207
- width: 44,
13208
- height: 44,
13209
- border: "none",
13210
- borderRadius: 40,
13211
- background: bg,
13212
- color,
13213
- display: "flex",
13214
- alignItems: "center",
13215
- justifyContent: "center",
13216
- cursor: "pointer",
13217
- padding: 0
13218
- });
13219
- var errorBannerStyle7 = (tokens) => ({
13220
- width: "100%",
13221
- borderRadius: 16,
13222
- padding: "11px 14px",
13223
- background: tokens.errorBg,
13224
- border: `1px solid ${tokens.error}66`,
13225
- color: tokens.error,
13226
- fontSize: "0.84rem",
13227
- lineHeight: 1.5,
13228
- textAlign: "left",
13229
- boxSizing: "border-box"
13230
- });
13231
12990
  function SetupSelectDepositSourceScreen({
13232
12991
  tokenOptions,
13233
12992
  selectedTokenSymbol,
@@ -14408,7 +14167,7 @@ function SelectSourceScreen({
14408
14167
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: optionContentStyle, children: [
14409
14168
  /* @__PURE__ */ jsxRuntime.jsxs("span", { style: optionNameStyle(tokens.text), children: [
14410
14169
  chain.chainName,
14411
- isRecommended && /* @__PURE__ */ jsxRuntime.jsx("span", { style: recommendedBadgeStyle2(tokens.textMuted), children: " recommended" })
14170
+ isRecommended && /* @__PURE__ */ jsxRuntime.jsx("span", { style: recommendedBadgeStyle(tokens.textMuted), children: " recommended" })
14412
14171
  ] }),
14413
14172
  /* @__PURE__ */ jsxRuntime.jsxs("span", { style: optionBalanceStyle(tokens.textMuted), children: [
14414
14173
  "$",
@@ -14504,7 +14263,7 @@ var optionNameStyle = (color) => ({
14504
14263
  fontWeight: 600,
14505
14264
  color
14506
14265
  });
14507
- var recommendedBadgeStyle2 = (color) => ({
14266
+ var recommendedBadgeStyle = (color) => ({
14508
14267
  fontSize: "0.7rem",
14509
14268
  fontWeight: 500,
14510
14269
  color,
@@ -14804,7 +14563,7 @@ function TransferStatusLayout({
14804
14563
  onLogout && /* @__PURE__ */ jsxRuntime.jsx("div", { style: menuOverlayStyle, children: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
14805
14564
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle16, children: [
14806
14565
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle13(tokens.text), children: heading }),
14807
- visibleError && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle8(tokens), children: visibleError }),
14566
+ visibleError && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle7(tokens), children: visibleError }),
14808
14567
  children
14809
14568
  ] })
14810
14569
  ] })
@@ -14905,7 +14664,7 @@ var headingStyle13 = (color) => ({
14905
14664
  margin: 0,
14906
14665
  textAlign: "center"
14907
14666
  });
14908
- var errorBannerStyle8 = (tokens) => ({
14667
+ var errorBannerStyle7 = (tokens) => ({
14909
14668
  background: tokens.errorBg,
14910
14669
  border: `1px solid ${tokens.error}66`,
14911
14670
  borderRadius: 16,
@@ -15891,7 +15650,7 @@ function GuestTokenPickerScreen({
15891
15650
  /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { onBack }),
15892
15651
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle20, children: [
15893
15652
  /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle16(tokens.text), children: title }),
15894
- error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle9(tokens), children: error }),
15653
+ error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle8(tokens), children: error }),
15895
15654
  entries2.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle13(tokens.textMuted), children: emptyMessage ?? "No tokens available." }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15896
15655
  /* @__PURE__ */ jsxRuntime.jsx("label", { style: labelStyle7(tokens.textSecondary), children: "Token" }),
15897
15656
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -16063,7 +15822,7 @@ var presetButtonStyle = (themeTokens, active) => ({
16063
15822
  background: active ? `${themeTokens.accent}22` : "transparent",
16064
15823
  color: themeTokens.text
16065
15824
  });
16066
- var errorBannerStyle9 = (themeTokens) => ({
15825
+ var errorBannerStyle8 = (themeTokens) => ({
16067
15826
  background: themeTokens.errorBg,
16068
15827
  border: `1px solid ${themeTokens.error}66`,
16069
15828
  borderRadius: 12,
@@ -16164,7 +15923,7 @@ function ManualTransferFlow({
16164
15923
  );
16165
15924
  } else if (screen === "deposit-complete") {
16166
15925
  const transferAmount = Number(session?.deliveredAmountUsd ?? session?.minAmountUsd ?? 0);
16167
- screenContent = passkeyCreated ? /* @__PURE__ */ jsxRuntime.jsx(
15926
+ screenContent = /* @__PURE__ */ jsxRuntime.jsx(
16168
15927
  SuccessScreen,
16169
15928
  {
16170
15929
  amount: transferAmount,
@@ -16173,16 +15932,7 @@ function ManualTransferFlow({
16173
15932
  onDone: onDismiss,
16174
15933
  onLogout
16175
15934
  }
16176
- ) : /* @__PURE__ */ jsxRuntime.jsx(
16177
- ManualTransferPasskeyScreen,
16178
- {
16179
- onCreatePasskey: onCreatePasskey ?? (() => void 0),
16180
- loading: createPasskeyLoading,
16181
- error: createPasskeyError,
16182
- onBack,
16183
- onClose: onDismiss ?? onLogout
16184
- }
16185
- );
15935
+ ) ;
16186
15936
  } else if (screen === "deposit-failed") {
16187
15937
  screenContent = /* @__PURE__ */ jsxRuntime.jsx(
16188
15938
  BlinkErrorScreen,