@swype-org/react-sdk 0.1.77 → 0.1.80

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.js CHANGED
@@ -689,6 +689,11 @@ function isInCrossOriginIframe() {
689
689
  return true;
690
690
  }
691
691
  }
692
+ function isSafari() {
693
+ if (typeof navigator === "undefined") return false;
694
+ const ua = navigator.userAgent;
695
+ return /Safari/i.test(ua) && !/Chrome|CriOS|Chromium|Edg|OPR|Firefox/i.test(ua);
696
+ }
692
697
  var POPUP_RESULT_TIMEOUT_MS = 12e4;
693
698
  var POPUP_CLOSED_POLL_MS = 500;
694
699
  function createPasskeyViaPopup(options) {
@@ -3239,12 +3244,15 @@ function DepositScreen({
3239
3244
  onChangeSource,
3240
3245
  onSwitchWallet,
3241
3246
  onBack,
3242
- onLogout
3247
+ onLogout,
3248
+ onIncreaseLimit,
3249
+ increasingLimit
3243
3250
  }) {
3244
3251
  const { tokens } = useSwypeConfig();
3245
3252
  const amount = initialAmount;
3246
3253
  const isLowBalance = availableBalance < MIN_DEPOSIT;
3247
- const canDeposit = amount >= MIN_DEPOSIT && amount <= remainingLimit && !isLowBalance && !processing;
3254
+ const exceedsLimit = amount > remainingLimit && !isLowBalance;
3255
+ const canDeposit = amount >= MIN_DEPOSIT && !exceedsLimit && !isLowBalance && !processing;
3248
3256
  const headerTitle = merchantName ? `Deposit to ${merchantName}` : "Deposit";
3249
3257
  if (isLowBalance) {
3250
3258
  return /* @__PURE__ */ jsxs(
@@ -3302,11 +3310,22 @@ function DepositScreen({
3302
3310
  ScreenLayout,
3303
3311
  {
3304
3312
  footer: /* @__PURE__ */ jsxs(Fragment, { children: [
3305
- /* @__PURE__ */ jsxs(PrimaryButton, { onClick: () => onDeposit(amount), disabled: !canDeposit, loading: processing, children: [
3306
- "Deposit $",
3307
- amount.toFixed(2)
3313
+ exceedsLimit && onIncreaseLimit ? /* @__PURE__ */ jsxs(Fragment, { children: [
3314
+ /* @__PURE__ */ jsx(PrimaryButton, { onClick: onIncreaseLimit, loading: increasingLimit, children: "Increase limit" }),
3315
+ /* @__PURE__ */ jsxs("p", { style: limitExceededHintStyle(tokens.warning), children: [
3316
+ "Your deposit of $",
3317
+ amount.toFixed(2),
3318
+ " exceeds your One-Tap limit of $",
3319
+ remainingLimit.toFixed(2),
3320
+ ". Increase your limit to continue."
3321
+ ] })
3322
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
3323
+ /* @__PURE__ */ jsxs(PrimaryButton, { onClick: () => onDeposit(amount), disabled: !canDeposit, loading: processing, children: [
3324
+ "Deposit $",
3325
+ amount.toFixed(2)
3326
+ ] }),
3327
+ /* @__PURE__ */ jsx("p", { style: noApprovalStyle(tokens.textMuted), children: "No approval needed \xB7 within your One-Tap limit" })
3308
3328
  ] }),
3309
- /* @__PURE__ */ jsx("p", { style: noApprovalStyle(tokens.textMuted), children: "No approval needed \xB7 within your One-Tap limit" }),
3310
3329
  /* @__PURE__ */ jsxs("p", { style: routeStyle(tokens.textMuted), children: [
3311
3330
  "From ",
3312
3331
  sourceName,
@@ -3454,6 +3473,13 @@ var noApprovalStyle = (color) => ({
3454
3473
  color,
3455
3474
  margin: "12px 0 2px"
3456
3475
  });
3476
+ var limitExceededHintStyle = (color) => ({
3477
+ textAlign: "center",
3478
+ fontSize: "0.78rem",
3479
+ color,
3480
+ margin: "12px 0 2px",
3481
+ lineHeight: 1.5
3482
+ });
3457
3483
  var routeStyle = (color) => ({
3458
3484
  textAlign: "center",
3459
3485
  fontSize: "0.75rem",
@@ -4517,7 +4543,9 @@ function SwypePaymentInner({
4517
4543
  const [transfer, setTransfer] = useState(null);
4518
4544
  const [creatingTransfer, setCreatingTransfer] = useState(false);
4519
4545
  const [registeringPasskey, setRegisteringPasskey] = useState(false);
4520
- const [passkeyPopupNeeded, setPasskeyPopupNeeded] = useState(false);
4546
+ const [passkeyPopupNeeded, setPasskeyPopupNeeded] = useState(
4547
+ () => isSafari() && isInCrossOriginIframe()
4548
+ );
4521
4549
  const [activeCredentialId, setActiveCredentialId] = useState(() => {
4522
4550
  if (typeof window === "undefined") return null;
4523
4551
  return window.localStorage.getItem(ACTIVE_CREDENTIAL_STORAGE_KEY);
@@ -4584,7 +4612,7 @@ function SwypePaymentInner({
4584
4612
  try {
4585
4613
  await reloadAccounts();
4586
4614
  resetDataLoadingState();
4587
- setTransfer(null);
4615
+ setTransfer(authorizedTransfer);
4588
4616
  setError(null);
4589
4617
  setDeeplinkUri(null);
4590
4618
  setMobileFlow(false);
@@ -4723,6 +4751,17 @@ function SwypePaymentInner({
4723
4751
  if (resolved.clearPersistedFlow) {
4724
4752
  clearMobileFlowState();
4725
4753
  }
4754
+ if (resolved.step === "deposit" && persisted && persisted.isSetup) {
4755
+ try {
4756
+ const existingTransfer = await fetchTransfer(apiBaseUrl, token, persisted.transferId);
4757
+ if (cancelled) return;
4758
+ if (existingTransfer.status === "AUTHORIZED") {
4759
+ await handleAuthorizedMobileReturn(existingTransfer, true);
4760
+ return;
4761
+ }
4762
+ } catch {
4763
+ }
4764
+ }
4726
4765
  if (resolved.step === "open-wallet" && persisted) {
4727
4766
  try {
4728
4767
  const existingTransfer = await fetchTransfer(apiBaseUrl, token, persisted.transferId);
@@ -5189,6 +5228,81 @@ function SwypePaymentInner({
5189
5228
  merchantAuthorization,
5190
5229
  transfer
5191
5230
  ]);
5231
+ const [increasingLimit, setIncreasingLimit] = useState(false);
5232
+ const handleIncreaseLimit = useCallback(async () => {
5233
+ const parsedAmount = depositAmount ?? 5;
5234
+ if (!sourceId) {
5235
+ setError("No account or provider selected.");
5236
+ return;
5237
+ }
5238
+ if (!activeCredentialId) {
5239
+ setError("Create a passkey on this device before continuing.");
5240
+ setStep("create-passkey");
5241
+ return;
5242
+ }
5243
+ setError(null);
5244
+ setIncreasingLimit(true);
5245
+ try {
5246
+ const token = await getAccessToken();
5247
+ if (!token) throw new Error("Not authenticated");
5248
+ let effectiveSourceType = sourceType;
5249
+ let effectiveSourceId = sourceId;
5250
+ if (effectiveSourceType === "accountId") {
5251
+ const acct = accounts.find((a) => a.id === effectiveSourceId);
5252
+ const activeWallet = acct?.wallets.find((w) => w.status === "ACTIVE");
5253
+ if (activeWallet) {
5254
+ effectiveSourceType = "walletId";
5255
+ effectiveSourceId = activeWallet.id;
5256
+ }
5257
+ }
5258
+ const t = await createTransfer(apiBaseUrl, token, {
5259
+ id: idempotencyKey,
5260
+ credentialId: activeCredentialId,
5261
+ merchantAuthorization,
5262
+ sourceType: effectiveSourceType,
5263
+ sourceId: effectiveSourceId,
5264
+ destination,
5265
+ amount: parsedAmount
5266
+ });
5267
+ setTransfer(t);
5268
+ if (t.authorizationSessions && t.authorizationSessions.length > 0) {
5269
+ const uri = t.authorizationSessions[0].uri;
5270
+ setMobileFlow(true);
5271
+ pollingTransferIdRef.current = t.id;
5272
+ mobileSetupFlowRef.current = true;
5273
+ handlingMobileReturnRef.current = false;
5274
+ polling.startPolling(t.id);
5275
+ setDeeplinkUri(uri);
5276
+ persistMobileFlowState({
5277
+ transferId: t.id,
5278
+ deeplinkUri: uri,
5279
+ providerId: selectedProviderId,
5280
+ isSetup: true
5281
+ });
5282
+ triggerDeeplink(uri);
5283
+ }
5284
+ } catch (err) {
5285
+ const msg = err instanceof Error ? err.message : "Failed to increase limit";
5286
+ setError(msg);
5287
+ onError?.(msg);
5288
+ } finally {
5289
+ setIncreasingLimit(false);
5290
+ }
5291
+ }, [
5292
+ depositAmount,
5293
+ sourceId,
5294
+ sourceType,
5295
+ activeCredentialId,
5296
+ apiBaseUrl,
5297
+ getAccessToken,
5298
+ accounts,
5299
+ polling,
5300
+ onError,
5301
+ idempotencyKey,
5302
+ merchantAuthorization,
5303
+ destination,
5304
+ selectedProviderId
5305
+ ]);
5192
5306
  const completePasskeyRegistration = useCallback(async (credentialId, publicKey) => {
5193
5307
  const token = await getAccessToken();
5194
5308
  if (!token) throw new Error("Not authenticated");
@@ -5450,7 +5564,9 @@ function SwypePaymentInner({
5450
5564
  onChangeSource: () => setStep("wallet-picker"),
5451
5565
  onSwitchWallet: () => setStep("wallet-picker"),
5452
5566
  onBack: onBack ?? (() => handleLogout()),
5453
- onLogout: handleLogout
5567
+ onLogout: handleLogout,
5568
+ onIncreaseLimit: handleIncreaseLimit,
5569
+ increasingLimit
5454
5570
  }
5455
5571
  );
5456
5572
  }