@swype-org/react-sdk 0.1.59 → 0.1.63

package/dist/index.cjs

@@ -680,7 +680,7 @@ function createPasskeyViaPopup(options) {
   return new Promise((resolve, reject) => {
     const encoded = btoa(JSON.stringify(options));
     const popupUrl = `${window.location.origin}/passkey-register#${encoded}`;
-    const popup = window.open(popupUrl, "swype-passkey", "width=460,height=600");
+    const popup = window.open(popupUrl, "swype-passkey");
     if (!popup) {
       reject(new Error("Pop-up blocked. Please allow pop-ups for this site and try again."));
       return;
@@ -1944,10 +1944,20 @@ function LimitSlider({
         }
       )
     ] }),
-    ticks && ticks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { style: ticksStyle, children: ticks.map((tick) => /* @__PURE__ */ jsxRuntime.jsxs("span", { style: tickLabelStyle(tokens.textMuted), children: [
-      "$",
-      tick
-    ] }, tick)) }),
+    ticks && ticks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { style: ticksStyle, children: ticks.map((tick, i) => {
+      const pctPos = (tick - min) / (max - min) * 100;
+      const isFirst = i === 0;
+      const isLast = i === ticks.length - 1;
+      const label = tick % 1 === 0 ? `$${tick}` : `$${tick.toFixed(2)}`;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          style: tickLabelStyle(tokens.textMuted, pctPos, isFirst, isLast),
+          children: label
+        },
+        tick
+      );
+    }) }),
     /* @__PURE__ */ jsxRuntime.jsx("style", { children: sliderThumbCss(tokens.accent) })
   ] });
 }
@@ -1988,14 +1998,18 @@ var rangeInputStyle = {
   background: "transparent"
 };
 var ticksStyle = {
-  display: "flex",
-  justifyContent: "space-between",
+  position: "relative",
+  height: 18,
   marginTop: 6
 };
