@getpara/react-sdk-lite 2.0.0-alpha.33

package/dist/chunk-MMUBH76A.js

@@ -0,0 +1,59 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+export {
+  __spreadValues,
+  __spreadProps,
+  __objRest,
+  __async
+};

package/dist/cli/cli.mjs

@@ -0,0 +1,51 @@
+#!/usr/bin/env node
+import * as fs from 'node:fs/promises';
+import * as path from 'node:path';
+import { createRequire } from 'module';
+const require = createRequire(import.meta.url);
+
+const PACKAGES_TO_STUB = [
+  '@getpara/evm-wallet-connectors',
+  '@getpara/cosmos-wallet-connectors',
+  '@getpara/solana-wallet-connectors',
+  '@farcaster/miniapp-sdk',
+  '@farcaster/miniapp-wagmi-connector',
+  '@farcaster/mini-app-solana',
+];
+
+const checkForPackages = async () => {
+  const pathToNodeModules = path.resolve('node_modules');
+
+  for (let i = 0; i < PACKAGES_TO_STUB.length; i++) {
+    const packageName = PACKAGES_TO_STUB[i];
+    try {
+      await import(packageName);
+    } catch (err) {
+      if (err.code === 'ERR_MODULE_NOT_FOUND') {
+        const packageJsonContent = { name: packageName, main: './index.js' };
+
+        await fs.mkdir(path.join(pathToNodeModules, packageName), { recursive: true });
+        const indexPath = path.join(pathToNodeModules, packageName, 'index.js');
+        const packageJsonPath = path.join(pathToNodeModules, packageName, 'package.json');
+
+        try {
+          await fs.access(indexPath);
+        } catch {
+          await fs.writeFile(indexPath, '//STUB');
+        }
+
+        try {
+          await fs.access(packageJsonPath);
+        } catch {
+          await fs.writeFile(packageJsonPath, JSON.stringify(packageJsonContent), {
+            encoding: 'utf-8',
+          });
+        }
+      }
+    }
+  }
+
+  process.exit();
+};
+
+await checkForPackages();

package/dist/css/modal.css

@@ -0,0 +1,13 @@
+@import url('@getpara/react-components/css/capsule-core.css');
+
+@font-face {
+  font-family: 'Inter';
+  src: url('../public/Inter-VariableFont_slnt,wght.ttf') format('truetype');
+}
+
+html {
+  --cpsl-default-font: 'Inter', sans-serif;
+  -webkit-overflow-scrolling: touch;
+
+  --wcm-z-index: 11000 !important;
+}

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+export * from './modal/index.js';
+export * from './provider/index.js';
+export * from '@getpara/web-sdk';
+export type { Theme } from '@getpara/react-components';
+import ParaWeb from '@getpara/web-sdk';
+export default ParaWeb;

package/dist/index.js

@@ -0,0 +1,10 @@
+"use client";
+import "./chunk-MMUBH76A.js";
+export * from "./modal/index.js";
+export * from "./provider/index.js";
+export * from "@getpara/web-sdk";
+import ParaWeb from "@getpara/web-sdk";
+var src_default = ParaWeb;
+export {
+  src_default as default
+};

package/dist/modal/ParaModal.d.ts

@@ -0,0 +1,2 @@
+import { ParaModalHandle, ParaModalProps } from './types/modalProps.js';
+export declare const ParaModal: import("react").ForwardRefExoticComponent<ParaModalProps & import("react").RefAttributes<ParaModalHandle>>;

package/dist/modal/ParaModal.js

