@spicenet-io/spiceflow-ui 1.9.34 → 1.9.35

package/dist/auth-dynamic.cjs.js

@@ -1,1028 +1,12 @@
 "use client";
-'use strict';
-
-const jsxRuntime = require('react/jsx-runtime');
-const React = require('react');
-const Button = require('./Button-D2yFTia-.js');
-const sdkReactCore = require('@dynamic-labs/sdk-react-core');
-
-const Input = ({
-  label,
-  error,
-  helper,
-  fullWidth = false,
-  startAdornment,
-  endAdornment,
-  className = "",
-  style,
-  theme: providedTheme,
-  ...props
-}) => {
-  const theme = providedTheme || Button.createTheme("light");
-  const containerStyles = {
-    width: fullWidth ? "100%" : "auto",
-    display: "flex",
-    flexDirection: "column",
-    gap: theme.spacing.xs
-  };
-  const inputContainerStyles = {
-    position: "relative",
-    display: "flex",
-    alignItems: "center"
-  };
-  const inputStyles = {
-    backgroundColor: theme.colors.surface,
-    border: `1px solid ${error ? theme.colors.error : theme.colors.border}`,
-    borderRadius: theme.borderRadius.md,
-    color: theme.colors.text,
-    fontSize: theme.typography.fontSize.base,
-    padding: theme.spacing.md,
-    paddingLeft: startAdornment ? theme.spacing.xl : theme.spacing.md,
-    paddingRight: endAdornment ? theme.spacing.xl : theme.spacing.md,
-    width: "100%",
-    outline: "none",
-    transition: `border-color ${theme.animation.normal}`,
-    ":focus": {
-      borderColor: error ? theme.colors.error : theme.colors.primary
-    },
-    ":hover": {
-      borderColor: error ? theme.colors.error : theme.colors.borderHover
-    },
-    "::placeholder": {
-      color: theme.colors.textMuted
-    }
-  };
-  const labelStyles = {
-    fontSize: theme.typography.fontSize.sm,
-    fontWeight: theme.typography.fontWeight.medium,
-    color: theme.colors.textSecondary
-  };
-  const helperStyles = {
-    fontSize: theme.typography.fontSize.xs,
-    color: error ? theme.colors.error : theme.colors.textMuted
-  };
-  const adornmentStyles = {
-    position: "absolute",
-    top: "50%",
-    transform: "translateY(-50%)",
-    color: theme.colors.textMuted,
-    pointerEvents: "none"
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyles, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx("label", { style: labelStyles, children: label }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: inputContainerStyles, children: [
-      startAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { ...adornmentStyles, left: theme.spacing.md }, children: startAdornment }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          style: { ...inputStyles, ...style },
-          className,
-          ...props
-        }
-      ),
-      endAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { ...adornmentStyles, right: theme.spacing.md }, children: endAdornment })
-    ] }),
-    (error || helper) && /* @__PURE__ */ jsxRuntime.jsx("span", { style: helperStyles, children: error || helper })
-  ] });
-};
-
-const Modal = ({
-  isOpen,
-  onClose,
-  title,
-  children,
-  maxWidth = "32rem",
-  className = "",
-  theme: providedTheme
-}) => {
-  const theme = providedTheme || Button.createTheme("light");
-  React.useEffect(() => {
-    const handleEscape = (event) => {
-      if (event.key === "Escape") {
-        onClose();
-      }
-    };
-    if (isOpen) {
-      document.addEventListener("keydown", handleEscape);
-      document.body.style.overflow = "hidden";
-    }
-    return () => {
-      document.removeEventListener("keydown", handleEscape);
-      document.body.style.overflow = "unset";
-    };
-  }, [isOpen, onClose]);
-  if (!isOpen) return null;
-  const overlayStyles = {
-    position: "fixed",
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    backgroundColor: "rgba(0, 0, 0, 0.5)",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    zIndex: 1e3,
-    padding: theme.spacing.md
-  };
-  const modalStyles = {
-    backgroundColor: theme.colors.background,
-    border: `1px solid ${theme.colors.border}`,
-    borderRadius: theme.borderRadius.lg,
-    boxShadow: theme.shadows.lg,
-    maxWidth,
-    width: "100%",
-    maxHeight: "90vh",
-    overflow: "auto"
-  };
-  const headerStyles = {
-    padding: theme.spacing.lg,
-    borderBottom: `1px solid ${theme.colors.border}`,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between"
-  };
-  const titleStyles = {
-    fontSize: theme.typography.fontSize.lg,
-    fontWeight: theme.typography.fontWeight.semibold,
-    color: theme.colors.text,
-    margin: 0
-  };
-  const closeButtonStyles = {
-    background: "none",
-    border: "none",
-    color: theme.colors.textMuted,
-    cursor: "pointer",
-    padding: theme.spacing.sm,
-    borderRadius: theme.borderRadius.sm,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    transition: `color ${theme.animation.normal}`,
-    ":hover": {
-      color: theme.colors.text
-    }
-  };
-  const contentStyles = {
-    padding: theme.spacing.lg
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: overlayStyles, onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      style: modalStyles,
-      className,
-      onClick: (e) => e.stopPropagation(),
-      children: [
-        title && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: headerStyles, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { style: titleStyles, children: title }),
-          /* @__PURE__ */ jsxRuntime.jsx("button", { style: closeButtonStyles, onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(
-            "svg",
-            {
-              width: "20",
-              height: "20",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-              ]
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { style: contentStyles, children })
-      ]
-    }
-  ) });
-};
-
-const DynamicLoginInternal = ({
-  onAuthSuccess,
-  onAuthError,
-  theme: themeMode = "light",
-  className = "",
-  buttonText = "Login with Dynamic",
-  autoTrigger = false
-}) => {
-  const theme = Button.createTheme(themeMode);
-  const [isClient, setIsClient] = React.useState(false);
-  const [isModalOpen, setIsModalOpen] = React.useState(autoTrigger);
-  const [hasAutoTriggered, setHasAutoTriggered] = React.useState(false);
-  const [email, setEmail] = React.useState("");
-  const [otp, setOtp] = React.useState("");
-  const [error, setError] = React.useState(null);
-  const [walletCreationStartTime, setWalletCreationStartTime] = React.useState(null);
-  const [timeoutReached, setTimeoutReached] = React.useState(false);
-  const [loginMethod, setLoginMethod] = React.useState(
-    "options"
-  );
-  let dynamicState = null;
-  let otpHooks = null;
-  let isDynamicReady = false;
-  let hookError = null;
-  try {
-    dynamicState = sdkReactCore.useDynamicContext();
-    otpHooks = sdkReactCore.useConnectWithOtp();
-    isDynamicReady = true;
-  } catch (error2) {
-    hookError = error2 instanceof Error ? error2.message : String(error2);
-  }
-  const connectWithEmail = otpHooks?.connectWithEmail;
-  const verifyOneTimePassword = otpHooks?.verifyOneTimePassword;
-  const handleLogOut = dynamicState?.handleLogOut;
-  const { user, primaryWallet } = dynamicState || {
-    user: null,
-    primaryWallet: null
-  };
-  const isAuthenticated = !!user;
-  const address = primaryWallet?.address;
-  const isConnected = isAuthenticated && !!address;
-  React.useEffect(() => {
-    setIsClient(true);
-  }, []);
-  React.useEffect(() => {
-    if (autoTrigger && isClient && isDynamicReady && !isConnected && !hasAutoTriggered) {
-      setHasAutoTriggered(true);
-      setIsModalOpen(true);
-    }
-  }, [autoTrigger, isClient, isDynamicReady, isConnected, hasAutoTriggered]);
-  React.useEffect(() => {
-    if (isClient && !isDynamicReady && hookError) {
-      const retryTimer = setTimeout(() => {
-        setError(null);
-      }, 2e3);
-      return () => clearTimeout(retryTimer);
-    }
-  }, [isClient, isDynamicReady, hookError]);
-  React.useEffect(() => {
-    if (walletCreationStartTime) {
-      const timer = setTimeout(() => {
-        setTimeoutReached(true);
-      }, 3e4);
-      return () => clearTimeout(timer);
-    }
-  }, [walletCreationStartTime]);
-  React.useEffect(() => {
-    if (isConnected && address) {
-      setIsModalOpen(false);
-      setLoginMethod("options");
-      setEmail("");
-      setOtp("");
-      setError(null);
-      setWalletCreationStartTime(null);
-      setTimeoutReached(false);
-      if (onAuthSuccess) {
-        onAuthSuccess(address);
-      }
-    }
-  }, [isConnected, address, onAuthSuccess]);
-  const handleEmailSubmit = React.useCallback(
-    async (e) => {
-      e.preventDefault();
-      if (!email.trim()) {
-        setError("Please enter a valid email address");
-        return;
-      }
-      if (!connectWithEmail) {
-        setError("Dynamic context not ready. Please try again.");
-        return;
-      }
-      setError(null);
-      try {
-        await connectWithEmail(email);
-        setLoginMethod("otp");
-      } catch (error2) {
-        setError("Failed to send verification code. Please try again.");
-        if (onAuthError) {
-          onAuthError(`Failed to send verification code: ${String(error2)}`);
-        }
-      }
-    },
-    [email, connectWithEmail, onAuthError]
-  );
-  const handleOtpSubmit = React.useCallback(
-    async (e) => {
-      e.preventDefault();
-      if (!otp.trim()) {
-        setError("Please enter the verification code");
-        return;
-      }
-      if (!verifyOneTimePassword) {
-        setError("Dynamic context not ready. Please try again.");
-        return;
-      }
-      setError(null);
-      try {
-        await verifyOneTimePassword(otp);
-        if (user && !primaryWallet) {
-          setWalletCreationStartTime(Date.now());
-        }
-      } catch (error2) {
-        setError("Invalid verification code. Please try again.");
-        if (onAuthError) {
-          onAuthError(`OTP verification failed: ${String(error2)}`);
-        }
-      }
-    },
-    [otp, verifyOneTimePassword, user, primaryWallet, onAuthError]
-  );
-  const handleLogout = React.useCallback(async () => {
-    try {
-      if (handleLogOut) {
-        await handleLogOut();
-      }
-      setIsModalOpen(false);
-      setLoginMethod("options");
-      setEmail("");
-      setOtp("");
-      setError(null);
-      setWalletCreationStartTime(null);
-      setTimeoutReached(false);
-    } catch (error2) {
-      setIsModalOpen(false);
-      setLoginMethod("options");
-      setEmail("");
-      setOtp("");
-      setError(null);
-      setWalletCreationStartTime(null);
-      setTimeoutReached(false);
-    }
-  }, [handleLogOut]);
-  if (!isClient) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { variant: "primary", disabled: true, theme, children: buttonText }) });
-  }
-  if (!isDynamicReady) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { variant: "primary", disabled: true, theme, children: "Loading Dynamic..." }),
-      hookError && /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          style: {
-            marginTop: "8px",
-            fontSize: "12px",
-            color: theme.colors.error,
-            padding: theme.spacing.xs,
-            backgroundColor: theme.mode === "light" ? "#fef2f2" : `${theme.colors.error}20`,
-            borderRadius: theme.borderRadius.sm
-          },
-          children: "Initializing Dynamic context..."
-        }
-      )
-    ] });
-  }
-  const renderAuthOptionsStep = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-[450px] space-y-8", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { textAlign: "center", marginBottom: theme.spacing.lg }, children: /* @__PURE__ */ jsxRuntime.jsx(
-      "h1",
-      {
-        style: {
-          fontSize: "1.875rem",
-          fontWeight: "bold",
-          color: theme.colors.text,
-          marginBottom: theme.spacing.sm
-        },
-        children: "Get Started"
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginBottom: theme.spacing.md }, children: /* @__PURE__ */ jsxRuntime.jsx(
-      Button.Button,
-      {
-        variant: "primary",
-        fullWidth: true,
-        onClick: () => setLoginMethod("email"),
-        theme,
-        children: "Continue with Email"
-      }
-    ) }),
-    error && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        style: {
-          padding: theme.spacing.md,
-          backgroundColor: theme.mode === "light" ? "#fef2f2" : `${theme.colors.error}20`,
-          border: `1px solid ${theme.mode === "light" ? "#fecaca" : theme.colors.error}`,
-          borderRadius: theme.borderRadius.md,
-          marginTop: theme.spacing.md
-        },
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          "p",
-          {
-            style: {
-              color: theme.colors.error,
-              fontSize: theme.typography.fontSize.sm,
-              margin: 0
-            },
-            children: error
-          }
-        )
-      }
-    )
-  ] });
-  const renderEmailStep = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-[450px] space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center", marginBottom: theme.spacing.lg }, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          style: {
-            width: "4rem",
-            height: "4rem",
-            backgroundColor: theme.colors.primary,
-            borderRadius: "50%",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            margin: `0 auto ${theme.spacing.md}`
-          },
-          children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "1.25rem" }, children: "\u2709\uFE0F" })
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "h1",
-        {
-          style: {
-            fontSize: "1.5rem",
-            fontWeight: "bold",
-            color: theme.colors.text,
-            marginBottom: theme.spacing.sm
-          },
-          children: "Email Authentication"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: theme.colors.textMuted }, children: "Enter your email to get started" })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "form",
-      {
-        onSubmit: handleEmailSubmit,
-        style: { marginBottom: theme.spacing.md },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: theme.spacing.md }, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "label",
-              {
-                style: {
-                  display: "block",
-                  fontSize: theme.typography.fontSize.sm,
-                  fontWeight: theme.typography.fontWeight.medium,
-                  color: theme.colors.text,
-                  marginBottom: theme.spacing.xs
-                },
-                children: "Email Address"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Input,
-              {
-                type: "email",
-                value: email,
-                onChange: (e) => setEmail(e.target.value),
-                placeholder: "Enter your email address",
-                required: true,
-                theme
-              }
-            )
-          ] }),
-          error && /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              style: {
-                padding: theme.spacing.md,
-                backgroundColor: theme.mode === "light" ? "#fef2f2" : `${theme.colors.error}20`,
-                border: `1px solid ${theme.mode === "light" ? "#fecaca" : theme.colors.error}`,
-                borderRadius: theme.borderRadius.md,
-                marginBottom: theme.spacing.md
-              },
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  style: {
-                    color: theme.colors.error,
-                    fontSize: theme.typography.fontSize.sm,
-                    margin: 0
-                  },
-                  children: error
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              style: {
-                display: "flex",
-                flexDirection: "column",
-                gap: theme.spacing.sm
-              },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  Button.Button,
-                  {
-                    type: "submit",
-                    variant: "primary",
-                    fullWidth: true,
-                    disabled: !email.trim(),
-                    theme,
-                    children: "Send Verification Code"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  Button.Button,
-                  {
-                    type: "button",
-                    variant: "secondary",
-                    fullWidth: true,
-                    onClick: () => {
-                      setLoginMethod("options");
-                      setError(null);
-                      setEmail("");
-                    },
-                    theme,
-                    children: "\u2190 Back"
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
-  const renderOtpStep = () => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-[450px] space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center", marginBottom: theme.spacing.lg }, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          style: {
-            width: "4rem",
-            height: "4rem",
-            backgroundColor: theme.colors.success,
-            borderRadius: "50%",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            margin: `0 auto ${theme.spacing.md}`
-          },
-          children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "1.25rem", color: "#ffffff" }, children: "\u2713" })
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "h1",
-        {
-          style: {
-            fontSize: "1.5rem",
-            fontWeight: "bold",
-            color: theme.colors.text,
-            marginBottom: theme.spacing.sm
-          },
-          children: "Check Your Email"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs("p", { style: { color: theme.colors.textMuted }, children: [
-        "Enter the verification code sent to",
-        " ",
-        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: theme.colors.primary, fontWeight: "medium" }, children: email })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "form",
-      {
-        onSubmit: handleOtpSubmit,
-        style: { marginBottom: theme.spacing.md },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: theme.spacing.md }, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "label",
-              {
-                style: {
-                  display: "block",
-                  fontSize: theme.typography.fontSize.sm,
-                  fontWeight: theme.typography.fontWeight.medium,
-                  color: theme.colors.text,
-                  marginBottom: theme.spacing.xs
-                },
-                children: "Verification Code"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Input,
-              {
-                type: "text",
-                value: otp,
-                onChange: (e) => setOtp(e.target.value),
-                placeholder: "Enter 6-digit code",
-                maxLength: 6,
-                required: true,
-                theme,
-                className: "ibm-plex-mono",
-                style: {
-                  textAlign: "center",
-                  fontSize: "1.3rem",
-                  letterSpacing: "0.2em",
-                  fontFamily: "IBM Plex Mono"
-                }
-              }
-            )
-          ] }),
-          error && /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              style: {
-                padding: theme.spacing.md,
-                backgroundColor: theme.mode === "light" ? "#fef2f2" : `${theme.colors.error}20`,
-                border: `1px solid ${theme.mode === "light" ? "#fecaca" : theme.colors.error}`,
-                borderRadius: theme.borderRadius.md,
-                marginBottom: theme.spacing.md
-              },
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  style: {
-                    color: theme.colors.error,
-                    fontSize: theme.typography.fontSize.sm,
-                    margin: 0
-                  },
-                  children: error
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              style: {
-                display: "flex",
-                flexDirection: "column",
-                gap: theme.spacing.sm
-              },
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  Button.Button,
-                  {
-                    type: "submit",
-                    variant: "primary",
-                    fullWidth: true,
-                    disabled: !otp.trim(),
-                    theme,
-                    children: "Verify Code"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  Button.Button,
-                  {
-                    type: "button",
-                    variant: "secondary",
-                    fullWidth: true,
-                    onClick: () => {
-                      setError(null);
-                      setOtp("");
-                      setLoginMethod("email");
-                    },
-                    theme,
-                    children: "\u2190 Back to Email"
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    )
-  ] });
-  const renderWalletCreationStep = () => {
-    const isStuck = timeoutReached || walletCreationStartTime && Date.now() - (walletCreationStartTime || 0) > 3e4;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full max-w-[450px] space-y-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center", marginBottom: theme.spacing.lg }, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            style: {
-              width: "4rem",
-              height: "4rem",
-              backgroundColor: theme.colors.warning,
-              borderRadius: "50%",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              margin: `0 auto ${theme.spacing.md}`
-            },
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                style: {
-                  width: "1.5rem",
-                  height: "1.5rem",
-                  border: `2px solid ${theme.colors.text}`,
-                  borderTop: "2px solid transparent",
-                  borderRadius: "50%",
-                  animation: "spin 1s linear infinite"
-                }
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "h1",
-          {
-            style: {
-              fontSize: "1.5rem",
-              fontWeight: "bold",
-              color: theme.colors.text,
-              marginBottom: theme.spacing.sm
-            },
-            children: "Setting up your wallet..."
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: theme.colors.textMuted }, children: "Creating your wallet automatically. This may take a few moments." }),
-        walletCreationStartTime && /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
-          {
-            style: {
-              fontSize: theme.typography.fontSize.sm,
-              color: theme.colors.textMuted,
-              marginTop: theme.spacing.sm
-            },
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
-                "Waiting time:",
-                " ",
-                Math.floor(
-                  (Date.now() - (walletCreationStartTime || 0)) / 1e3
-                ),
-                "s"
-              ] }),
-              timeoutReached && /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  style: { color: theme.colors.warning, fontWeight: "medium" },
-                  children: "\u26A0\uFE0F Taking longer than expected"
-                }
-              )
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          style: {
-            display: "flex",
-            flexDirection: "column",
-            gap: theme.spacing.sm
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Button.Button,
-              {
-                variant: "secondary",
-                fullWidth: true,
-                onClick: () => window.location.reload(),
-                theme,
-                children: "Retry Automatic Creation"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Button.Button,
-              {
-                variant: "secondary",
-                fullWidth: true,
-                onClick: handleLogout,
-                theme,
-                children: "Cancel & Start Over"
-              }
-            )
-          ]
-        }
-      ),
-      isStuck && /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          style: {
-            marginTop: theme.spacing.md,
-            padding: theme.spacing.md,
-            backgroundColor: theme.mode === "light" ? "#fef3c7" : `${theme.colors.warning}20`,
-            border: `1px solid ${theme.mode === "light" ? "#fde68a" : theme.colors.warning}`,
-            borderRadius: theme.borderRadius.md
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "p",
-              {
-                style: {
-                  color: theme.colors.warning,
-                  fontSize: theme.typography.fontSize.sm,
-                  marginBottom: theme.spacing.sm
-                },
-                children: "\u26A0\uFE0F Wallet creation is taking longer than expected. This might be due to network issues."
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
-              {
-                style: {
-                  fontSize: theme.typography.fontSize.xs,
-                  color: theme.colors.textMuted
-                },
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\u2022 Try refreshing the page to restart automatic creation" }),
-                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\u2022 Check your internet connection" }),
-                  /* @__PURE__ */ jsxRuntime.jsx("p", { children: "\u2022 If the issue persists, start over with a new email" })
-                ]
-              }
-            )
-          ]
-        }
-      )
-    ] });
-  };
-  const getModalContent = () => {
-    if (!isDynamicReady) {
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "center", padding: theme.spacing.xl }, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            style: {
-              width: "2.5rem",
-              height: "2.5rem",
-              border: `2px solid ${theme.colors.border}`,
-              borderTop: `2px solid ${theme.colors.primary}`,
-              borderRadius: "50%",
-              animation: "spin 1s linear infinite",
-              margin: `0 auto ${theme.spacing.md}`
-            }
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: theme.colors.textMuted }, children: "Initializing Dynamic..." })
-      ] });
-    }
-    if (isAuthenticated && !address) {
-      return renderWalletCreationStep();
-    }
-    if (loginMethod === "otp") {
-      return renderOtpStep();
-    }
-    if (loginMethod === "email") {
-      return renderEmailStep();
-    }
-    return renderAuthOptionsStep();
-  };
-  if (isConnected && address) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsxs(Button.Button, { variant: "primary", onClick: handleLogout, theme, children: [
-      "Logout (",
-      address.slice(0, 6),
-      "...",
-      address.slice(-4),
-      ")"
-    ] }) });
-  }
-  if (autoTrigger) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          style: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            padding: "20px",
-            flexDirection: "column",
-            gap: "12px"
-          },
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                style: {
-                  width: "40px",
-                  height: "40px",
-                  border: "3px solid #e5e7eb",
-                  borderTop: "3px solid #3b82f6",
-                  borderRadius: "50%",
-                  animation: "spin 1s linear infinite"
-                }
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "#6b7280", fontSize: "14px" }, children: "Opening login..." })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        Modal,
-        {
-          isOpen: isModalOpen,
-          onClose: () => {
-            if (!isAuthenticated || isConnected) {
-              setIsModalOpen(false);
-              setLoginMethod("options");
-              setEmail("");
-              setOtp("");
-              setError(null);
-            }
-          },
-          title: "",
-          theme,
-          children: getModalContent()
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "style",
-        {
-          dangerouslySetInnerHTML: {
-            __html: `
+"use strict";const t=require("react/jsx-runtime"),n=require("react"),a=require("./Button-Cn16gFtO.js"),_=require("@dynamic-labs/sdk-react-core"),V=({label:d,error:i,helper:x,fullWidth:u=!1,startAdornment:h,endAdornment:m,className:e="",style:o,theme:z,...S})=>{const r=z||a.createTheme("light"),w={width:u?"100%":"auto",display:"flex",flexDirection:"column",gap:r.spacing.xs},B={position:"relative",display:"flex",alignItems:"center"},p={backgroundColor:r.colors.surface,border:`1px solid ${i?r.colors.error:r.colors.border}`,borderRadius:r.borderRadius.md,color:r.colors.text,fontSize:r.typography.fontSize.base,padding:r.spacing.md,paddingLeft:h?r.spacing.xl:r.spacing.md,paddingRight:m?r.spacing.xl:r.spacing.md,width:"100%",outline:"none",transition:`border-color ${r.animation.normal}`,":focus":{borderColor:i?r.colors.error:r.colors.primary},":hover":{borderColor:i?r.colors.error:r.colors.borderHover},"::placeholder":{color:r.colors.textMuted}},c={fontSize:r.typography.fontSize.sm,fontWeight:r.typography.fontWeight.medium,color:r.colors.textSecondary},y={fontSize:r.typography.fontSize.xs,color:i?r.colors.error:r.colors.textMuted},g={position:"absolute",top:"50%",transform:"translateY(-50%)",color:r.colors.textMuted,pointerEvents:"none"};return t.jsxs("div",{style:w,children:[d&&t.jsx("label",{style:c,children:d}),t.jsxs("div",{style:B,children:[h&&t.jsx("div",{style:{...g,left:r.spacing.md},children:h}),t.jsx("input",{style:{...p,...o},className:e,...S}),m&&t.jsx("div",{style:{...g,right:r.spacing.md},children:m})]}),(i||x)&&t.jsx("span",{style:y,children:i||x})]})},Y=({isOpen:d,onClose:i,title:x,children:u,maxWidth:h="32rem",className:m="",theme:e})=>{const o=e||a.createTheme("light");if(n.useEffect(()=>{const c=y=>{y.key==="Escape"&&i()};return d&&(document.addEventListener("keydown",c),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",c),document.body.style.overflow="unset"}},[d,i]),!d)return null;const z={position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"rgba(0, 0, 0, 0.5)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3,padding:o.spacing.md},S={backgroundColor:o.colors.background,border:`1px solid ${o.colors.border}`,borderRadius:o.borderRadius.lg,boxShadow:o.shadows.lg,maxWidth:h,width:"100%",maxHeight:"90vh",overflow:"auto"},r={padding:o.spacing.lg,borderBottom:`1px solid ${o.colors.border}`,display:"flex",alignItems:"center",justifyContent:"space-between"},w={fontSize:o.typography.fontSize.lg,fontWeight:o.typography.fontWeight.semibold,color:o.colors.text,margin:0},B={background:"none",border:"none",color:o.colors.textMuted,cursor:"pointer",padding:o.spacing.sm,borderRadius:o.borderRadius.sm,display:"flex",alignItems:"center",justifyContent:"center",transition:`color ${o.animation.normal}`,":hover":{color:o.colors.text}},p={padding:o.spacing.lg};return t.jsx("div",{style:z,onClick:i,children:t.jsxs("div",{style:S,className:m,onClick:c=>c.stopPropagation(),children:[x&&t.jsxs("div",{style:r,children:[t.jsx("h2",{style:w,children:x}),t.jsx("button",{style:B,onClick:i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),t.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]})})]}),t.jsx("div",{style:p,children:u})]})})},Z=({onAuthSuccess:d,onAuthError:i,theme:x="light",className:u="",buttonText:h="Login with Dynamic",autoTrigger:m=!1})=>{const e=a.createTheme(x),[o,z]=n.useState(!1),[S,r]=n.useState(m),[w,B]=n.useState(!1),[p,c]=n.useState(""),[y,g]=n.useState(""),[C,l]=n.useState(null),[k,W]=n.useState(null),[F,E]=n.useState(!1),[O,f]=n.useState("options");let D=null,$=null,b=!1,R=null;try{D=_.useDynamicContext(),$=_.useConnectWithOtp(),b=!0}catch(s){R=s instanceof Error?s.message:String(s)}const I=$?.connectWithEmail,A=$?.verifyOneTimePassword,L=D?.handleLogOut,{user:M,primaryWallet:N}=D||{user:null,primaryWallet:null},T=!!M,j=N?.address,v=T&&!!j;n.useEffect(()=>{z(!0)},[]),n.useEffect(()=>{m&&o&&b&&!v&&!w&&(B(!0),r(!0))},[m,o,b,v,w]),n.useEffect(()=>{if(o&&!b&&R){const s=setTimeout(()=>{l(null)},2e3);return()=>clearTimeout(s)}},[o,b,R]),n.useEffect(()=>{if(k){const s=setTimeout(()=>{E(!0)},3e4);return()=>clearTimeout(s)}},[k]),n.useEffect(()=>{v&&j&&(r(!1),f("options"),c(""),g(""),l(null),W(null),E(!1),d&&d(j))},[v,j,d]);const G=n.useCallback(async s=>{if(s.preventDefault(),!p.trim()){l("Please enter a valid email address");return}if(!I){l("Dynamic context not ready. Please try again.");return}l(null);try{await I(p),f("otp")}catch(P){l("Failed to send verification code. Please try again."),i&&i(`Failed to send verification code: ${String(P)}`)}},[p,I,i]),J=n.useCallback(async s=>{if(s.preventDefault(),!y.trim()){l("Please enter the verification code");return}if(!A){l("Dynamic context not ready. Please try again.");return}l(null);try{await A(y),M&&!N&&W(Date.now())}catch(P){l("Invalid verification code. Please try again."),i&&i(`OTP verification failed: ${String(P)}`)}},[y,A,M,N,i]),q=n.useCallback(async()=>{try{L&&await L(),r(!1),f("options"),c(""),g(""),l(null),W(null),E(!1)}catch{r(!1),f("options"),c(""),g(""),l(null),W(null),E(!1)}},[L]);if(!o)return t.jsx("div",{className:u,children:t.jsx(a.Button,{variant:"primary",disabled:!0,theme:e,children:h})});if(!b)return t.jsxs("div",{className:u,children:[t.jsx(a.Button,{variant:"primary",disabled:!0,theme:e,children:"Loading Dynamic..."}),R&&t.jsx("div",{style:{marginTop:"8px",fontSize:"12px",color:e.colors.error,padding:e.spacing.xs,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,borderRadius:e.borderRadius.sm},children:"Initializing Dynamic context..."})]});const K=()=>t.jsxs("div",{className:"w-full max-w-[450px] space-y-8",children:[t.jsx("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:t.jsx("h1",{style:{fontSize:"1.875rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Get Started"})}),t.jsx("div",{style:{marginBottom:e.spacing.md},children:t.jsx(a.Button,{variant:"primary",fullWidth:!0,onClick:()=>f("email"),theme:e,children:"Continue with Email"})}),C&&t.jsx("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginTop:e.spacing.md},children:t.jsx("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:C})})]}),Q=()=>t.jsxs("div",{className:"w-full max-w-[450px] space-y-6",children:[t.jsxs("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t.jsx("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.primary,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t.jsx("span",{style:{fontSize:"1.25rem"},children:"\u2709\uFE0F"})}),t.jsx("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Email Authentication"}),t.jsx("p",{style:{color:e.colors.textMuted},children:"Enter your email to get started"})]}),t.jsxs("form",{onSubmit:G,style:{marginBottom:e.spacing.md},children:[t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Email Address"}),t.jsx(V,{type:"email",value:p,onChange:s=>c(s.target.value),placeholder:"Enter your email address",required:!0,theme:e})]}),C&&t.jsx("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t.jsx("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:C})}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t.jsx(a.Button,{type:"submit",variant:"primary",fullWidth:!0,disabled:!p.trim(),theme:e,children:"Send Verification Code"}),t.jsx(a.Button,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{f("options"),l(null),c("")},theme:e,children:"\u2190 Back"})]})]})]}),U=()=>t.jsxs("div",{className:"w-full max-w-[450px] space-y-6",children:[t.jsxs("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t.jsx("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.success,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t.jsx("span",{style:{fontSize:"1.25rem",color:"#ffffff"},children:"\u2713"})}),t.jsx("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Check Your Email"}),t.jsxs("p",{style:{color:e.colors.textMuted},children:["Enter the verification code sent to"," ",t.jsx("span",{style:{color:e.colors.primary,fontWeight:"medium"},children:p})]})]}),t.jsxs("form",{onSubmit:J,style:{marginBottom:e.spacing.md},children:[t.jsxs("div",{style:{marginBottom:e.spacing.md},children:[t.jsx("label",{style:{display:"block",fontSize:e.typography.fontSize.sm,fontWeight:e.typography.fontWeight.medium,color:e.colors.text,marginBottom:e.spacing.xs},children:"Verification Code"}),t.jsx(V,{type:"text",value:y,onChange:s=>g(s.target.value),placeholder:"Enter 6-digit code",maxLength:6,required:!0,theme:e,className:"ibm-plex-mono",style:{textAlign:"center",fontSize:"1.3rem",letterSpacing:"0.2em",fontFamily:"IBM Plex Mono"}})]}),C&&t.jsx("div",{style:{padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef2f2":`${e.colors.error}20`,border:`1px solid ${e.mode==="light"?"#fecaca":e.colors.error}`,borderRadius:e.borderRadius.md,marginBottom:e.spacing.md},children:t.jsx("p",{style:{color:e.colors.error,fontSize:e.typography.fontSize.sm,margin:0},children:C})}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t.jsx(a.Button,{type:"submit",variant:"primary",fullWidth:!0,disabled:!y.trim(),theme:e,children:"Verify Code"}),t.jsx(a.Button,{type:"button",variant:"secondary",fullWidth:!0,onClick:()=>{l(null),g(""),f("email")},theme:e,children:"\u2190 Back to Email"})]})]})]}),X=()=>{const s=F||k&&Date.now()-(k||0)>3e4;return t.jsxs("div",{className:"w-full max-w-[450px] space-y-6",children:[t.jsxs("div",{style:{textAlign:"center",marginBottom:e.spacing.lg},children:[t.jsx("div",{style:{width:"4rem",height:"4rem",backgroundColor:e.colors.warning,borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center",margin:`0 auto ${e.spacing.md}`},children:t.jsx("div",{style:{width:"1.5rem",height:"1.5rem",border:`2px solid ${e.colors.text}`,borderTop:"2px solid transparent",borderRadius:"50%",animation:"spin 1s linear infinite"}})}),t.jsx("h1",{style:{fontSize:"1.5rem",fontWeight:"bold",color:e.colors.text,marginBottom:e.spacing.sm},children:"Setting up your wallet..."}),t.jsx("p",{style:{color:e.colors.textMuted},children:"Creating your wallet automatically. This may take a few moments."}),k&&t.jsxs("div",{style:{fontSize:e.typography.fontSize.sm,color:e.colors.textMuted,marginTop:e.spacing.sm},children:[t.jsxs("p",{children:["Waiting time:"," ",Math.floor((Date.now()-(k||0))/1e3),"s"]}),F&&t.jsx("p",{style:{color:e.colors.warning,fontWeight:"medium"},children:"\u26A0\uFE0F Taking longer than expected"})]})]}),t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:e.spacing.sm},children:[t.jsx(a.Button,{variant:"secondary",fullWidth:!0,onClick:()=>window.location.reload(),theme:e,children:"Retry Automatic Creation"}),t.jsx(a.Button,{variant:"secondary",fullWidth:!0,onClick:q,theme:e,children:"Cancel & Start Over"})]}),s&&t.jsxs("div",{style:{marginTop:e.spacing.md,padding:e.spacing.md,backgroundColor:e.mode==="light"?"#fef3c7":`${e.colors.warning}20`,border:`1px solid ${e.mode==="light"?"#fde68a":e.colors.warning}`,borderRadius:e.borderRadius.md},children:[t.jsx("p",{style:{color:e.colors.warning,fontSize:e.typography.fontSize.sm,marginBottom:e.spacing.sm},children:"\u26A0\uFE0F Wallet creation is taking longer than expected. This might be due to network issues."}),t.jsxs("div",{style:{fontSize:e.typography.fontSize.xs,color:e.colors.textMuted},children:[t.jsx("p",{children:"\u2022 Try refreshing the page to restart automatic creation"}),t.jsx("p",{children:"\u2022 Check your internet connection"}),t.jsx("p",{children:"\u2022 If the issue persists, start over with a new email"})]})]})]})},H=()=>b?T&&!j?X():O==="otp"?U():O==="email"?Q():K():t.jsxs("div",{style:{textAlign:"center",padding:e.spacing.xl},children:[t.jsx("div",{style:{width:"2.5rem",height:"2.5rem",border:`2px solid ${e.colors.border}`,borderTop:`2px solid ${e.colors.primary}`,borderRadius:"50%",animation:"spin 1s linear infinite",margin:`0 auto ${e.spacing.md}`}}),t.jsx("p",{style:{color:e.colors.textMuted},children:"Initializing Dynamic..."})]});return v&&j?t.jsx("div",{className:u,children:t.jsxs(a.Button,{variant:"primary",onClick:q,theme:e,children:["Logout (",j.slice(0,6),"...",j.slice(-4),")"]})}):m?t.jsxs("div",{className:u,children:[t.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"20px",flexDirection:"column",gap:"12px"},children:[t.jsx("div",{style:{width:"40px",height:"40px",border:"3px solid #e5e7eb",borderTop:"3px solid #3b82f6",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t.jsx("p",{style:{color:"#6b7280",fontSize:"14px"},children:"Opening login..."})]}),t.jsx(Y,{isOpen:S,onClose:()=>{(!T||v)&&(r(!1),f("options"),c(""),g(""),l(null))},title:"",theme:e,children:H()}),t.jsx("style",{dangerouslySetInnerHTML:{__html:`
             @keyframes spin {
               0% { transform: rotate(0deg); }
               100% { transform: rotate(360deg); }
             }
-          `
-          }
-        }
-      )
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Button.Button,
-      {
-        variant: "primary",
-        onClick: () => setIsModalOpen(true),
-        theme,
-        children: buttonText
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Modal,
-      {
-        isOpen: isModalOpen,
-        onClose: () => {
-          if (!isAuthenticated || isConnected) {
-            setIsModalOpen(false);
-            setLoginMethod("options");
-            setEmail("");
-            setOtp("");
-            setError(null);
-          }
-        },
-        title: "",
-        theme,
-        children: getModalContent()
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "style",
-      {
-        dangerouslySetInnerHTML: {
-          __html: `
+          `}})]}):t.jsxs("div",{className:u,children:[t.jsx(a.Button,{variant:"primary",onClick:()=>r(!0),theme:e,children:h}),t.jsx(Y,{isOpen:S,onClose:()=>{(!T||v)&&(r(!1),f("options"),c(""),g(""),l(null))},title:"",theme:e,children:H()}),t.jsx("style",{dangerouslySetInnerHTML:{__html:`
           @keyframes spin {
             0% { transform: rotate(0deg); }
             100% { transform: rotate(360deg); }
           }
-        `
-        }
-      }
-    )
-  ] });
-};
-class DynamicErrorBoundary extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = { hasError: false };
-  }
-  static getDerivedStateFromError() {
-    return { hasError: true };
-  }
-  componentDidCatch(error) {
-  }
-  render() {
-    if (this.state.hasError) {
-      return this.props.fallback;
-    }
-    return this.props.children;
-  }
-}
-const DynamicLogin = (props) => {
-  const {
-    theme: themeMode = "light",
-    className = "",
-    buttonText = "Login with Dynamic",
-    onAuthError
-  } = props;
-  const theme = Button.createTheme(themeMode);
-  const fallbackComponent = /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: /* @__PURE__ */ jsxRuntime.jsx(
-    Button.Button,
-    {
-      variant: "primary",
-      onClick: () => {
-        const errorMessage = "DynamicLogin must be used within SpiceFlowProvider. Please wrap your app with <SpiceFlowProvider>.";
-        if (onAuthError) {
-          onAuthError(errorMessage);
-        }
-      },
-      theme,
-      children: buttonText
-    }
-  ) });
-  return /* @__PURE__ */ jsxRuntime.jsx(DynamicErrorBoundary, { fallback: fallbackComponent, children: /* @__PURE__ */ jsxRuntime.jsx(DynamicLoginInternal, { ...props }) });
-};
-
-exports.DynamicLogin = DynamicLogin;
+        `}})]})};class ee extends n.Component{constructor(i){super(i),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(i){}render(){return this.state.hasError?this.props.fallback:this.props.children}}const te=d=>{const{theme:i="light",className:x="",buttonText:u="Login with Dynamic",onAuthError:h}=d,m=a.createTheme(i);return t.jsx(ee,{fallback:t.jsx("div",{className:x,children:t.jsx(a.Button,{variant:"primary",onClick:()=>{h&&h("DynamicLogin must be used within SpiceFlowProvider. Please wrap your app with <SpiceFlowProvider>.")},theme:m,children:u})}),children:t.jsx(Z,{...d})})};exports.DynamicLogin=te;