-var tickLabelStyle = (color) => ({
+var tickLabelStyle = (color, pct, isFirst, isLast) => ({
+  position: "absolute",
+  left: `${pct}%`,
+  transform: isFirst ? "none" : isLast ? "translateX(-100%)" : "translateX(-50%)",
   fontSize: "0.72rem",
   fontWeight: 500,
-  color
+  color,
+  whiteSpace: "nowrap"
 });
 var sliderThumbCss = (accent) => `
   .swype-slider-wrap input[type="range"]::-webkit-slider-runnable-track {
@@ -3008,11 +3022,13 @@ function SetupScreen({
   onSetupOneTap,
   onBack,
   onLogout,
+  onAdvanced,
+  selectedSourceLabel,
   loading,
   error
 }) {
   const { tokens } = useSwypeConfig();
-  const effectiveMax = Math.min(DEFAULT_MAX, availableBalance > 0 ? availableBalance : DEFAULT_MAX);
+  const effectiveMax = Math.floor(Math.min(DEFAULT_MAX, availableBalance > 0 ? availableBalance : DEFAULT_MAX) * 100) / 100;
   const effectiveMin = Math.min(ABSOLUTE_MIN, effectiveMax);
   const sliderStep = effectiveMax <= 10 ? 0.5 : effectiveMax <= 50 ? 1 : 5;
   const ticks = buildTicks(effectiveMin, effectiveMax);
@@ -3051,18 +3067,30 @@ function SetupScreen({
               ] })
             ] })
           ] }),
-          tokenCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: tokenBadgeStyle(tokens), children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { style: tokenDotStyle(tokens.accent) }),
-            tokenCount,
-            " ",
-            /* @__PURE__ */ jsxRuntime.jsx("span", { style: chevronStyle, children: ">" })
-          ] })
+          tokenCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: onAdvanced,
+              style: tokenBadgeButtonStyle(tokens, !!onAdvanced),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { style: tokenDotStyle(tokens.accent) }),
+                tokenCount,
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx("span", { style: chevronStyle, children: ">" })
+              ]
+            }
+          )
+        ] }),
+        selectedSourceLabel && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: selectedSourceStyle(tokens.textSecondary), children: [
+          "Source: ",
+          /* @__PURE__ */ jsxRuntime.jsx("strong", { children: selectedSourceLabel })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: limitSectionStyle, children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { style: limitLabelStyle(tokens.textMuted), children: "Your One-Tap limit" }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { style: limitValueStyle(tokens.text), children: [
             "$",
-            limit
+            limit.toFixed(2)
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(
             LimitSlider,
@@ -3137,7 +3165,7 @@ var balanceValueStyle = (color) => ({
   fontWeight: 700,
   color
 });
-var tokenBadgeStyle = (tokens) => ({
+var tokenBadgeButtonStyle = (tokens, clickable) => ({
   display: "flex",
   alignItems: "center",
   gap: 4,
@@ -3145,7 +3173,16 @@ var tokenBadgeStyle = (tokens) => ({
   color: tokens.textMuted,
   border: `1px solid ${tokens.border}`,
   borderRadius: 999,
-  padding: "4px 10px"
+  padding: "4px 10px",
+  background: "transparent",
+  fontFamily: "inherit",
+  cursor: clickable ? "pointer" : "default"
+});
+var selectedSourceStyle = (color) => ({
+  fontSize: "0.8rem",
+  color,
+  marginBottom: 16,
+  textAlign: "center"
 });
 var tokenDotStyle = (color) => ({
   width: 8,
@@ -3310,7 +3347,7 @@ function DepositScreen({
               ] })
             ] })
           ] }),
-          tokenCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: tokenBadgeStyle2(tokens), children: [
+          tokenCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: tokenBadgeStyle(tokens), children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { style: tokenDotStyle2(tokens.accent) }),
             tokenCount,
             " ",
@@ -3373,7 +3410,7 @@ var balanceAmountStyle = {
   fontSize: "1rem",
   fontWeight: 700
 };
-var tokenBadgeStyle2 = (tokens) => ({
+var tokenBadgeStyle = (tokens) => ({
   display: "flex",
   alignItems: "center",
   gap: 4,
@@ -3778,6 +3815,228 @@ var radioDotStyle = (color) => ({
   borderRadius: "50%",
   background: color
 });
+function AdvancedSourceScreen({
+  choices,
+  selectedChainName,
+  selectedTokenSymbol,
+  onSelectSource,
+  onBack
+}) {
+  const { tokens } = useSwypeConfig();
+  const [expandedChain, setExpandedChain] = react.useState(
+    selectedChainName || (choices[0]?.chainName ?? null)
+  );
+  const [localChain, setLocalChain] = react.useState(selectedChainName);
+  const [localToken, setLocalToken] = react.useState(selectedTokenSymbol);
+  const canConfirm = !!localChain && !!localToken;
+  const handleChainToggle = (chainName) => {
+    setExpandedChain((prev) => prev === chainName ? null : chainName);
+  };
+  const handleTokenSelect = (chainName, tokenSymbol) => {
+    setLocalChain(chainName);
+    setLocalToken(tokenSymbol);
+    setExpandedChain(chainName);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    ScreenLayout,
+    {
+      footer: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          PrimaryButton,
+          {
+            onClick: () => onSelectSource(localChain, localToken),
+            disabled: !canConfirm,
+            children: "Select Source"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(PoweredByFooter, {})
+      ] }),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ScreenHeader,
+          {
+            title: "Swype Setup",
+            onBack,
+            right: /* @__PURE__ */ jsxRuntime.jsx("span", { style: advancedBadgeStyle(tokens.accent), children: "Advanced" })
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle7(tokens.text), children: "Set up One-Tap deposits" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle8(tokens.textSecondary), children: "Select a token source for your One-Tap deposits." }),
+        /* @__PURE__ */ jsxRuntime.jsx("label", { style: labelStyle3(tokens.textSecondary), children: "Select tokens to approve" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: chainListStyle, children: choices.map((chain) => {
+          const isExpanded = expandedChain === chain.chainName;
+          const chainHasSelection = localChain === chain.chainName;
+          return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: chainCardStyle(tokens), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleChainToggle(chain.chainName),
+                style: chainHeaderStyle(tokens),
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: chainHeaderLeftStyle, children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { style: chainNameStyle(tokens.text), children: chain.chainName }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("span", { style: chainBalanceStyle(tokens.textMuted), children: [
+                      "$",
+                      chain.balance.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { style: chevronIconStyle(isExpanded, tokens.textMuted), children: isExpanded ? "\u25BE" : "\u25B8" })
+                ]
+              }
+            ),
+            isExpanded && /* @__PURE__ */ jsxRuntime.jsx("div", { style: tokenListStyle, children: chain.tokens.map((token) => {
+              const isSelected = chainHasSelection && localToken === token.tokenSymbol;
+              return /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handleTokenSelect(chain.chainName, token.tokenSymbol),
+                  style: tokenRowStyle(tokens, isSelected),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: tokenInfoStyle, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { style: tokenSymbolStyle(tokens.text), children: token.tokenSymbol }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("span", { style: tokenBalStyle(tokens.textMuted), children: [
+                        "Balance: ",
+                        token.balance.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 }),
+                        " ",
+                        token.tokenSymbol
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsx("div", { style: radioStyle2(tokens, isSelected), children: isSelected && /* @__PURE__ */ jsxRuntime.jsx("div", { style: radioDotStyle2(tokens.accent) }) })
+                  ]
+                },
+                token.tokenSymbol
+              );
+            }) })
+          ] }, chain.chainName);
+        }) })
+      ]
+    }
+  );
+}
+var advancedBadgeStyle = (color) => ({
+  fontSize: "0.72rem",
+  fontWeight: 600,
+  color,
+  border: `1px solid ${color}`,
+  borderRadius: 999,
+  padding: "3px 10px",
+  letterSpacing: "0.02em"
+});
+var headingStyle7 = (color) => ({
+  fontSize: "1.3rem",
+  fontWeight: 700,
+  letterSpacing: "-0.02em",
+  color,
+  margin: "8px 0 4px"
+});
+var subtitleStyle8 = (color) => ({
+  fontSize: "0.86rem",
+  color,
+  margin: "0 0 20px",
+  lineHeight: 1.5
+});
+var labelStyle3 = (color) => ({
+  display: "block",
+  fontSize: "0.75rem",
+  fontWeight: 600,
+  color,
+  textTransform: "uppercase",
+  letterSpacing: "0.05em",
+  marginBottom: 10
+});
+var chainListStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 10
+};
+var chainCardStyle = (tokens) => ({
+  border: `1px solid ${tokens.border}`,
+  borderRadius: 14,
+  overflow: "hidden",
+  background: tokens.bgInput
+});
+var chainHeaderStyle = (tokens, _expanded) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  width: "100%",
+  padding: "14px 16px",
+  background: tokens.bgInput,
+  border: "none",
+  cursor: "pointer",
+  fontFamily: "inherit",
+  textAlign: "left"
+});
+var chainHeaderLeftStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 2
+};
+var chainNameStyle = (color) => ({
+  fontSize: "0.92rem",
+  fontWeight: 600,
+  color
+});
+var chainBalanceStyle = (color) => ({
+  fontSize: "0.76rem",
+  color
+});
+var chevronIconStyle = (_expanded, color) => ({
+  fontSize: "0.9rem",
+  color,
+  transition: "transform 0.15s ease"
+});
+var tokenListStyle = {
+  padding: "0 12px 12px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 6
+};
+var tokenRowStyle = (tokens, selected) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  padding: "12px 14px",
+  background: tokens.bgCard,
+  border: `1.5px solid ${selected ? tokens.accent : tokens.border}`,
+  borderRadius: 10,
+  cursor: "pointer",
+  fontFamily: "inherit",
+  textAlign: "left",
+  transition: "border-color 0.15s ease"
+});
+var tokenInfoStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 2
+};
+var tokenSymbolStyle = (color) => ({
+  fontSize: "0.88rem",
+  fontWeight: 600,
+  color
+});
+var tokenBalStyle = (color) => ({
+  fontSize: "0.74rem",
+  color
+});
+var radioStyle2 = (tokens, selected) => ({
+  width: 20,
+  height: 20,
+  borderRadius: "50%",
+  border: `2px solid ${selected ? tokens.accent : tokens.border}`,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  flexShrink: 0
+});
+var radioDotStyle2 = (color) => ({
+  width: 10,
+  height: 10,
+  borderRadius: "50%",
+  background: color
+});
 var STEP_LABELS = ["Creating transfer", "Verifying", "Sent", "Done"];
 var PHASE_ACTIVE_INDEX = {
   creating: 0,
@@ -3803,7 +4062,7 @@ function TransferStatusScreen({
     /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { right: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle5, children: [
       /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle7(tokens.text), children: "Processing Transfer..." }),
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle8(tokens.text), children: "Processing Transfer..." }),
       error && /* @__PURE__ */ jsxRuntime.jsx("div", { style: errorBannerStyle5(tokens), children: error }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { style: stepsWrapStyle, children: /* @__PURE__ */ jsxRuntime.jsx(StepList, { steps }) }),
       /* @__PURE__ */ jsxRuntime.jsx("p", { style: waitHintStyle(tokens.textMuted), children: "Usually takes a few seconds" })
@@ -3819,7 +4078,7 @@ var contentStyle5 = {
   textAlign: "center",
   padding: "0 24px"
 };
-var headingStyle7 = (color) => ({
+var headingStyle8 = (color) => ({
   fontSize: "1.45rem",
   fontWeight: 700,
   letterSpacing: "-0.02em",
@@ -3862,10 +4121,7 @@ function OpenWalletScreen({
   react.useEffect(() => {
     if (loading || !deeplinkUri || autoOpenedRef.current === deeplinkUri) return;
     autoOpenedRef.current = deeplinkUri;
-    const opened = window.open(deeplinkUri, "_blank");
-    if (!opened && window === window.parent) {
-      window.location.href = deeplinkUri;
-    }
+    window.location.href = deeplinkUri;
   }, [loading, deeplinkUri]);
   const handleOpen = react.useCallback(() => {
     const opened = window.open(deeplinkUri, "_blank");
@@ -3887,8 +4143,8 @@ function OpenWalletScreen({
         /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { right: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle6, children: [
           logoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoSrc, alt: displayName, style: logoStyle }) : /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle8(tokens.text), children: loading ? "Connecting..." : `Open ${displayName}` }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle8(tokens.textSecondary), children: loading ? "Creating transfer and preparing your wallet link..." : `Continue in ${displayName} to authorize this connection.` }),
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle9(tokens.text), children: loading ? "Connecting..." : `Open ${displayName}` }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { style: subtitleStyle9(tokens.textSecondary), children: loading ? "Creating transfer and preparing your wallet link..." : `Continue in ${displayName} to authorize this connection.` }),
           !loading && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: waitingBadgeStyle(tokens), children: [
             /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 14 }),
             /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Waiting for authorization..." })
@@ -3913,14 +4169,14 @@ var logoStyle = {
   borderRadius: 14,
   objectFit: "contain"
 };
-var headingStyle8 = (color) => ({
+var headingStyle9 = (color) => ({
   fontSize: "1.45rem",
   fontWeight: 700,
   letterSpacing: "-0.02em",
   color,
   margin: "20px 0 8px"
 });
-var subtitleStyle8 = (color) => ({
+var subtitleStyle9 = (color) => ({
   fontSize: "0.9rem",
   color,
   margin: "0 0 24px",
@@ -3966,8 +4222,8 @@ function ConfirmSignScreen({
         /* @__PURE__ */ jsxRuntime.jsx(ScreenHeader, { right: /* @__PURE__ */ jsxRuntime.jsx(SettingsMenu, { onLogout }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { style: contentStyle7, children: [
           logoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoSrc, alt: displayName, style: logoStyle2 }) : /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: 48 }),
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle9(tokens.text), children: "Wallet authorized" }),
-          /* @__PURE__ */ jsxRuntime.jsxs("p", { style: subtitleStyle9(tokens.textSecondary), children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle10(tokens.text), children: "Wallet authorized" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("p", { style: subtitleStyle10(tokens.textSecondary), children: [
             displayName,
             " approved the connection. Tap below to confirm your payment."
           ] }),
@@ -3995,14 +4251,14 @@ var logoStyle2 = {
   borderRadius: 14,
   objectFit: "contain"
 };
-var headingStyle9 = (color) => ({
+var headingStyle10 = (color) => ({
   fontSize: "1.45rem",
   fontWeight: 700,
   letterSpacing: "-0.02em",
   color,
   margin: "20px 0 8px"
 });
-var subtitleStyle9 = (color) => ({
+var subtitleStyle10 = (color) => ({
   fontSize: "0.9rem",
   color,
   margin: "0 0 24px",
@@ -4061,7 +4317,7 @@ var PaymentErrorBoundary = class extends react.Component {
         /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 8v5", stroke: "#ef4444", strokeWidth: "1.5", strokeLinecap: "round" }),
         /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "16", r: "0.75", fill: "#ef4444" })
       ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle10, children: "Something went wrong" }),
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { style: headingStyle11, children: "Something went wrong" }),
       /* @__PURE__ */ jsxRuntime.jsx("p", { style: messageStyle, children: "An unexpected error occurred. Please try again." }),
       /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: this.handleReset, style: buttonStyle3, children: "Try again" })
     ] });
@@ -4081,7 +4337,7 @@ var containerStyle8 = {
 var iconStyle4 = {
   marginBottom: 20
 };
-var headingStyle10 = {
+var headingStyle11 = {
   fontSize: "1.25rem",
   fontWeight: 700,
   color: "#1a1a1a",
@@ -4104,13 +4360,6 @@ var buttonStyle3 = {
   fontFamily: "inherit",
   cursor: "pointer"
 };
-function isInIframe() {
-  try {
-    return typeof window !== "undefined" && window !== window.top;
-  } catch {
-    return true;
-  }
-}
 var ACTIVE_CREDENTIAL_STORAGE_KEY = "swype_active_credential_id";
 var MOBILE_FLOW_STORAGE_KEY = "swype_mobile_flow";
 var MIN_SEND_AMOUNT_USD = 0.25;
@@ -4457,7 +4706,7 @@ function SwypePaymentInner({
         if (defaults) {
           setSelectedAccountId(defaults.accountId);
           setSelectedWalletId(defaults.walletId);
-        } else if (prov.length > 0) {
+        } else if (prov.length > 0 && !connectingNewAccount) {
           setSelectedProviderId(prov[0].id);
         }
         const hasActiveWallet = accts.some(
@@ -4731,12 +4980,10 @@ function SwypePaymentInner({
           persistMobileFlowState({
             transferId: t.id,
             deeplinkUri: uri,
-            providerId: selectedProviderId,
+            providerId: sourceOverrides?.sourceType === "providerId" ? sourceOverrides.sourceId : selectedProviderId,
             isSetup: mobileSetupFlowRef.current
           });
-          if (!isInIframe()) {
-            window.location.href = uri;
-          }
+          window.location.href = uri;
           return;
         } else {
           await authExecutor.executeSession(t);
@@ -5104,6 +5351,7 @@ function SwypePaymentInner({
   return null;
 }
 
+exports.AdvancedSourceScreen = AdvancedSourceScreen;
 exports.CreatePasskeyScreen = CreatePasskeyScreen;
 exports.IconCircle = IconCircle;
 exports.OutlineButton = OutlineButton;