@@ -0,0 +1,308 @@
+"use client";
+import {
+  __async,
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../chunk-MMUBH76A.js";
+import { jsx } from "react/jsx-runtime";
+import { CpslAuthModal, defineCustomElements, generateTheme } from "@getpara/react-components";
+import { ModalContent } from "./components/index.js";
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
+import { useModalStore } from "./stores/index.js";
+import { ModalStep, RESET_TO_ACCOUNT_STEPS, RESET_TO_AUTH_STEPS } from "./utils/steps.js";
+import { AuthLayout } from "./types/modalProps.js";
+import { DEFAULTS } from "./constants/defaults.js";
+import { useGoBack } from "./hooks/useGoBack.js";
+import { safeStyled } from "@getpara/react-common";
+import { hasEmbeddedAuth, hasExternalWallet } from "./utils/authLayoutHelpers.js";
+import { useAccount, useModal, useParaStatus, useWalletState } from "../provider/index.js";
+import { useInternalClient } from "../provider/hooks/utils/useInternalClient.js";
+import { useExternalWallets } from "../provider/providers/ExternalWalletProvider.js";
+import { useStore } from "../provider/stores/useStore.js";
+import parsePhoneNumberFromString from "libphonenumber-js";
+import { useAuthActions } from "../provider/providers/AuthProvider.js";
+import { validateInput } from "./utils/authInputHelpers.js";
+import { SDK_VERSION } from "./constants/constants.js";
+defineCustomElements();
+const ParaModal = forwardRef((props, ref) => {
+  const storedModalConfig = useStore((state) => state.modalConfig);
+  const openedToStep = useStore((state) => state.openedToStep);
+  const modalContentRef = useRef(null);
+  const refs = useModalStore((state) => state.refs);
+  const flow = useModalStore((state) => state.flow);
+  const currentStep = useModalStore((state) => state.step);
+  const setAuthState = useModalStore((state) => state.setAuthState);
+  const setOnModalStepChange = useModalStore((state) => state.setOnModalStepChange);
+  const setStep = useModalStore((state) => state.setStep);
+  const hasPreviousStep = useModalStore((state) => state.hasPreviousStep());
+  const setFlow = useModalStore((state) => state.setFlow);
+  const goBack = useGoBack();
+  const setAuthLayout = useModalStore((state) => state.setAuthLayout);
+  const storedAuthLayout = useModalStore((state) => state.authLayout);
+  const resetModalState = useModalStore((state) => state.resetState);
+  const setRecoveryShare = useModalStore((state) => state.setRecoveryShare);
+  const { disconnectExternalWallet } = useExternalWallets();
+  const { isOpen: storedIsOpen, closeModal } = useModal();
+  const para = useInternalClient();
+  const { setSelectedWallet, updateSelectedWallet } = useWalletState();
+  const setAuthStepRoute = useModalStore((state) => state.setAuthStepRoute);
+  const { signUpOrLogIn, isCreateGuestWalletsPending } = useAuthActions();
+  const { isReady, isFarcasterMiniApp } = useParaStatus();
+  const { isLoading: isAccountLoading, isConnected } = useAccount();
+  const setIFrameUrl = useModalStore((state) => state.setIFrameUrl);
+  const setIsIFrameReady = useModalStore((state) => state.setIsIFrameReady);
+  const [isModalMounted, setIsModalMounted] = useState(false);
+  const externalWallets = useStore((state) => state.externalWallets);
+  const providerProps = useStore((state) => state.providerProps);
+  const setAccountLinkOptions = useModalStore((state) => state.setAccountLinkOptions);
+  const isInitialized = useRef(false);
+  const _a = __spreadValues(__spreadValues({}, storedModalConfig), props), {
+    isOpen: configIsOpen,
+    theme,
+    disableEmailLogin = false,
+    disablePhoneLogin = false,
+    isGuestModeEnabled = false,
+    oAuthMethods = ["GOOGLE", "TWITTER"],
+    bareModal = false,
+    className,
+    currentStepOverride,
+    authLayout = [AuthLayout.AUTH_FULL, AuthLayout.EXTERNAL_FULL],
+    embeddedModal,
+    onModalStepChange,
+    onClose,
+    defaultAuthIdentifier,
+    supportedAccountLinks: propsSupportedAccountLinks
+  } = _a, rest = __objRest(_a, [
+    "isOpen",
+    "theme",
+    "disableEmailLogin",
+    "disablePhoneLogin",
+    "isGuestModeEnabled",
+    "oAuthMethods",
+    "bareModal",
+    "className",
+    "currentStepOverride",
+    "authLayout",
+    "embeddedModal",
+    "onModalStepChange",
+    "onClose",
+    "defaultAuthIdentifier",
+    "supportedAccountLinks"
+  ]);
+  useEffect(() => {
+    const trackAnalytics = () => __async(void 0, null, function* () {
+      try {
+        yield para.ctx.client.trackReactSdkAnalytics({
+          props: __spreadValues(__spreadProps(__spreadValues({}, providerProps), {
+            theme,
+            disableEmailLogin,
+            disablePhoneLogin,
+            isGuestModeEnabled,
+            oAuthMethods,
+            bareModal,
+            className,
+            currentStepOverride,
+            authLayout,
+            embeddedModal,
+            onModalStepChange,
+            onClose,
+            defaultAuthIdentifier
+          }), rest),
+          reactSdkVersion: SDK_VERSION
+        });
+      } catch (_) {
+      }
+    });
+    trackAnalytics();
+  }, []);
+  const isOpen = configIsOpen != null ? configIsOpen : storedIsOpen;
+  useImperativeHandle(ref, () => {
+    return {
+      goBack() {
+        goBack();
+      },
+      canGoBack() {
+        return hasPreviousStep;
+      },
+      currentStep() {
+        return currentStep;
+      },
+      handleModalClose() {
+        var _a2;
+        (_a2 = modalContentRef == null ? void 0 : modalContentRef.current) == null ? void 0 : _a2.handleModalClose();
+      }
+    };
+  }, [hasPreviousStep, currentStep]);
+  const initModal = (shouldAutoLogin) => __async(void 0, null, function* () {
+    var _a2;
+    if (!isReady) {
+      return;
+    }
+    setIFrameUrl(void 0);
+    setIsIFrameReady(false);
+    const isAccount = isConnected, isGuest = isAccount && para.isGuestMode || isCreateGuestWalletsPending;
+    switch (true) {
+      case !!currentStepOverride:
+        setStep(ModalStep[currentStepOverride.toUpperCase()]);
+        break;
+      case isGuest:
+        setFlow("guest");
+        setStep(isCreateGuestWalletsPending ? ModalStep.AWAITING_GUEST_WALLET_CREATION : ModalStep.ACCOUNT_MAIN);
+        break;
+      case isAccount:
+        setFlow("account");
+        if (!openedToStep.current) {
+          setStep(ModalStep.ACCOUNT_MAIN);
+        }
+        break;
+      default:
+        if (currentStep !== ModalStep.AUTH_MAIN && currentStep !== ModalStep.SECRET) {
+          setFlow(void 0);
+          setStep(para.isTelegram ? ModalStep.TELEGRAM_OAUTH : ModalStep.AUTH_MAIN);
+          setAuthState();
+          setAuthStepRoute();
+        }
+        if (!isFarcasterMiniApp) {
+          yield disconnectExternalWallet();
+          setSelectedWallet({ id: void 0, type: void 0 });
+        }
+        if (shouldAutoLogin) {
+          if (defaultAuthIdentifier && ((_a2 = para.authInfo) == null ? void 0 : _a2.identifier) !== defaultAuthIdentifier) {
+            const number = parsePhoneNumberFromString(defaultAuthIdentifier);
+            try {
+              const auth = validateInput(
+                number ? number.nationalNumber : defaultAuthIdentifier,
+                (number == null ? void 0 : number.countryCallingCode) ? `+${number == null ? void 0 : number.countryCallingCode}` : void 0,
+                number ? "phone" : "email"
+              );
+              para.setAuth(number ? { phone: defaultAuthIdentifier } : { email: defaultAuthIdentifier });
+              signUpOrLogIn(auth);
+            } catch (err) {
+              console.error("invalid user identifier:", err.message);
+            }
+          }
+        }
+        break;
+    }
+  });
+  useEffect(() => {
+    if (isReady && isOpen && !isAccountLoading && !isInitialized.current) {
+      initModal(isOpen);
+      isInitialized.current = true;
+    }
+    if (isReady && !isOpen && isInitialized.current) {
+      initModal();
+      isInitialized.current = false;
+    }
+  }, [isReady, isOpen, isAccountLoading]);
+  useEffect(() => {
+    let _authLayout = authLayout;
+    if (!(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout)) {
+      _authLayout = _authLayout.filter((l) => !l.includes("EXTERNAL"));
+    }
+    if (disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout)) {
+      _authLayout = _authLayout.filter((l) => !l.includes("AUTH"));
+    }
+    if (JSON.stringify(storedAuthLayout) !== JSON.stringify(_authLayout)) {
+      setAuthLayout(_authLayout);
+    }
+  }, [disableEmailLogin, disablePhoneLogin, oAuthMethods, externalWallets, authLayout, storedAuthLayout]);
+  useEffect(() => {
+    if (theme) {
+      generateTheme(theme);
+    }
+  }, [theme]);
+  useEffect(() => {
+    setOnModalStepChange(onModalStepChange);
+  }, [onModalStepChange]);
+  useEffect(() => {
+    updateSelectedWallet();
+  }, [para]);
+  useEffect(() => {
+    if (bareModal && !isAccountLoading && !isConnected && !["signup", "login"].includes(flow != null ? flow : "") && refs.currentStep.current !== ModalStep.AUTH_MAIN) {
+      setStep(ModalStep.AUTH_MAIN);
+    }
+  }, [bareModal, flow, isConnected, isAccountLoading]);
+  useEffect(() => {
+    setAccountLinkOptions(propsSupportedAccountLinks != null ? propsSupportedAccountLinks : para == null ? void 0 : para.supportedAccountLinks);
+  }, [propsSupportedAccountLinks, para == null ? void 0 : para.supportedAccountLinks]);
+  const handleClose = () => {
+    closeModal();
+    onClose == null ? void 0 : onClose();
+  };
+  const handleModalEntering = () => {
+    setIsModalMounted(true);
+  };
+  const handleModalExited = () => __async(void 0, null, function* () {
+    openedToStep.current = null;
+    setIsModalMounted(false);
+    if (RESET_TO_AUTH_STEPS.includes(currentStep)) {
+      resetModalState();
+      setRecoveryShare(null);
+    } else if (RESET_TO_ACCOUNT_STEPS.includes(currentStep)) {
+      setStep(ModalStep.LOGIN_DONE);
+    }
+  });
+  if (!para) {
+    console.error("A Para instance is required.");
+    return null;
+  }
+  if (!(storedAuthLayout == null ? void 0 : storedAuthLayout.length)) {
+    const hasExternalWalletError = !(externalWallets == null ? void 0 : externalWallets.length) && hasExternalWallet(authLayout);
+    const hasEmbeddedWalletError = disableEmailLogin && disablePhoneLogin && !(oAuthMethods == null ? void 0 : oAuthMethods.length) && hasEmbeddedAuth(authLayout);
+    if (hasExternalWalletError || hasEmbeddedWalletError) {
+      if (hasExternalWalletError) {
+        console.error("At least one external wallet must be provided if external wallet auth is enabled.");
+      }
+      if (hasEmbeddedWalletError) {
+        console.error(
+          "At least one login method (email, phone or OAuth) must be provided if embedded wallet auth is enabled."
+        );
+      }
+    } else {
+      console.error("At least one auth layout selection is required.");
+    }
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    StyledAuthModal,
+    {
+      enterTransitionDuration: DEFAULTS.ANIMATION_DURATION,
+      exitTransitionDuration: DEFAULTS.ANIMATION_DURATION,
+      open: isOpen,
+      onCpslModalExited: handleModalExited,
+      onCpslModalEntering: handleModalEntering,
+      onCpslModalRequestClose: handleClose,
+      noOverlay: bareModal,
+      className,
+      "data-testid": "modal",
+      $embeddedModal: !!embeddedModal,
+      children: isModalMounted && ((embeddedModal || bareModal) && isInitialized.current || !embeddedModal && !bareModal) && /* @__PURE__ */ jsx(
+        ModalContent,
+        __spreadValues({
+          oAuthMethods,
+          disableEmailLogin,
+          disablePhoneLogin,
+          isGuestModeEnabled,
+          onClose: handleClose
+        }, rest)
+      )
+    }
+  );
+});
+const StyledAuthModal = safeStyled(CpslAuthModal)`
+  ${({ $embeddedModal }) => $embeddedModal && `
+    &::part(modal-body-card) {
+    --card-box-shadow: none;
+    --card-border-width: 0px;
+  };
+
+  &::part(modal-footer) {
+    --card-box-shadow: none;
+    --card-border-width: 0px;
+  };`}
+`;
+export {
+  ParaModal
+};

package/dist/modal/components/Account/Account.d.ts

@@ -0,0 +1,5 @@
+interface AccountProps {
+    onClose: () => void;
+}
+export declare const Account: ({ onClose }: AccountProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/modal/components/Account/Account.js

@@ -0,0 +1,148 @@
+"use client";
+import {
+  __async
+} from "../../../chunk-MMUBH76A.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { safeStyled } from "@getpara/react-common";
+import { InnerStepContainer, StepContainer, StyledCpslTileButton } from "../common.js";
+import { CpslButton, CpslIcon, CpslSpinner, CpslText } from "@getpara/react-components";
+import { OnRampStep, useModalStore } from "../../stores/index.js";
+import { useEffect, useState } from "react";
+import { ModalStep } from "../../utils/steps.js";
+import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
+import { useExternalWallets } from "../../../provider/providers/ExternalWalletProvider.js";
+import { useStore } from "../../../provider/stores/useStore.js";
+import { formatBalanceString } from "../../utils/stringFormatters.js";
+import { useAccount, useWalletBalance } from "../../../provider/index.js";
+import { EnabledFlow } from "@getpara/web-sdk";
+import { useAccountLinking } from "../../../provider/providers/AccountLinkProvider.js";
+const Account = ({ onClose }) => {
+  const onRampConfig = useModalStore((state) => state.onRampConfig);
+  const setStep = useModalStore((state) => state.setStep);
+  const setFlow = useModalStore((state) => state.setFlow);
+  const setGuestAddFundsTab = useModalStore((state) => state.setGuestAddFundsTab);
+  const setOnRampStep = useModalStore((state) => state.setOnRampStep);
+  const hideWallets = useStore((state) => {
+    var _a;
+    return (_a = state.modalConfig) == null ? void 0 : _a.hideWallets;
+  });
+  const { disconnectExternalWallet } = useExternalWallets();
+  const para = useInternalClient();
+  const { embedded } = useAccount();
+  const { data: balance, isLoading: isBalanceLoading } = useWalletBalance();
+  const { isEnabled } = useAccountLinking();
+  const [isDisconnecting, setIsDisconnecting] = useState(false);
+  const isGuestMode = embedded.isConnected && embedded.isGuestMode;
+  const cantBuyAndWithdraw = (para.externalWalletConnectionType === "CONNECTION_ONLY" || para.externalWalletConnectionType === "VERIFICATION") && !para.userId;
+  const isOnRampLoaded = !!onRampConfig;
+  const handleBuyClick = () => {
+    if (isGuestMode) {
+      if (onRampConfig == null ? void 0 : onRampConfig.isReceiveEnabled) {
+        setStep(ModalStep.ADD_FUNDS_RECEIVE);
+      } else {
+        setGuestAddFundsTab(EnabledFlow.BUY);
+        setStep(ModalStep.AUTH_GUEST_SIGNUP);
+      }
+    } else {
+      setOnRampStep(OnRampStep.SETTINGS);
+      setStep(ModalStep.ADD_FUNDS_BUY);
+    }
+  };
+  const handleSellClick = () => {
+    if (isGuestMode) {
+      setGuestAddFundsTab(EnabledFlow.WITHDRAW);
+      setStep(ModalStep.AUTH_GUEST_SIGNUP);
+    } else {
+      setOnRampStep(OnRampStep.SETTINGS);
+      setStep(ModalStep.ADD_FUNDS_WITHDRAW);
+    }
+  };
+  const handleProfileClick = () => {
+    setStep(ModalStep.ACCOUNT_PROFILE);
+  };
+  const handleDisconnectClick = () => __async(void 0, null, function* () {
+    setIsDisconnecting(true);
+    yield para.logout();
+    yield disconnectExternalWallet();
+    onClose();
+    setStep(ModalStep.AUTH_MAIN);
+    setFlow(void 0);
+    setIsDisconnecting(false);
+  });
+  useEffect(() => {
+    setGuestAddFundsTab();
+  }, []);
+  return /* @__PURE__ */ jsx(StepContainer, { $wide: true, children: /* @__PURE__ */ jsxs(InnerStepContainer, { children: [
+    isBalanceLoading ? /* @__PURE__ */ jsx(BalanceContainer, { children: /* @__PURE__ */ jsx(CpslSpinner, { size: 39 }) }) : balance !== void 0 && balance !== null && /* @__PURE__ */ jsx(BalanceContainer, { children: /* @__PURE__ */ jsx(CpslText, { variant: "headingS", weight: "medium", children: formatBalanceString(balance) }) }),
+    isGuestMode && /* @__PURE__ */ jsxs(Fragment, { children: [
+      balance && parseFloat(balance) > 0 && /* @__PURE__ */ jsxs(Alert, { children: [
+        /* @__PURE__ */ jsx(CpslIcon, { icon: "alertTriangle", size: "24px", style: { color: "var(--cpsl-color-utility-yellow)" } }),
+        "You've funded this account - complete account setup to maintain access."
+      ] }),
+      /* @__PURE__ */ jsxs(
+        CpslButton,
+        {
+          fullWidth: true,
+          variant: "primary",
+          onClick: () => {
+            setStep(ModalStep.AUTH_GUEST_SIGNUP);
+          },
+          children: [
+            /* @__PURE__ */ jsx(CpslIcon, { icon: "stars02" }),
+            "Complete Account Setup"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(ButtonContainer, { children: isOnRampLoaded ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      onRampConfig.isBuyEnabled && !cantBuyAndWithdraw && /* @__PURE__ */ jsx(OptionButton, { icon: "creditCard", onClick: handleBuyClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Receive" }) }),
+      onRampConfig.isWithdrawEnabled && !cantBuyAndWithdraw && /* @__PURE__ */ jsx(OptionButton, { icon: "arrowCircleBrokenDownLeft", onClick: handleSellClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Withdraw" }) }),
+      /* @__PURE__ */ jsx(OptionButton, { icon: "user", onClick: handleProfileClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: isEnabled ? "Profile" : "Settings" }) })
+    ] }) : /* @__PURE__ */ jsx(CpslSpinner, {}) }),
+    !isGuestMode && /* @__PURE__ */ jsx(DisconnectButton, { variant: "destructive", fullWidth: true, onClick: handleDisconnectClick, disabled: isDisconnecting, children: isDisconnecting ? /* @__PURE__ */ jsx(CpslSpinner, { size: 16 }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      hideWallets ? "Logout" : "Disconnect Wallet",
+      /* @__PURE__ */ jsx(CpslIcon, { icon: "logOut", slot: "end" })
+    ] }) })
+  ] }) });
+};
+const ButtonContainer = safeStyled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  width: 100%;
+  height: 88px;
+`;
+const OptionButton = safeStyled(StyledCpslTileButton)`
+  flex: 1;
+
+  --button-icon-color: var(--cpsl-color-text-primary);
+`;
+const DisconnectButton = safeStyled(CpslButton)`
+  --button-border-width: 0px;
+`;
+const BalanceContainer = safeStyled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: 8px;
+  padding-bottom: 24px;
+`;
+const Alert = safeStyled.div`
+  --icon-color: var(--cpsl-color-utility-yellow);
+  --icon-stroke-color: var(--cpsl-color-utility-yellow);
+  --icon-fill-color: var(--cpsl-color-utility-yellow);
+
+  display: flex;
+  padding: 8px;
+  align-items: flex-start;
+  gap: 8px;
+  align-self: stretch;
+  border-radius: var(--cpsl-border-radius-alert);
+  border: 1px solid var(--cpsl-color-utility-yellow);
+  background: var(--cpsl-color-utility-yellow-light);
+  font-size: 14px;
+`;
+export {
+  Account
+};

package/dist/modal/components/Account/AccountProfile.d.ts

@@ -0,0 +1 @@
+export declare const AccountProfile: () => import("react/jsx-runtime").JSX.Element | null;