@kryptos_connect/mobile-sdk 0.0.0

package/dist/index.js

@@ -0,0 +1,3834 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  KryptosConnectButton: () => KryptosConnectButton,
+  KryptosConnectModal: () => KryptosConnectModal,
+  KryptosConnectProvider: () => KryptosConnectProvider,
+  useKryptosConnect: () => useKryptosConnect
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/KryptosConnectButton.tsx
+var import_react31 = __toESM(require("react"));
+var import_react_native17 = require("react-native");
+
+// src/assets/LogoIcon.tsx
+var import_react = __toESM(require("react"));
+var import_react_native_svg = __toESM(require("react-native-svg"));
+var LogoIcon = ({ size = 36 }) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_react_native_svg.default, { width: size, height: size, viewBox: "0 0 36 36", fill: "none" }, /* @__PURE__ */ import_react.default.createElement(
+    import_react_native_svg.Path,
+    {
+      d: "M0 4.11429C0 1.84203 1.84203 0 4.11429 0H31.8857C34.158 0 36 1.84203 36 4.11429V31.8857C36 34.158 34.158 36 31.8857 36H4.11429C1.84203 36 0 34.158 0 31.8857V4.11429Z",
+      fill: "#00C693"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_react_native_svg.Path,
+    {
+      d: "M12.3916 28.2857H8.43388C8.03646 28.2857 7.71429 27.9886 7.71429 27.6221V22.92C7.71429 22.744 7.7901 22.5752 7.92505 22.4508L9.66229 20.8487C9.79724 20.7243 9.98027 20.6544 10.1711 20.6544H12.3916C12.789 20.6544 13.1112 20.9515 13.1112 21.318V27.6221C13.1112 27.9886 12.789 28.2857 12.3916 28.2857Z",
+      fill: "white"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_react_native_svg.Path,
+    {
+      d: "M27.5647 28.2857H22.0443C21.8535 28.2857 21.6704 28.2158 21.5355 28.0914L13.9798 21.1236C13.6988 20.8645 13.6988 20.4443 13.9798 20.1851L15.7788 18.5262C15.9137 18.4017 16.0968 18.3318 16.2876 18.3318H18.21C18.4009 18.3318 18.5839 18.4017 18.7189 18.5262L28.0735 27.1529C28.5268 27.5709 28.2058 28.2857 27.5647 28.2857Z",
+      fill: "white"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_react_native_svg.Path,
+    {
+      d: "M27.5647 7.71429H22.0443C21.8535 7.71429 21.6704 7.7842 21.5355 7.90865L13.9798 14.8764C13.6988 15.1355 13.6988 15.5557 13.9798 15.8149L15.7788 17.4738C15.9137 17.5983 16.0968 17.6682 16.2876 17.6682H18.21C18.4009 17.6682 18.5839 17.5983 18.7189 17.4738L28.0735 8.84711C28.5268 8.42907 28.2058 7.71429 27.5647 7.71429Z",
+      fill: "white"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_react_native_svg.Path,
+    {
+      d: "M12.3916 7.71429H8.43388C8.03646 7.71429 7.71429 8.01139 7.71429 8.37788V13.08C7.71429 13.256 7.7901 13.4248 7.92505 13.5492L9.66229 15.1513C9.79724 15.2757 9.98027 15.3456 10.1711 15.3456H12.3916C12.789 15.3456 13.1112 15.0485 13.1112 14.682V8.37788C13.1112 8.01139 12.789 7.71429 12.3916 7.71429Z",
+      fill: "white"
+    }
+  ));
+};
+
+// src/contexts/KryptosContext.tsx
+var import_react2 = __toESM(require("react"));
+var KryptosContext = import_react2.default.createContext(
+  void 0
+);
+var KryptosConnectProvider = ({ children, config }) => {
+  const [isInitialized, setIsInitialized] = import_react2.default.useState(false);
+  const [linkToken, setLinkToken] = import_react2.default.useState("");
+  const [user, setUser] = import_react2.default.useState(null);
+  const [email, setEmail] = import_react2.default.useState("");
+  const [userConsent, setUserConsent] = import_react2.default.useState(
+    null
+  );
+  return /* @__PURE__ */ import_react2.default.createElement(
+    KryptosContext.Provider,
+    {
+      value: {
+        ...config,
+        isInitialized,
+        setIsInitialized,
+        linkToken,
+        setLinkToken,
+        user,
+        setUser,
+        email,
+        setEmail,
+        userConsent,
+        setUserConsent
+      }
+    },
+    children
+  );
+};
+var useKryptosConnect = () => {
+  const ctx = import_react2.default.useContext(KryptosContext);
+  if (!ctx)
+    throw new Error(
+      "useKryptosConnect must be used inside <KryptosConnectProvider>"
+    );
+  return ctx;
+};
+
+// src/hooks/useTheme.ts
+var import_react3 = __toESM(require("react"));
+
+// src/theme/index.ts
+var lightTheme = {
+  colors: {
+    primary: "#00C693",
+    primaryDark: "#00A67A",
+    background: "#FFFFFF",
+    surface: "#F8F9FA",
+    surfaceSecondary: "#F1F3F5",
+    text: "#1A1A1A",
+    textSecondary: "#6B7280",
+    textTertiary: "#9CA3AF",
+    border: "#E5E7EB",
+    borderLight: "#F3F4F6",
+    error: "#EF4444",
+    errorLight: "#FEE2E2",
+    success: "#10B981",
+    successLight: "#D1FAE5",
+    warning: "#F59E0B",
+    warningLight: "#FEF3C7",
+    overlay: "rgba(0, 0, 0, 0.5)",
+    white: "#FFFFFF",
+    black: "#000000"
+  },
+  spacing: {
+    xs: 4,
+    sm: 8,
+    md: 12,
+    lg: 16,
+    xl: 20,
+    xxl: 24,
+    xxxl: 32
+  },
+  borderRadius: {
+    xs: 4,
+    sm: 8,
+    md: 12,
+    lg: 16,
+    xl: 20,
+    full: 9999
+  },
+  fontSize: {
+    xs: 10,
+    sm: 12,
+    md: 14,
+    lg: 16,
+    xl: 18,
+    xxl: 20,
+    xxxl: 24,
+    display: 32
+  },
+  fontWeight: {
+    regular: "400",
+    medium: "500",
+    semibold: "600",
+    bold: "700"
+  },
+  shadow: {
+    sm: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 1 },
+      shadowOpacity: 0.05,
+      shadowRadius: 2,
+      elevation: 1
+    },
+    md: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 2 },
+      shadowOpacity: 0.1,
+      shadowRadius: 4,
+      elevation: 3
+    },
+    lg: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 4 },
+      shadowOpacity: 0.15,
+      shadowRadius: 8,
+      elevation: 5
+    }
+  }
+};
+var darkTheme = {
+  colors: {
+    primary: "#00C693",
+    primaryDark: "#00A67A",
+    background: "#0F0F0F",
+    surface: "#1A1A1A",
+    surfaceSecondary: "#252525",
+    text: "#FFFFFF",
+    textSecondary: "#A1A1A1",
+    textTertiary: "#6B6B6B",
+    border: "#2D2D2D",
+    borderLight: "#1F1F1F",
+    error: "#EF4444",
+    errorLight: "#7F1D1D",
+    success: "#10B981",
+    successLight: "#065F46",
+    warning: "#F59E0B",
+    warningLight: "#78350F",
+    overlay: "rgba(0, 0, 0, 0.7)",
+    white: "#FFFFFF",
+    black: "#000000"
+  },
+  spacing: lightTheme.spacing,
+  borderRadius: lightTheme.borderRadius,
+  fontSize: lightTheme.fontSize,
+  fontWeight: lightTheme.fontWeight,
+  shadow: {
+    sm: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 1 },
+      shadowOpacity: 0.2,
+      shadowRadius: 2,
+      elevation: 1
+    },
+    md: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 2 },
+      shadowOpacity: 0.3,
+      shadowRadius: 4,
+      elevation: 3
+    },
+    lg: {
+      shadowColor: "#000",
+      shadowOffset: { width: 0, height: 4 },
+      shadowOpacity: 0.4,
+      shadowRadius: 8,
+      elevation: 5
+    }
+  }
+};
+var getTheme = (isDark) => {
+  return isDark ? darkTheme : lightTheme;
+};
+
+// src/hooks/useTheme.ts
+var useTheme = () => {
+  const { theme } = useKryptosConnect();
+  const currentTheme = import_react3.default.useMemo(() => {
+    return getTheme(theme === "dark");
+  }, [theme]);
+  return currentTheme;
+};
+
+// src/molecules/Auth.tsx
+var import_react13 = __toESM(require("react"));
+var import_react_native6 = require("react-native");
+
+// src/assets/LinkIcon.tsx
+var import_react4 = __toESM(require("react"));
+var import_react_native_svg2 = __toESM(require("react-native-svg"));
+var LinkIcon = ({
+  size = 20,
+  color = "#00C693"
+}) => {
+  return /* @__PURE__ */ import_react4.default.createElement(import_react_native_svg2.default, { width: size, height: size, viewBox: "0 0 24 24", fill: "none" }, /* @__PURE__ */ import_react4.default.createElement(
+    import_react_native_svg2.Path,
+    {
+      d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react4.default.createElement(
+    import_react_native_svg2.Path,
+    {
+      d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/assets/ShieldIcon.tsx
+var import_react5 = __toESM(require("react"));
+var import_react_native_svg3 = __toESM(require("react-native-svg"));
+var ShieldIcon = ({
+  size = 20,
+  color = "#00C693"
+}) => {
+  return /* @__PURE__ */ import_react5.default.createElement(import_react_native_svg3.default, { width: size, height: size, viewBox: "0 0 24 24", fill: "none" }, /* @__PURE__ */ import_react5.default.createElement(
+    import_react_native_svg3.Path,
+    {
+      d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react5.default.createElement(
+    import_react_native_svg3.Path,
+    {
+      d: "m9 12 2 2 4-4",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/components/Alert.tsx
+var import_react6 = __toESM(require("react"));
+var import_react_native = require("react-native");
+var Alert = ({
+  variant = "default",
+  children,
+  style
+}) => {
+  const theme = useTheme();
+  const getVariantStyles = () => {
+    switch (variant) {
+      case "destructive":
+        return {
+          backgroundColor: theme.colors.errorLight,
+          borderColor: theme.colors.error
+        };
+      default:
+        return {
+          backgroundColor: theme.colors.surface,
+          borderColor: theme.colors.border
+        };
+    }
+  };
+  return /* @__PURE__ */ import_react6.default.createElement(
+    import_react_native.View,
+    {
+      style: [
+        styles.alert,
+        {
+          borderRadius: theme.borderRadius.md,
+          padding: theme.spacing.md
+        },
+        getVariantStyles(),
+        style
+      ]
+    },
+    children
+  );
+};
+var AlertDescription = ({
+  children,
+  style
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ import_react6.default.createElement(
+    import_react_native.Text,
+    {
+      style: [
+        styles.description,
+        {
+          color: theme.colors.text,
+          fontSize: theme.fontSize.md
+        },
+        style
+      ]
+    },
+    children
+  );
+};
+var styles = import_react_native.StyleSheet.create({
+  alert: {
+    borderWidth: 1,
+    marginVertical: 12
+    // theme.spacing.md - consistent alert spacing
+  },
+  title: {
+    fontWeight: "600",
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  description: {
+    lineHeight: 18,
+    textAlign: "center"
+  }
+});
+
+// src/components/Button.tsx
+var import_react7 = __toESM(require("react"));
+var import_react_native2 = require("react-native");
+var Button = ({
+  variant = "primary",
+  size = "md",
+  children,
+  onPress,
+  disabled = false,
+  loading = false,
+  style,
+  textStyle
+}) => {
+  const theme = useTheme();
+  const getVariantStyles = () => {
+    switch (variant) {
+      case "primary":
+        return {
+          backgroundColor: disabled ? theme.colors.textTertiary : theme.colors.primary,
+          borderWidth: 0
+        };
+      case "secondary":
+        return {
+          backgroundColor: disabled ? theme.colors.surfaceSecondary : theme.colors.surface,
+          borderWidth: 1,
+          borderColor: theme.colors.border
+        };
+      case "outline":
+        return {
+          backgroundColor: "transparent",
+          borderWidth: 1,
+          borderColor: disabled ? theme.colors.textTertiary : theme.colors.primary
+        };
+      case "ghost":
+        return {
+          backgroundColor: "transparent",
+          borderWidth: 0
+        };
+      case "success":
+        return {
+          backgroundColor: disabled ? theme.colors.textTertiary : theme.colors.success,
+          borderWidth: 0
+        };
+      case "error":
+        return {
+          backgroundColor: disabled ? theme.colors.textTertiary : theme.colors.error,
+          borderWidth: 0
+        };
+      default:
+        return {};
+    }
+  };
+  const getTextColor = () => {
+    if (disabled) {
+      return variant === "outline" || variant === "ghost" ? theme.colors.textTertiary : theme.colors.white;
+    }
+    switch (variant) {
+      case "primary":
+      case "success":
+      case "error":
+        return theme.colors.white;
+      case "secondary":
+        return theme.colors.text;
+      case "outline":
+        return theme.colors.primary;
+      case "ghost":
+        return theme.colors.text;
+      default:
+        return theme.colors.white;
+    }
+  };
+  const getSizeStyles = () => {
+    switch (size) {
+      case "sm":
+        return {
+          button: {
+            paddingVertical: theme.spacing.sm,
+            paddingHorizontal: theme.spacing.md,
+            borderRadius: theme.borderRadius.sm
+          },
+          text: {
+            fontSize: theme.fontSize.sm
+          }
+        };
+      case "md":
+        return {
+          button: {
+            paddingVertical: theme.spacing.md,
+            paddingHorizontal: theme.spacing.lg,
+            borderRadius: theme.borderRadius.md
+          },
+          text: {
+            fontSize: theme.fontSize.md
+          }
+        };
+      case "lg":
+        return {
+          button: {
+            paddingVertical: theme.spacing.lg,
+            paddingHorizontal: theme.spacing.xl,
+            borderRadius: theme.borderRadius.md
+          },
+          text: {
+            fontSize: theme.fontSize.lg
+          }
+        };
+      default:
+        return {
+          button: {},
+          text: {}
+        };
+    }
+  };
+  const sizeStyles = getSizeStyles();
+  return /* @__PURE__ */ import_react7.default.createElement(
+    import_react_native2.TouchableOpacity,
+    {
+      onPress,
+      disabled: disabled || loading,
+      activeOpacity: 0.7,
+      style: [
+        styles2.button,
+        getVariantStyles(),
+        sizeStyles.button,
+        disabled && styles2.disabled,
+        style
+      ]
+    },
+    loading ? /* @__PURE__ */ import_react7.default.createElement(import_react_native2.ActivityIndicator, { size: "small", color: getTextColor() }) : typeof children === "string" ? /* @__PURE__ */ import_react7.default.createElement(
+      import_react_native2.Text,
+      {
+        style: [
+          styles2.text,
+          { color: getTextColor() },
+          sizeStyles.text,
+          textStyle
+        ]
+      },
+      children
+    ) : /* @__PURE__ */ import_react7.default.createElement(import_react_native2.View, { style: styles2.contentContainer }, children)
+  );
+};
+var styles2 = import_react_native2.StyleSheet.create({
+  button: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    minHeight: 44
+  },
+  text: {
+    fontWeight: "600",
+    textAlign: "center"
+  },
+  disabled: {
+    opacity: 0.6
+  },
+  contentContainer: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
+
+// src/components/Input.tsx
+var import_react8 = __toESM(require("react"));
+var import_react_native3 = require("react-native");
+var Input = ({
+  label,
+  error,
+  helperText,
+  status = "default",
+  containerStyle,
+  inputStyle,
+  labelStyle,
+  ...props
+}) => {
+  const theme = useTheme();
+  const inputStatus = error ? "error" : status;
+  const getBorderColor = () => {
+    switch (inputStatus) {
+      case "error":
+        return theme.colors.error;
+      case "success":
+        return theme.colors.success;
+      default:
+        return theme.colors.border;
+    }
+  };
+  return /* @__PURE__ */ import_react8.default.createElement(import_react_native3.View, { style: [styles3.wrapper, containerStyle] }, label && /* @__PURE__ */ import_react8.default.createElement(
+    import_react_native3.Text,
+    {
+      style: [
+        styles3.label,
+        { color: theme.colors.text, fontSize: theme.fontSize.sm },
+        labelStyle
+      ]
+    },
+    label
+  ), /* @__PURE__ */ import_react8.default.createElement(
+    import_react_native3.TextInput,
+    {
+      placeholderTextColor: theme.colors.textTertiary,
+      style: [
+        styles3.input,
+        {
+          backgroundColor: theme.colors.surface,
+          borderColor: getBorderColor(),
+          color: theme.colors.text,
+          fontSize: theme.fontSize.md,
+          borderRadius: theme.borderRadius.md,
+          paddingHorizontal: theme.spacing.lg,
+          paddingVertical: theme.spacing.md
+        },
+        inputStyle
+      ],
+      ...props
+    }
+  ), error && /* @__PURE__ */ import_react8.default.createElement(
+    import_react_native3.Text,
+    {
+      style: [
+        styles3.error,
+        { color: theme.colors.error, fontSize: theme.fontSize.sm }
+      ]
+    },
+    error
+  ), helperText && !error && /* @__PURE__ */ import_react8.default.createElement(
+    import_react_native3.Text,
+    {
+      style: [
+        styles3.helper,
+        {
+          color: theme.colors.textSecondary,
+          fontSize: theme.fontSize.sm
+        }
+      ]
+    },
+    helperText
+  ));
+};
+var styles3 = import_react_native3.StyleSheet.create({
+  wrapper: {
+    marginBottom: 16
+    // theme.spacing.lg - consistent form spacing
+  },
+  label: {
+    fontWeight: "500",
+    marginBottom: 8
+    // theme.spacing.sm
+  },
+  input: {
+    borderWidth: 1,
+    minHeight: 48
+  },
+  error: {
+    marginTop: 4
+    // theme.spacing.xs
+  },
+  helper: {
+    marginTop: 4
+    // theme.spacing.xs
+  }
+});
+
+// src/components/Modal.tsx
+var import_react10 = __toESM(require("react"));
+var import_react_native4 = require("react-native");
+
+// src/assets/CloseIcon.tsx
+var import_react9 = __toESM(require("react"));
+var import_react_native_svg4 = __toESM(require("react-native-svg"));
+var CloseIcon = ({
+  size = 20,
+  color = "#000"
+}) => {
+  return /* @__PURE__ */ import_react9.default.createElement(import_react_native_svg4.default, { width: size, height: size, viewBox: "0 0 20 20", fill: "none" }, /* @__PURE__ */ import_react9.default.createElement(
+    import_react_native_svg4.Path,
+    {
+      d: "M15 5L5 15M5 5L15 15",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/components/Modal.tsx
+var { height: SCREEN_HEIGHT } = import_react_native4.Dimensions.get("window");
+var Modal = ({
+  isOpen,
+  onClose,
+  children,
+  size = "md",
+  closeOnOverlayClick = true,
+  disableClose = true,
+  style
+}) => {
+  const theme = useTheme();
+  const getSizeStyles = () => {
+    switch (size) {
+      case "xs":
+        return { maxHeight: SCREEN_HEIGHT * 0.35 };
+      case "sm":
+        return { maxHeight: SCREEN_HEIGHT * 0.45 };
+      case "md":
+        return { maxHeight: SCREEN_HEIGHT * 0.55 };
+      case "lg":
+        return { maxHeight: SCREEN_HEIGHT * 0.65 };
+      case "xl":
+        return { maxHeight: SCREEN_HEIGHT * 0.75 };
+      case "full":
+        return { maxHeight: SCREEN_HEIGHT * 0.85 };
+      default:
+        return { maxHeight: SCREEN_HEIGHT * 0.6 };
+    }
+  };
+  const handleOverlayPress = () => {
+    if (!disableClose && closeOnOverlayClick) onClose();
+  };
+  return /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native4.KeyboardAvoidingView,
+    {
+      behavior: import_react_native4.Platform.OS === "ios" ? "padding" : "height",
+      style: styles4.keyboardView
+    },
+    /* @__PURE__ */ import_react10.default.createElement(
+      import_react_native4.Modal,
+      {
+        visible: isOpen,
+        transparent: true,
+        animationType: "none",
+        statusBarTranslucent: true,
+        onRequestClose: disableClose ? void 0 : onClose
+      },
+      /* @__PURE__ */ import_react10.default.createElement(
+        import_react_native4.TouchableOpacity,
+        {
+          activeOpacity: 1,
+          style: [styles4.overlay, { backgroundColor: theme.colors.overlay }],
+          onPress: handleOverlayPress
+        },
+        /* @__PURE__ */ import_react10.default.createElement(
+          import_react_native4.View,
+          {
+            style: [
+              styles4.container,
+              {
+                backgroundColor: theme.colors.background,
+                borderTopLeftRadius: theme.borderRadius.xl,
+                borderTopRightRadius: theme.borderRadius.xl,
+                ...theme.shadow.lg,
+                paddingBottom: theme.spacing.xl
+                // 20
+              },
+              getSizeStyles(),
+              style
+            ],
+            onStartShouldSetResponder: () => true
+          },
+          children
+        )
+      )
+    )
+  );
+};
+var ModalHeader = ({
+  children,
+  onClose,
+  showCloseButton = true,
+  style
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native4.View,
+    {
+      style: [
+        styles4.header,
+        {
+          borderBottomColor: theme.colors.border,
+          paddingHorizontal: theme.spacing.lg,
+          paddingVertical: theme.spacing.md
+        },
+        style
+      ]
+    },
+    /* @__PURE__ */ import_react10.default.createElement(import_react_native4.View, { style: styles4.headerContent }, typeof children === "string" ? /* @__PURE__ */ import_react10.default.createElement(
+      import_react_native4.Text,
+      {
+        style: [
+          styles4.title,
+          { color: theme.colors.text, fontSize: theme.fontSize.lg }
+        ]
+      },
+      children
+    ) : children),
+    showCloseButton && onClose && /* @__PURE__ */ import_react10.default.createElement(
+      import_react_native4.TouchableOpacity,
+      {
+        onPress: onClose,
+        hitSlop: { top: 10, bottom: 10, left: 10, right: 10 },
+        style: [
+          styles4.closeButton,
+          { backgroundColor: theme.colors.surface }
+        ]
+      },
+      /* @__PURE__ */ import_react10.default.createElement(CloseIcon, { color: theme.colors.text, size: 20 })
+    )
+  );
+};
+var ModalBody = ({
+  children,
+  style,
+  scrollable = true
+}) => {
+  const theme = useTheme();
+  if (scrollable) {
+    return /* @__PURE__ */ import_react10.default.createElement(
+      import_react_native4.ScrollView,
+      {
+        style: styles4.bodyScroll,
+        contentContainerStyle: [
+          styles4.bodyContent,
+          { padding: theme.spacing.lg },
+          style
+        ],
+        showsVerticalScrollIndicator: false,
+        keyboardShouldPersistTaps: "handled"
+      },
+      children
+    );
+  }
+  return /* @__PURE__ */ import_react10.default.createElement(import_react_native4.View, { style: [styles4.body, { padding: theme.spacing.lg }, style] }, children);
+};
+var ModalFooter = ({
+  children,
+  style
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native4.View,
+    {
+      style: [
+        styles4.footer,
+        {
+          borderTopColor: theme.colors.border,
+          paddingHorizontal: theme.spacing.lg,
+          paddingVertical: theme.spacing.md
+        },
+        style
+      ]
+    },
+    children
+  );
+};
+var styles4 = import_react_native4.StyleSheet.create({
+  keyboardView: {
+    flex: 1
+  },
+  overlay: {
+    flex: 1,
+    justifyContent: "flex-end",
+    alignItems: "center"
+    // 🔥 ensures modal respects height
+  },
+  container: {
+    width: "100%",
+    overflow: "hidden",
+    alignSelf: "center",
+    flexDirection: "column",
+    maxWidth: "100%",
+    minHeight: 0,
+    flexShrink: 1,
+    flexGrow: 1
+  },
+  header: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    borderBottomWidth: 1
+  },
+  headerContent: {
+    flex: 1,
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  title: {
+    fontWeight: "600"
+  },
+  closeButton: {
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    alignItems: "center",
+    justifyContent: "center",
+    marginLeft: 12
+  },
+  bodyScroll: {
+    flexShrink: 1
+  },
+  bodyContent: {
+    flexGrow: 1,
+    paddingBottom: 20
+  },
+  body: {
+    flex: 1
+  },
+  footer: {
+    borderTopWidth: 1
+  }
+});
+
+// src/services/api.ts
+var import_axios = __toESM(require("axios"));
+
+// src/config/index.ts
+var BASE_URL = "https://connect-dev.kryptos.io/connect/";
+
+// src/services/api.ts
+var api = import_axios.default.create({
+  baseURL: BASE_URL,
+  headers: {
+    "Content-Type": "application/json"
+  }
+});
+var SCOPES = "openid offline_access profile email holdings:read transactions:read defi-portfolio:read nft-portfolio:read ledger:read tax:read integrations:read holdings:write transactions:write defi-portfolio:write nft-portfolio:write ledger:write tax:write integrations:write";
+async function sendEmailOtp(linkToken, email, clientId) {
+  const res = await api.post(
+    "/v1/sendEmailOTP",
+    {
+      email,
+      purpose: "login",
+      clientId
+    },
+    {
+      headers: {
+        "X-Link-Token": linkToken
+      }
+    }
+  );
+  return res.data;
+}
+async function loginWithOtp(linkToken, email, code, clientId) {
+  const res = await api.post(
+    "/v1/loginUserUsingOTP",
+    {
+      email,
+      code,
+      clientId,
+      purpose: "login"
+    },
+    {
+      headers: {
+        "X-Link-Token": linkToken
+      }
+    }
+  );
+  return res.data;
+}
+async function createAnonymousUser(linkToken, clientId) {
+  const res = await api.post(
+    "/v1/anonymousAccountCreation",
+    { clientId },
+    {
+      headers: {
+        "X-Link-Token": linkToken
+      }
+    }
+  );
+  return res.data;
+}
+async function addUserIntegration(linkToken, integration) {
+  const res = await api.post(
+    "/v1/addUserIntegration",
+    { providers: [...integration] },
+    {
+      headers: {
+        "X-Link-Token": linkToken
+      }
+    }
+  );
+  return res.data;
+}
+async function giveUserConsent(linkToken) {
+  const res = await api.post(
+    "/v1/consent",
+    {
+      granted_scopes: SCOPES,
+      user_consent: true
+    },
+    {
+      headers: {
+        "X-Link-Token": linkToken
+      }
+    }
+  );
+  return res.data;
+}
+async function testCredentials(linkToken, data) {
+  const res = await api.post("/v1/api/testCredentials", data, {
+    headers: {
+      "X-Link-Token": linkToken
+    }
+  });
+  return res.data;
+}
+async function getSupportedProviders(linkToken) {
+  const res = await api.get("/v1/integrations", {
+    headers: {
+      "X-Link-Token": linkToken
+    }
+  });
+  return res.data;
+}
+async function getUserIntegrations(linkToken) {
+  const res = await api.get("/v1/userIntegrations", {
+    headers: {
+      "X-Link-Token": linkToken
+    }
+  });
+  return res.data;
+}
+async function getUserUsedChains(linkToken, address) {
+  const res = await api.get("/v1/api/getUserUsedChainV2", {
+    headers: {
+      "X-Link-Token": linkToken
+    },
+    params: {
+      id: address
+    }
+  });
+  return res.data;
+}
+
+// src/molecules/ConnectLogo.tsx
+var import_react12 = __toESM(require("react"));
+var import_react_native5 = require("react-native");
+
+// src/assets/UnplugIcon.tsx
+var import_react11 = __toESM(require("react"));
+var import_react_native_svg5 = __toESM(require("react-native-svg"));
+var UnplugIcon = ({
+  size = 24,
+  color = "#6B7280"
+}) => {
+  return /* @__PURE__ */ import_react11.default.createElement(import_react_native_svg5.default, { width: size, height: size, viewBox: "0 0 24 24", fill: "none" }, /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native_svg5.Path,
+    {
+      d: "m19 5 3-3",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native_svg5.Path,
+    {
+      d: "m2 22 3-3",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native_svg5.Path,
+    {
+      d: "M6.3 20.3a2.4 2.4 0 0 0 3.4 0L12 18l-6-6-2.3 2.3a2.4 2.4 0 0 0 0 3.4Z",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native_svg5.Path,
+    {
+      d: "m18 12-6-6 2.3-2.3a2.4 2.4 0 0 1 3.4 0l2.6 2.6a2.4 2.4 0 0 1 0 3.4Z",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ), /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native_svg5.Line,
+    {
+      x1: 7.5,
+      y1: 13.5,
+      x2: 10.5,
+      y2: 10.5,
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round"
+    }
+  ));
+};
+
+// src/molecules/ConnectLogo.tsx
+var KryptosLogo = () => {
+  const theme = useTheme();
+  return /* @__PURE__ */ import_react12.default.createElement(
+    import_react_native5.View,
+    {
+      style: [styles5.logoContainer, { backgroundColor: theme.colors.surface }]
+    },
+    /* @__PURE__ */ import_react12.default.createElement(LogoIcon, { size: 36 })
+  );
+};
+var ConnectLogo = () => {
+  const { appName, appLogo } = useKryptosConnect();
+  const theme = useTheme();
+  const isValidUrl = (str) => {
+    try {
+      new URL(str);
+      return true;
+    } catch {
+      return false;
+    }
+  };
+  const renderLogo = () => {
+    if ((0, import_react12.isValidElement)(appLogo)) {
+      return appLogo;
+    } else if (typeof appLogo === "string" && isValidUrl(appLogo)) {
+      return /* @__PURE__ */ import_react12.default.createElement(
+        import_react_native5.Image,
+        {
+          source: { uri: appLogo },
+          style: styles5.appLogoImage,
+          resizeMode: "contain"
+        }
+      );
+    } else if (typeof appLogo === "number" || typeof appLogo === "object" && appLogo !== null) {
+      return /* @__PURE__ */ import_react12.default.createElement(
+        import_react_native5.Image,
+        {
+          source: appLogo,
+          style: styles5.appLogoImage,
+          resizeMode: "contain"
+        }
+      );
+    } else if (appName) {
+      return /* @__PURE__ */ import_react12.default.createElement(import_react_native5.Text, { style: [styles5.appLogoText, { color: theme.colors.text }] }, appName.charAt(0).toUpperCase());
+    }
+    return /* @__PURE__ */ import_react12.default.createElement(import_react_native5.Text, { style: [styles5.appLogoText, { color: theme.colors.text }] }, "?");
+  };
+  return /* @__PURE__ */ import_react12.default.createElement(import_react_native5.View, { style: styles5.container }, /* @__PURE__ */ import_react12.default.createElement(KryptosLogo, null), /* @__PURE__ */ import_react12.default.createElement(import_react_native5.View, { style: styles5.iconContainer }, /* @__PURE__ */ import_react12.default.createElement(UnplugIcon, { size: 24, color: theme.colors.textSecondary })), /* @__PURE__ */ import_react12.default.createElement(
+    import_react_native5.View,
+    {
+      style: [
+        styles5.logoContainer,
+        { backgroundColor: theme.colors.surface }
+      ]
+    },
+    renderLogo()
+  ));
+};
+var styles5 = import_react_native5.StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    marginVertical: 24,
+    // theme.spacing.xxl
+    gap: 12
+    // theme.spacing.md
+  },
+  logoContainer: {
+    width: 56,
+    height: 56,
+    borderRadius: 12,
+    // theme.borderRadius.md
+    alignItems: "center",
+    justifyContent: "center",
+    overflow: "hidden"
+  },
+  iconContainer: {
+    paddingHorizontal: 8
+    // theme.spacing.sm
+  },
+  appLogoImage: {
+    width: 32,
+    height: 32
+  },
+  appLogoText: {
+    fontSize: 24,
+    // theme.fontSize.xxxl
+    fontWeight: "700"
+  }
+});
+
+// src/molecules/Auth.tsx
+var Auth = ({
+  open,
+  onEmailSuccess,
+  onGuestSuccess,
+  onClose
+}) => {
+  const { appName, linkToken, clientId, setUser, setEmail } = useKryptosConnect();
+  const theme = useTheme();
+  const [isLoading, setIsLoading] = import_react13.default.useState(false);
+  const [errorMessage, setErrorMessage] = import_react13.default.useState("");
+  const [emailValue, setEmailValue] = import_react13.default.useState("");
+  const [emailError, setEmailError] = import_react13.default.useState("");
+  const [loadingType, setLoadingType] = import_react13.default.useState(null);
+  const validateEmail = (email) => {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    if (!email) {
+      setEmailError("Email is required");
+      return false;
+    }
+    if (!emailRegex.test(email)) {
+      setEmailError("Invalid email address");
+      return false;
+    }
+    setEmailError("");
+    return true;
+  };
+  const handleClose = () => {
+    onClose();
+    setEmailValue("");
+    setEmailError("");
+    setErrorMessage("");
+  };
+  const handleEmailSubmit = async () => {
+    if (!validateEmail(emailValue)) return;
+    try {
+      setIsLoading(true);
+      setLoadingType("email");
+      setErrorMessage("");
+      await sendEmailOtp(linkToken, emailValue, clientId);
+      setEmail(emailValue);
+      setEmailError("");
+      onEmailSuccess();
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to send email OTP"
+      );
+    } finally {
+      setIsLoading(false);
+      setLoadingType(null);
+    }
+  };
+  const handleContinueAsGuest = async () => {
+    try {
+      setIsLoading(true);
+      setLoadingType("guest");
+      setErrorMessage("");
+      const res = await createAnonymousUser(linkToken, clientId);
+      setUser(res);
+      setEmailError("");
+      onGuestSuccess();
+    } catch (error) {
+      const err = error;
+      console.error(error);
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to continue as guest"
+      );
+    } finally {
+      setIsLoading(false);
+      setLoadingType(null);
+    }
+  };
+  const infoSections = [
+    {
+      icon: /* @__PURE__ */ import_react13.default.createElement(LinkIcon, { size: 20, color: theme.colors.primary }),
+      title: "Simple and secure",
+      text: "Connect your Web3 accounts with Kryptos in just a few clicks"
+    },
+    {
+      icon: /* @__PURE__ */ import_react13.default.createElement(ShieldIcon, { size: 20, color: theme.colors.primary }),
+      title: "Control what you share",
+      text: "We never share your data without your permission"
+    }
+  ];
+  return /* @__PURE__ */ import_react13.default.createElement(Modal, { isOpen: open, onClose: handleClose, size: "full" }, /* @__PURE__ */ import_react13.default.createElement(ModalHeader, { onClose: handleClose }, ""), /* @__PURE__ */ import_react13.default.createElement(ModalBody, null, /* @__PURE__ */ import_react13.default.createElement(import_react_native6.View, { style: styles6.container }, /* @__PURE__ */ import_react13.default.createElement(import_react_native6.Text, { style: [styles6.title, { color: theme.colors.text }] }, "Connect ", appName, " to your Kryptos account"), /* @__PURE__ */ import_react13.default.createElement(ConnectLogo, null), infoSections.map((section, index) => /* @__PURE__ */ import_react13.default.createElement(import_react_native6.View, { key: `info-${index}`, style: styles6.infoSection }, /* @__PURE__ */ import_react13.default.createElement(import_react_native6.View, { style: styles6.infoIcon }, section.icon), /* @__PURE__ */ import_react13.default.createElement(import_react_native6.View, { style: styles6.infoContent }, /* @__PURE__ */ import_react13.default.createElement(import_react_native6.Text, { style: [styles6.infoTitle, { color: theme.colors.text }] }, section.title), /* @__PURE__ */ import_react13.default.createElement(
+    import_react_native6.Text,
+    {
+      style: [
+        styles6.infoDescription,
+        { color: theme.colors.textSecondary }
+      ]
+    },
+    section.text
+  )))), errorMessage ? /* @__PURE__ */ import_react13.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react13.default.createElement(AlertDescription, null, errorMessage)) : null, /* @__PURE__ */ import_react13.default.createElement(
+    Input,
+    {
+      placeholder: "Enter email address",
+      value: emailValue,
+      onChangeText: (text) => {
+        setEmailValue(text);
+        if (emailError) validateEmail(text);
+      },
+      error: emailError,
+      keyboardType: "email-address",
+      autoCapitalize: "none",
+      autoCorrect: false
+    }
+  ), /* @__PURE__ */ import_react13.default.createElement(Alert, { variant: "default" }, /* @__PURE__ */ import_react13.default.createElement(AlertDescription, null, "Sign in or create your Kryptos account with your email for quicker access next time.")), /* @__PURE__ */ import_react13.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: handleEmailSubmit,
+      loading: loadingType === "email",
+      disabled: isLoading,
+      style: styles6.button
+    },
+    "Continue"
+  ), /* @__PURE__ */ import_react13.default.createElement(import_react_native6.Text, { style: [styles6.footer, { color: theme.colors.textSecondary }] }, "By continuing, you agree to Kryptos", " ", /* @__PURE__ */ import_react13.default.createElement(
+    import_react_native6.Text,
+    {
+      style: {
+        color: theme.colors.primary,
+        textDecorationLine: "underline"
+      }
+    },
+    "Privacy Policy"
+  )), /* @__PURE__ */ import_react13.default.createElement(
+    Button,
+    {
+      variant: "ghost",
+      size: "lg",
+      onPress: handleContinueAsGuest,
+      loading: loadingType === "guest",
+      disabled: isLoading,
+      style: styles6.button
+    },
+    "Continue as guest"
+  ))));
+};
+var styles6 = import_react_native6.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  title: {
+    fontSize: 18,
+    // theme.fontSize.xl
+    fontWeight: "600",
+    textAlign: "center",
+    marginBottom: 16
+    // theme.spacing.lg - consistent section spacing
+  },
+  infoSection: {
+    flexDirection: "row",
+    marginBottom: 16,
+    // theme.spacing.lg
+    alignItems: "flex-start"
+  },
+  infoIcon: {
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    // theme.borderRadius.lg
+    alignItems: "center",
+    justifyContent: "center",
+    marginRight: 12
+    // theme.spacing.md
+  },
+  infoContent: {
+    flex: 1
+  },
+  infoTitle: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "600",
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  infoDescription: {
+    fontSize: 13,
+    lineHeight: 18
+  },
+  button: {
+    width: "100%",
+    marginTop: 16
+    // theme.spacing.lg - consistent button spacing
+  },
+  footer: {
+    fontSize: 12,
+    // theme.fontSize.sm
+    textAlign: "center",
+    marginTop: 16
+    // theme.spacing.lg
+  }
+});
+
+// src/components/OTP.tsx
+var import_react14 = __toESM(require("react"));
+var import_react_native7 = require("react-native");
+var OTP = ({
+  length = 6,
+  value = "",
+  onChange,
+  onComplete,
+  error,
+  label,
+  disabled = false,
+  containerStyle,
+  inputStyle,
+  setErrorMessage
+}) => {
+  const theme = useTheme();
+  const AUTO_SUBMIT_DELAY = 500;
+  const [otp, setOtp] = import_react14.default.useState(
+    value.split("").concat(Array(length).fill("")).slice(0, length)
+  );
+  const inputRefs = import_react14.default.useRef([]);
+  import_react14.default.useEffect(() => {
+    const isComplete = otp.every((digit) => digit !== "");
+    let timer;
+    if (isComplete && onComplete) {
+      timer = setTimeout(() => {
+        onComplete(otp.join(""));
+      }, AUTO_SUBMIT_DELAY);
+    }
+    return () => {
+      if (timer) clearTimeout(timer);
+    };
+  }, [otp, onComplete]);
+  import_react14.default.useEffect(() => {
+    setTimeout(() => {
+      inputRefs.current[0]?.focus();
+    }, 100);
+  }, []);
+  const handleChange = import_react14.default.useCallback(
+    (index, val) => {
+      if (disabled) return;
+      setErrorMessage("");
+      const numericValue = val.replace(/[^0-9]/g, "");
+      const newValue = numericValue.slice(-1);
+      if (val && !numericValue) {
+        return;
+      }
+      const newOtp = [...otp];
+      newOtp[index] = newValue;
+      setOtp(newOtp);
+      const otpString = newOtp.join("");
+      onChange?.(otpString);
+      if (newValue && index < length - 1) {
+        inputRefs.current[index + 1]?.focus();
+      }
+      if (otpString.length === length && !otpString.includes("")) {
+        onComplete?.(otpString);
+      }
+    },
+    [otp, length, onChange, onComplete, disabled]
+  );
+  const handleKeyPress = import_react14.default.useCallback(
+    (index, e) => {
+      if (disabled) return;
+      if (e.nativeEvent.key === "Backspace") {
+        if (!otp[index] && index > 0) {
+          inputRefs.current[index - 1]?.focus();
+        } else {
+          const newOtp = [...otp];
+          newOtp[index] = "";
+          setOtp(newOtp);
+          onChange?.(newOtp.join(""));
+        }
+      }
+    },
+    [otp, onChange, disabled]
+  );
+  const getBorderColor = (index) => {
+    if (error) return theme.colors.error;
+    if (otp[index]) return theme.colors.success;
+    return theme.colors.border;
+  };
+  return /* @__PURE__ */ import_react14.default.createElement(import_react_native7.View, { style: [styles7.wrapper, containerStyle] }, label && /* @__PURE__ */ import_react14.default.createElement(
+    import_react_native7.Text,
+    {
+      style: [
+        styles7.label,
+        { color: theme.colors.text, fontSize: theme.fontSize.sm }
+      ]
+    },
+    label
+  ), /* @__PURE__ */ import_react14.default.createElement(import_react_native7.View, { style: styles7.container }, Array.from({ length }, (_, index) => /* @__PURE__ */ import_react14.default.createElement(
+    import_react_native7.TextInput,
+    {
+      key: index,
+      ref: (el) => inputRefs.current[index] = el,
+      style: [
+        styles7.input,
+        {
+          backgroundColor: theme.colors.surface,
+          borderColor: getBorderColor(index),
+          color: theme.colors.text,
+          fontSize: theme.fontSize.xxl,
+          borderRadius: theme.borderRadius.md
+        },
+        inputStyle
+      ],
+      keyboardType: "numeric",
+      maxLength: 1,
+      value: otp[index] || "",
+      onChangeText: (val) => handleChange(index, val),
+      onKeyPress: (e) => handleKeyPress(index, e),
+      editable: !disabled,
+      selectTextOnFocus: true,
+      caretHidden: true
+    }
+  ))), error && /* @__PURE__ */ import_react14.default.createElement(
+    import_react_native7.Text,
+    {
+      style: [
+        styles7.error,
+        { color: theme.colors.error, fontSize: theme.fontSize.sm }
+      ]
+    },
+    error
+  ));
+};
+var styles7 = import_react_native7.StyleSheet.create({
+  wrapper: {
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  label: {
+    fontWeight: "500",
+    marginBottom: 12,
+    // theme.spacing.md - consistent label spacing
+    textAlign: "center"
+  },
+  container: {
+    flexDirection: "row",
+    justifyContent: "center",
+    gap: 8
+    // theme.spacing.sm
+  },
+  input: {
+    width: 48,
+    height: 56,
+    borderWidth: 1,
+    textAlign: "center",
+    fontWeight: "600"
+  },
+  error: {
+    marginTop: 12,
+    // theme.spacing.md - consistent error spacing
+    textAlign: "center"
+  }
+});
+
+// src/molecules/Init.tsx
+var import_react15 = __toESM(require("react"));
+var import_react_native8 = require("react-native");
+var Init = ({
+  open,
+  onSuccess,
+  onClose,
+  generateLinkToken
+}) => {
+  const { setIsInitialized, isInitialized, setLinkToken } = useKryptosConnect();
+  const theme = useTheme();
+  const [isFetching, setIsFetching] = import_react15.default.useState(false);
+  const [error, setError] = import_react15.default.useState(null);
+  const fetchLinkToken = import_react15.default.useCallback(async () => {
+    if (!open) return;
+    setIsFetching(true);
+    setError(null);
+    try {
+      const linkToken = await generateLinkToken();
+      if (!linkToken) {
+        setIsInitialized(false);
+        setError("Failed to fetch link token. Please try again.");
+        return;
+      }
+      setLinkToken(linkToken);
+      setIsInitialized(true);
+      onSuccess();
+    } catch (err) {
+      console.error("Failed to fetch link token:", err);
+      setIsInitialized(false);
+      setError("Failed to fetch link token. Please try again.");
+    } finally {
+      setIsFetching(false);
+    }
+  }, [generateLinkToken, open, setIsInitialized, setLinkToken, onSuccess]);
+  import_react15.default.useEffect(() => {
+    fetchLinkToken();
+  }, [fetchLinkToken]);
+  return /* @__PURE__ */ import_react15.default.createElement(Modal, { isOpen: open, onClose, size: "xs" }, /* @__PURE__ */ import_react15.default.createElement(ModalHeader, { onClose }, "Kryptos Connect"), /* @__PURE__ */ import_react15.default.createElement(ModalBody, null, /* @__PURE__ */ import_react15.default.createElement(import_react_native8.View, { style: styles8.container }, isFetching && /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
+    import_react_native8.ActivityIndicator,
+    {
+      size: "large",
+      color: theme.colors.primary,
+      style: styles8.spinner
+    }
+  ), /* @__PURE__ */ import_react15.default.createElement(import_react_native8.Text, { style: [styles8.message, { color: theme.colors.text }] }, isInitialized ? "Fetching link token..." : "Initializing...")), !isFetching && error && /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react15.default.createElement(AlertDescription, null, error)), /* @__PURE__ */ import_react15.default.createElement(
+    Button,
+    {
+      variant: "primary",
+      size: "lg",
+      onPress: fetchLinkToken,
+      style: styles8.retryButton
+    },
+    "Retry"
+  )))));
+};
+var styles8 = import_react_native8.StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingVertical: 16
+    // theme.spacing.lg
+  },
+  spinner: {
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  message: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "500"
+  },
+  errorText: {
+    textAlign: "center"
+  },
+  retryButton: {
+    marginTop: 12,
+    width: "100%"
+  }
+});
+
+// src/molecules/Integration.tsx
+var import_react27 = __toESM(require("react"));
+var import_react_native13 = require("react-native");
+
+// src/assets/ArrowLeftIcon.tsx
+var import_react16 = __toESM(require("react"));
+var import_react_native_svg6 = __toESM(require("react-native-svg"));
+var ArrowLeftIcon = ({
+  size = 20,
+  color = "#000"
+}) => {
+  return /* @__PURE__ */ import_react16.default.createElement(import_react_native_svg6.default, { width: size, height: size, viewBox: "0 0 24 24", fill: "none" }, /* @__PURE__ */ import_react16.default.createElement(
+    import_react_native_svg6.Path,
+    {
+      d: "M19 12H5M12 19l-7-7 7-7",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/assets/CheckCircleIcon.tsx
+var import_react17 = __toESM(require("react"));
+var import_react_native_svg7 = __toESM(require("react-native-svg"));
+var CheckCircleIcon = ({
+  size = 20,
+  color = "#10B981"
+}) => {
+  return /* @__PURE__ */ import_react17.default.createElement(import_react_native_svg7.default, { width: size, height: size, viewBox: "0 0 24 24", fill: "none" }, /* @__PURE__ */ import_react17.default.createElement(
+    import_react_native_svg7.Circle,
+    {
+      cx: 12,
+      cy: 12,
+      r: 10,
+      stroke: color,
+      strokeWidth: 2
+    }
+  ), /* @__PURE__ */ import_react17.default.createElement(
+    import_react_native_svg7.Path,
+    {
+      d: "m9 12 2 2 4-4",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/assets/LoaderIcon.tsx
+var import_react18 = __toESM(require("react"));
+var import_react_native9 = require("react-native");
+var import_react_native_svg8 = __toESM(require("react-native-svg"));
+var AnimatedSvg = import_react_native9.Animated.createAnimatedComponent(import_react_native_svg8.default);
+var LoaderIcon = ({
+  size = 20,
+  color = "#00C693"
+}) => {
+  const rotateAnim = import_react18.default.useRef(new import_react_native9.Animated.Value(0)).current;
+  import_react18.default.useEffect(() => {
+    import_react_native9.Animated.loop(
+      import_react_native9.Animated.timing(rotateAnim, {
+        toValue: 1,
+        duration: 1e3,
+        easing: import_react_native9.Easing.linear,
+        useNativeDriver: true
+      })
+    ).start();
+  }, [rotateAnim]);
+  const spin = rotateAnim.interpolate({
+    inputRange: [0, 1],
+    outputRange: ["0deg", "360deg"]
+  });
+  return /* @__PURE__ */ import_react18.default.createElement(
+    AnimatedSvg,
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      style: { transform: [{ rotate: spin }] }
+    },
+    /* @__PURE__ */ import_react18.default.createElement(
+      import_react_native_svg8.Path,
+      {
+        d: "M21 12a9 9 0 1 1-6.219-8.56",
+        stroke: color,
+        strokeWidth: 2,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  );
+};
+
+// src/assets/SuccessIcon.tsx
+var import_react19 = __toESM(require("react"));
+var import_react_native_svg9 = __toESM(require("react-native-svg"));
+var SuccessIcon = ({ size = 64 }) => {
+  return /* @__PURE__ */ import_react19.default.createElement(import_react_native_svg9.default, { width: size, height: size, viewBox: "0 0 64 64", fill: "none" }, /* @__PURE__ */ import_react19.default.createElement(
+    import_react_native_svg9.Circle,
+    {
+      cx: 32,
+      cy: 32,
+      r: 30,
+      fill: "#00C693",
+      opacity: 0.1
+    }
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    import_react_native_svg9.Circle,
+    {
+      cx: 32,
+      cy: 32,
+      r: 24,
+      fill: "#00C693"
+    }
+  ), /* @__PURE__ */ import_react19.default.createElement(
+    import_react_native_svg9.Path,
+    {
+      d: "M24 32l6 6 12-12",
+      stroke: "white",
+      strokeWidth: 3,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/assets/ErrorIcon.tsx
+var import_react20 = __toESM(require("react"));
+var import_react_native_svg10 = __toESM(require("react-native-svg"));
+var ErrorIcon = ({ size = 64 }) => {
+  return /* @__PURE__ */ import_react20.default.createElement(import_react_native_svg10.default, { width: size, height: size, viewBox: "0 0 64 64", fill: "none" }, /* @__PURE__ */ import_react20.default.createElement(
+    import_react_native_svg10.Circle,
+    {
+      cx: 32,
+      cy: 32,
+      r: 30,
+      fill: "#EF4444",
+      opacity: 0.1
+    }
+  ), /* @__PURE__ */ import_react20.default.createElement(
+    import_react_native_svg10.Circle,
+    {
+      cx: 32,
+      cy: 32,
+      r: 24,
+      fill: "#EF4444"
+    }
+  ), /* @__PURE__ */ import_react20.default.createElement(
+    import_react_native_svg10.Path,
+    {
+      d: "M24 24l16 16M40 24l-16 16",
+      stroke: "white",
+      strokeWidth: 3,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ));
+};
+
+// src/assets/SearchIcon.tsx
+var import_react21 = __toESM(require("react"));
+var import_react_native_svg11 = __toESM(require("react-native-svg"));
+
+// src/assets/PlusIcon.tsx
+var import_react22 = __toESM(require("react"));
+var import_react_native_svg12 = __toESM(require("react-native-svg"));
+var PlusIcon = ({
+  size = 14,
+  color = "#6B7280"
+}) => {
+  return /* @__PURE__ */ import_react22.default.createElement(import_react_native_svg12.default, { width: size, height: size, viewBox: "0 0 14 14", fill: "none" }, /* @__PURE__ */ import_react22.default.createElement(
+    import_react_native_svg12.Path,
+    {
+      d: "M7 3.5v7M3.5 7h7",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round"
+    }
+  ));
+};
+
+// src/wallet-connect/index.tsx
+var import_appkit_react_native3 = require("@reown/appkit-react-native");
+var import_react24 = __toESM(require("react"));
+var import_react_native10 = require("react-native");
+
+// src/utils/uuid.ts
+function generateUUID() {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
+    const r = Math.random() * 16 | 0;
+    const v = c === "x" ? r : r & 3 | 8;
+    return v.toString(16);
+  });
+}
+
+// src/wallet-connect/wallet-connect.tsx
+var import_react23 = __toESM(require("react"));
+var import_appkit_react_native2 = require("@reown/appkit-react-native");
+
+// src/wallet-connect/AppKitConfig.ts
+var import_react_native_compat = require("@walletconnect/react-native-compat");
+var import_async_storage = __toESM(require("@react-native-async-storage/async-storage"));
+var import_appkit_react_native = require("@reown/appkit-react-native");
+
+// node_modules/@walletconnect/safe-json/dist/esm/index.js
+var JSONStringify = (data) => JSON.stringify(data, (_, value) => typeof value === "bigint" ? value.toString() + "n" : value);
+var JSONParse = (json) => {
+  const numbersBiggerThanMaxInt = /([\[:])?(\d{17,}|(?:[9](?:[1-9]07199254740991|0[1-9]7199254740991|00[8-9]199254740991|007[2-9]99254740991|007199[3-9]54740991|0071992[6-9]4740991|00719925[5-9]740991|007199254[8-9]40991|0071992547[5-9]0991|00719925474[1-9]991|00719925474099[2-9])))([,\}\]])/g;
+  const serializedData = json.replace(numbersBiggerThanMaxInt, '$1"$2n"$3');
+  return JSON.parse(serializedData, (_, value) => {
+    const isCustomFormatBigInt = typeof value === "string" && value.match(/^\d+n$/);
+    if (isCustomFormatBigInt)
+      return BigInt(value.substring(0, value.length - 1));
+    return value;
+  });
+};
+function safeJsonParse(value) {
+  if (typeof value !== "string") {
+    throw new Error(`Cannot safe json parse value of type ${typeof value}`);
+  }
+  try {
+    return JSONParse(value);
+  } catch (_a) {
+    return value;
+  }
+}
+function safeJsonStringify(value) {
+  return typeof value === "string" ? value : JSONStringify(value) || "";
+}
+
+// src/wallet-connect/AppKitConfig.ts
+var import_appkit_ethers_react_native = require("@reown/appkit-ethers-react-native");
+var import_chains = require("viem/chains");
+var ethersAdapter = new import_appkit_ethers_react_native.EthersAdapter();
+var storage = {
+  getKeys: async () => {
+    return await import_async_storage.default.getAllKeys();
+  },
+  getEntries: async () => {
+    const keys = await import_async_storage.default.getAllKeys();
+    return Promise.all(
+      keys.map(async (key) => {
+        const value = await import_async_storage.default.getItem(key);
+        return [key, safeJsonParse(value || "")];
+      })
+    );
+  },
+  setItem: async (key, value) => {
+    await import_async_storage.default.setItem(key, safeJsonStringify(value));
+  },
+  getItem: async (key) => {
+    const raw = await import_async_storage.default.getItem(key);
+    if (!raw) return void 0;
+    return safeJsonParse(raw);
+  },
+  removeItem: async (key) => {
+    await import_async_storage.default.removeItem(key);
+  }
+};
+var createAppKitInstance = (projectId) => {
+  if (!projectId) {
+    throw new Error("walletConnectProjectId is required to initialize AppKit");
+  }
+  return (0, import_appkit_react_native.createAppKit)({
+    projectId,
+    networks: [
+      import_chains.mainnet,
+      import_chains.arbitrum,
+      import_chains.avalanche,
+      import_chains.bsc,
+      import_chains.fantom,
+      import_chains.gnosis,
+      import_chains.optimism,
+      import_chains.polygon,
+      import_chains.base
+    ],
+    adapters: [ethersAdapter],
+    features: {
+      swaps: false,
+      socials: false,
+      onramp: false
+    },
+    metadata: {
+      name: "Kryptos Connect",
+      description: "Kryptos Connect",
+      url: "https://kryptos.com",
+      icons: ["https://kryptos.com/icon.png"]
+    },
+    storage
+  });
+};
+
+// src/wallet-connect/wallet-connect.tsx
+var WalletConnectWrapper = ({ children }) => {
+  const { walletConnectProjectId } = useKryptosConnect();
+  const appKit = import_react23.default.useMemo(() => {
+    if (!walletConnectProjectId) {
+      console.warn(
+        "walletConnectProjectId is missing in KryptosConnectProvider config"
+      );
+      return null;
+    }
+    return createAppKitInstance(walletConnectProjectId);
+  }, [walletConnectProjectId]);
+  if (!appKit) {
+    return /* @__PURE__ */ import_react23.default.createElement(import_react23.default.Fragment, null, children);
+  }
+  return /* @__PURE__ */ import_react23.default.createElement(import_appkit_react_native2.AppKitProvider, { instance: appKit }, /* @__PURE__ */ import_react23.default.createElement(import_appkit_react_native2.AppKit, null), children);
+};
+var wallet_connect_default = WalletConnectWrapper;
+
+// src/wallet-connect/index.tsx
+var WalletConnectComponent = ({
+  integration,
+  onClose,
+  onAddHandle,
+  handleClose,
+  modalOpen,
+  setAddIntegrationMode
+}) => {
+  const { walletConnectProjectId } = useKryptosConnect();
+  const theme = useTheme();
+  if (!walletConnectProjectId) {
+    return /* @__PURE__ */ import_react24.default.createElement(Modal, { isOpen: modalOpen, onClose: handleClose, size: "full" }, /* @__PURE__ */ import_react24.default.createElement(ModalHeader, { onClose: handleClose }, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.headerContent }, /* @__PURE__ */ import_react24.default.createElement(
+      import_react_native10.TouchableOpacity,
+      {
+        onPress: () => {
+          setAddIntegrationMode(null);
+        },
+        style: styles9.backButton
+      },
+      /* @__PURE__ */ import_react24.default.createElement(ArrowLeftIcon, { size: 20, color: theme.colors.text })
+    ), /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.headerTitle, { color: theme.colors.text }] }, "Integration"))), /* @__PURE__ */ import_react24.default.createElement(ModalBody, { scrollable: false, style: styles9.contentContainer }, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.emptyState }, /* @__PURE__ */ import_react24.default.createElement(
+      import_react_native10.Text,
+      {
+        style: [styles9.emptyStateTitle, { color: theme.colors.text }]
+      },
+      "WalletConnect is not configured"
+    ), /* @__PURE__ */ import_react24.default.createElement(
+      import_react_native10.Text,
+      {
+        style: [
+          styles9.infoText,
+          { color: theme.colors.textSecondary, textAlign: "center" }
+        ]
+      },
+      "Please add a walletConnectProjectId to KryptosConnectProvider to enable wallet connections."
+    ), /* @__PURE__ */ import_react24.default.createElement(
+      Button,
+      {
+        variant: "outline",
+        size: "sm",
+        onPress: () => setAddIntegrationMode(null),
+        style: styles9.emptyStateButton
+      },
+      "Go back"
+    ))));
+  }
+  return /* @__PURE__ */ import_react24.default.createElement(wallet_connect_default, null, /* @__PURE__ */ import_react24.default.createElement(
+    ConnectButton,
+    {
+      integration,
+      onAddHandle,
+      onClose,
+      handleClose,
+      modalOpen,
+      setAddIntegrationMode
+    }
+  ));
+};
+function ConnectButton({
+  integration,
+  onAddHandle,
+  handleClose,
+  modalOpen,
+  setAddIntegrationMode
+}) {
+  const theme = useTheme();
+  const { open, disconnect } = (0, import_appkit_react_native3.useAppKit)();
+  const { address, isConnected, chainId } = (0, import_appkit_react_native3.useAccount)();
+  const { linkToken, user, clientId } = useKryptosConnect();
+  const [selectedChains, setSelectedChains] = (0, import_react24.useState)(/* @__PURE__ */ new Set());
+  const [errorMessage, setErrorMessage] = (0, import_react24.useState)("");
+  const [chainErrors, setChainErrors] = (0, import_react24.useState)({});
+  const [isLoading, setIsLoading] = (0, import_react24.useState)(false);
+  const userUsedChains = integration?.walletSupportedChains || [];
+  const validateForm = () => {
+    if (!address) {
+      setErrorMessage("Please connect a wallet");
+      return false;
+    }
+    if (selectedChains.size === 0) {
+      setErrorMessage("Select at least one chain");
+      return false;
+    }
+    return true;
+  };
+  const onSubmitWalletConnect = async () => {
+    if (!validateForm()) return;
+    try {
+      setIsLoading(true);
+      setErrorMessage("");
+      setChainErrors({});
+      const chainsToProcess = userUsedChains.filter(
+        (c) => selectedChains.has(c.id)
+      );
+      const integrationsToAdd = [];
+      const errors = {};
+      const walletTestsPayload = chainsToProcess.map((chain) => {
+        const walletId = generateUUID();
+        const displaySuffix = address ? address?.length > 8 ? `${address.slice(0, 4)}...${address.slice(-4)}` : address : "";
+        const alias = `${integration.id} - ${chain.id} (${displaySuffix})`;
+        return {
+          chain,
+          walletId,
+          alias,
+          credential: {
+            source: integration.id,
+            credential: {
+              address,
+              userId: user?.user?.uid || "0",
+              projectId: integration.projectId,
+              apiKey: "0",
+              secret: "0",
+              privateKey: "0",
+              alias,
+              walletId,
+              exchange: integration.id
+            }
+          }
+        };
+      });
+      const results = await Promise.allSettled(
+        walletTestsPayload.map(
+          (data) => testCredentials(linkToken, data.credential)
+        )
+      );
+      results.forEach((result, index) => {
+        const { chain, walletId, alias } = walletTestsPayload[index];
+        if (result.status === "fulfilled") {
+          const data = {
+            alias,
+            exchange: integration.id.toLowerCase(),
+            id: integration.id,
+            public_name: integration.public_name,
+            sync_time: (/* @__PURE__ */ new Date()).getTime(),
+            fetchAll: true,
+            logo: integration.logo || null,
+            startTime: null,
+            endTime: null,
+            uid: user?.user?.uid || "",
+            walletId,
+            clientMetadata: {
+              clientId,
+              createdAt: (/* @__PURE__ */ new Date()).toISOString()
+            },
+            metadata: {
+              environment: "sandbox"
+            },
+            addedOn: (/* @__PURE__ */ new Date()).getTime(),
+            default_chain: chain.name,
+            default_chain_logo: chain.logo || null,
+            type: integration.type,
+            isNftSupported: integration.isEvmWallet || integration.nftSupport || false,
+            chainId: chain.chainId || chain.id,
+            address
+          };
+          integrationsToAdd.push(data);
+        } else {
+          errors[chain.id] = "Wallet verification failed";
+        }
+      });
+      if (integrationsToAdd.length > 0) {
+        onAddHandle(integrationsToAdd);
+        setChainErrors({});
+        setErrorMessage("");
+      } else {
+        setErrorMessage("No integrations could be added. Please try again.");
+      }
+    } catch (error) {
+      const err = error;
+      console.error(error);
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to add integration"
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const toggleChainSelection = (chainId2) => {
+    const newSelected = new Set(selectedChains);
+    if (newSelected.has(chainId2)) {
+      newSelected.delete(chainId2);
+    } else {
+      newSelected.add(chainId2);
+    }
+    setSelectedChains(newSelected);
+    if (chainErrors[chainId2]) {
+      const newErrors = { ...chainErrors };
+      delete newErrors[chainId2];
+      setChainErrors(newErrors);
+    }
+  };
+  return /* @__PURE__ */ import_react24.default.createElement(Modal, { isOpen: modalOpen, onClose: handleClose, size: "full" }, /* @__PURE__ */ import_react24.default.createElement(ModalHeader, { onClose: handleClose }, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.headerContent }, /* @__PURE__ */ import_react24.default.createElement(
+    import_react_native10.TouchableOpacity,
+    {
+      onPress: () => {
+        setAddIntegrationMode(null);
+      },
+      style: styles9.backButton
+    },
+    /* @__PURE__ */ import_react24.default.createElement(ArrowLeftIcon, { size: 20, color: theme.colors.text })
+  ), /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.headerTitle, { color: theme.colors.text }] }, "Integration"))), /* @__PURE__ */ import_react24.default.createElement(ModalBody, { scrollable: false, style: styles9.contentContainer }, !isConnected ? /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, null, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.infoText, { color: theme.colors.text }] }, "Connect your wallet to continue"), /* @__PURE__ */ import_react24.default.createElement(
+    Button,
+    {
+      variant: "primary",
+      size: "sm",
+      onPress: () => open({ view: "Connect" })
+    },
+    "Connect Wallet"
+  )) : /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, null, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.connectedTitle, { color: theme.colors.text }] }, "Wallet Connected"), /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.connectedText, { color: theme.colors.text }] }, "Address: ", address), /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.connectedText, { color: theme.colors.text }] }, "Chain: ", chainId), /* @__PURE__ */ import_react24.default.createElement(Button, { variant: "ghost", size: "sm", onPress: () => disconnect() }, "Disconnect Wallet"), userUsedChains.length > 0 && address && /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.chainSelection }, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.Text, { style: [styles9.chainTitle, { color: theme.colors.text }] }, "Select Chains to Add:"), /* @__PURE__ */ import_react24.default.createElement(import_react_native10.ScrollView, { contentContainerStyle: styles9.scrollViewContent }, /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.chainChips }, userUsedChains.map((chain) => {
+    const isSelected = selectedChains.has(chain.id);
+    const hasError = chainErrors[chain.id];
+    return /* @__PURE__ */ import_react24.default.createElement(
+      import_react_native10.TouchableOpacity,
+      {
+        onPress: () => toggleChainSelection(chain.id),
+        style: styles9.chainButton,
+        key: chain.id
+      },
+      /* @__PURE__ */ import_react24.default.createElement(
+        import_react_native10.View,
+        {
+          style: [
+            styles9.chainChip,
+            {
+              backgroundColor: hasError ? theme.colors.errorLight : isSelected ? theme.colors.primary + "20" : theme.colors.surface,
+              borderColor: hasError ? theme.colors.error : isSelected ? theme.colors.primary : theme.colors.border
+            }
+          ]
+        },
+        /* @__PURE__ */ import_react24.default.createElement(
+          import_react_native10.Text,
+          {
+            style: [
+              styles9.chainName,
+              {
+                color: hasError ? theme.colors.error : isSelected ? theme.colors.primary : theme.colors.text
+              }
+            ]
+          },
+          chain.id
+        ),
+        isSelected ? /* @__PURE__ */ import_react24.default.createElement(
+          CloseIcon,
+          {
+            size: 12,
+            color: hasError ? theme.colors.error : theme.colors.primary
+          }
+        ) : /* @__PURE__ */ import_react24.default.createElement(
+          PlusIcon,
+          {
+            size: 12,
+            color: theme.colors.textSecondary
+          }
+        )
+      )
+    );
+  }))), Object.keys(chainErrors).length > 0 && /* @__PURE__ */ import_react24.default.createElement(import_react_native10.View, { style: styles9.chainErrorsContainer }, /* @__PURE__ */ import_react24.default.createElement(
+    import_react_native10.Text,
+    {
+      style: [
+        styles9.chainErrorsTitle,
+        { color: theme.colors.error }
+      ]
+    },
+    "Errors:"
+  ), Object.entries(chainErrors).map(([chainId2, error]) => {
+    const chain = userUsedChains.find(
+      (c) => c.id === chainId2
+    );
+    return /* @__PURE__ */ import_react24.default.createElement(
+      import_react_native10.Text,
+      {
+        key: chainId2,
+        style: [
+          styles9.chainErrorItem,
+          { color: theme.colors.error }
+        ]
+      },
+      "\u2022 ",
+      chain?.name,
+      ": ",
+      error
+    );
+  }))), errorMessage ? /* @__PURE__ */ import_react24.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react24.default.createElement(AlertDescription, null, errorMessage)) : null)), userUsedChains.length > 0 && address && /* @__PURE__ */ import_react24.default.createElement(ModalFooter, null, /* @__PURE__ */ import_react24.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: onSubmitWalletConnect,
+      loading: isLoading,
+      disabled: isLoading || !!address && userUsedChains.length > 0 && selectedChains.size === 0,
+      style: styles9.button
+    },
+    selectedChains.size > 0 ? `Add ${selectedChains.size} Chain${selectedChains.size > 1 ? "s" : ""}` : "Add Integration"
+  )));
+}
+var styles9 = import_react_native10.StyleSheet.create({
+  connectedTitle: { fontSize: 18, fontWeight: "600", marginBottom: 4 },
+  connectedText: { fontSize: 14, marginBottom: 4 },
+  infoText: {
+    fontSize: 16,
+    fontWeight: "600",
+    marginBottom: 8,
+    textAlign: "center"
+  },
+  scrollViewContent: {
+    paddingBottom: 100,
+    flexGrow: 1
+  },
+  headerContent: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  backButton: {
+    padding: 4,
+    // theme.spacing.xs
+    marginRight: 8
+    // theme.spacing.sm
+  },
+  headerTitle: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600"
+  },
+  contentContainer: {
+    padding: 20,
+    // theme.spacing.xl
+    paddingBottom: 40,
+    width: "100%",
+    overflow: "hidden",
+    alignSelf: "center",
+    flexDirection: "column",
+    flex: 1
+  },
+  chainSelection: {
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  chainTitle: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "500",
+    marginBottom: 12
+    // theme.spacing.md - consistent label spacing
+  },
+  chainChips: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: 6
+    // theme.spacing.sm
+  },
+  chainChip: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingHorizontal: 8,
+    // theme.spacing.sm
+    paddingVertical: 5,
+    // theme.spacing.xs
+    borderRadius: 12,
+    // theme.borderRadius.md
+    borderWidth: 1
+  },
+  chainName: {
+    fontSize: 12,
+    fontWeight: "500",
+    marginRight: 6
+    // theme.spacing.xs
+  },
+  chainButton: {
+    padding: 2
+    // theme.spacing.xs
+  },
+  chainErrorsContainer: {
+    marginTop: 12
+    // theme.spacing.md - consistent spacing
+  },
+  chainErrorsTitle: {
+    fontSize: 13,
+    fontWeight: "500",
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  chainErrorItem: {
+    fontSize: 12,
+    // theme.fontSize.sm
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  button: {
+    width: "100%",
+    marginTop: 16
+    // theme.spacing.lg - consistent button spacing
+  },
+  emptyState: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 12
+  },
+  emptyStateTitle: {
+    fontSize: 18,
+    fontWeight: "600"
+  },
+  emptyStateButton: {
+    marginTop: 8
+  }
+});
+
+// src/molecules/IntegrationForm.tsx
+var import_react25 = __toESM(require("react"));
+var import_react_native11 = require("react-native");
+var IntegrationForm = ({
+  metadata,
+  onAddHandle,
+  open,
+  setAddIntegrationMode,
+  handleClose
+}) => {
+  const { clientId, linkToken, user } = useKryptosConnect();
+  const theme = useTheme();
+  const [isLoading, setIsLoading] = import_react25.default.useState(false);
+  const [userUsedChains, setUserUsedChains] = import_react25.default.useState([]);
+  const [selectedChains, setSelectedChains] = import_react25.default.useState(
+    /* @__PURE__ */ new Set()
+  );
+  const [chainErrors, setChainErrors] = import_react25.default.useState(
+    {}
+  );
+  const [errorMessage, setErrorMessage] = import_react25.default.useState("");
+  const [formValues, setFormValues] = import_react25.default.useState({
+    address: "",
+    account_name: "",
+    api_key: "",
+    secret_key: "",
+    password: ""
+  });
+  const [formErrors, setFormErrors] = import_react25.default.useState({});
+  import_react25.default.useEffect(() => {
+    const fetchUserUsedChains = async () => {
+      if (linkToken && formValues.address && formValues.address.trim()) {
+        try {
+          const res = await getUserUsedChains(
+            linkToken,
+            formValues.address.trim()
+          );
+          if (res && Array.isArray(res)) {
+            setUserUsedChains(res);
+            setSelectedChains(new Set(res.map((chain) => chain.id)));
+          }
+        } catch (error) {
+          console.error("Failed to fetch user chains:", error);
+          setUserUsedChains([]);
+          setSelectedChains(/* @__PURE__ */ new Set());
+        }
+      } else {
+        setUserUsedChains([]);
+        setSelectedChains(/* @__PURE__ */ new Set());
+      }
+    };
+    fetchUserUsedChains();
+  }, [linkToken, formValues.address]);
+  const toggleChainSelection = (chainId) => {
+    const newSelected = new Set(selectedChains);
+    if (newSelected.has(chainId)) {
+      newSelected.delete(chainId);
+    } else {
+      newSelected.add(chainId);
+    }
+    setSelectedChains(newSelected);
+    if (chainErrors[chainId]) {
+      const newErrors = { ...chainErrors };
+      delete newErrors[chainId];
+      setChainErrors(newErrors);
+    }
+  };
+  const validateForm = () => {
+    const errors = {};
+    if (metadata.address && !formValues.address.trim()) {
+      errors.address = "Address is required";
+    }
+    if (metadata.account_name && !formValues.account_name.trim()) {
+      errors.account_name = "Account name is required";
+    }
+    if (metadata.api_key && !formValues.api_key.trim()) {
+      errors.api_key = "API key is required";
+    }
+    if (metadata.secret_key && !formValues.secret_key.trim()) {
+      errors.secret_key = "Secret key is required";
+    }
+    if (metadata.password && !formValues.password.trim()) {
+      errors.password = "Password is required";
+    }
+    setFormErrors(errors);
+    return Object.keys(errors).length === 0;
+  };
+  const handleSubmit = async () => {
+    if (!validateForm()) return;
+    try {
+      setIsLoading(true);
+      setChainErrors({});
+      setErrorMessage("");
+      const primaryField = formValues.address || formValues.account_name || formValues.api_key || "";
+      const chainsToProcess = userUsedChains.length > 0 && formValues.address && selectedChains.size > 0 ? userUsedChains.filter((chain) => selectedChains.has(chain.id)) : [];
+      const integrationsToAdd = [];
+      const errors = {};
+      if (chainsToProcess.length > 0) {
+        const credentialTestsData = chainsToProcess.map((chain) => {
+          const walletId = generateUUID();
+          const displaySuffix = primaryField.length >= 8 ? `${primaryField.slice(0, 4)}...${primaryField.slice(-4)}` : primaryField;
+          const alias = `${metadata.id} - ${chain.name} (${displaySuffix})`;
+          const credential = {
+            source: metadata.id,
+            credential: {
+              apiKey: formValues.api_key?.trim() || "0",
+              secret: formValues.secret_key?.trim() || "0",
+              accountName: formValues.account_name?.trim() || "0",
+              address: formValues.address?.trim() || "0",
+              password: formValues.password?.trim() || "0",
+              userId: user?.user?.uid || "0",
+              projectId: metadata?.projectId || "0",
+              privateKey: "0",
+              alias,
+              walletId,
+              exchange: metadata.id
+            }
+          };
+          return { chain, walletId, alias, credential };
+        });
+        const results = await Promise.allSettled(
+          credentialTestsData.map(
+            (testData) => testCredentials(linkToken, { ...testData.credential })
+          )
+        );
+        results.forEach((result, index) => {
+          const { chain, walletId, alias } = credentialTestsData[index];
+          if (result.status === "fulfilled" && result.value?.value?.status) {
+            const data = {
+              alias,
+              exchange: metadata.id.toLowerCase(),
+              id: metadata.id,
+              public_name: metadata.public_name,
+              sync_time: (/* @__PURE__ */ new Date()).getTime(),
+              fetchAll: true,
+              logo: metadata.logo || null,
+              startTime: null,
+              endTime: null,
+              uid: user?.user?.uid || "",
+              walletId,
+              clientMetadata: {
+                clientId,
+                createdAt: (/* @__PURE__ */ new Date()).toISOString()
+              },
+              metadata: {
+                environment: "sandbox"
+              },
+              addedOn: (/* @__PURE__ */ new Date()).getTime(),
+              default_chain: chain.name,
+              default_chain_logo: chain.logo || null,
+              type: metadata.type,
+              isNftSupported: metadata.isEvmWallet || metadata.nftSupport || false,
+              chainId: chain.chainId || chain.id,
+              address: formValues.address
+            };
+            if (formValues.account_name)
+              data.accountName = formValues.account_name;
+            if (formValues.api_key) data.apiKey = formValues.api_key;
+            if (formValues.secret_key) data.secret = formValues.secret_key;
+            if (formValues.password) data.password = formValues.password;
+            integrationsToAdd.push(data);
+          } else {
+            if (result.status === "rejected") {
+              const reason = result.reason;
+              errors[chain.id] = reason?.response?.data?.message || "Failed to process chain";
+            } else if (result.status === "fulfilled") {
+              errors[chain.id] = result.value?.value?.message || "Failed to verify chain";
+            }
+          }
+        });
+        setChainErrors(errors);
+        if (Object.keys(errors).length > 0) {
+          setErrorMessage(
+            `Cannot add integrations. ${Object.keys(errors).length} chain${Object.keys(errors).length > 1 ? "s" : ""} failed verification.`
+          );
+          return;
+        }
+      } else {
+        const displaySuffix = primaryField.length >= 8 ? `${primaryField.slice(0, 4)}...${primaryField.slice(-4)}` : primaryField;
+        const alias = `${metadata.id} (${displaySuffix})`;
+        const walletId = generateUUID();
+        const credential = {
+          source: metadata.id,
+          credential: {
+            apiKey: formValues.api_key?.trim() || "0",
+            secret: formValues.secret_key?.trim() || "0",
+            accountName: formValues.account_name?.trim() || "0",
+            address: formValues.address?.trim() || "0",
+            password: formValues.password?.trim() || "0",
+            userId: user?.user?.uid || "0",
+            projectId: metadata?.projectId || "0",
+            privateKey: "0",
+            alias,
+            walletId,
+            exchange: metadata.id
+          }
+        };
+        const testResult = await testCredentials(linkToken, { ...credential });
+        if (!testResult?.value?.status) {
+          setErrorMessage(
+            testResult?.value?.message || "Credentials are invalid"
+          );
+          return;
+        }
+        const data = {
+          alias,
+          exchange: metadata.id.toLowerCase(),
+          id: metadata.id,
+          public_name: metadata.public_name,
+          sync_time: (/* @__PURE__ */ new Date()).getTime(),
+          fetchAll: true,
+          logo: metadata.logo || null,
+          startTime: null,
+          endTime: null,
+          uid: user?.user?.uid || "",
+          walletId,
+          clientMetadata: {
+            clientId,
+            createdAt: (/* @__PURE__ */ new Date()).toISOString()
+          },
+          metadata: {
+            environment: "sandbox"
+          },
+          addedOn: (/* @__PURE__ */ new Date()).getTime(),
+          default_chain: metadata.id,
+          default_chain_logo: null,
+          type: metadata.type,
+          isNftSupported: metadata.isEvmWallet || metadata.nftSupport || false
+        };
+        if (metadata.community_id) {
+          data.chainId = Number(metadata.community_id);
+        }
+        if (formValues.address) data.address = formValues.address;
+        if (formValues.account_name) data.accountName = formValues.account_name;
+        if (formValues.api_key) data.apiKey = formValues.api_key;
+        if (formValues.secret_key) data.secret = formValues.secret_key;
+        if (formValues.password) data.password = formValues.password;
+        integrationsToAdd.push(data);
+      }
+      if (integrationsToAdd.length > 0) {
+        onAddHandle(integrationsToAdd);
+        setFormErrors({});
+        setFormValues({
+          address: "",
+          account_name: "",
+          api_key: "",
+          secret_key: "",
+          password: ""
+        });
+        setErrorMessage("");
+      } else {
+        setErrorMessage("No integrations could be added. Please try again.");
+      }
+    } catch (error) {
+      const err = error;
+      console.error(error);
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to add integration"
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const hasNoFields = !metadata.password && !metadata.secret_key && !metadata.api_key && !metadata.address && !metadata.account_name;
+  const shouldShowFormFields = metadata.password || metadata.secret_key || metadata.api_key || metadata.address || metadata.account_name;
+  const renderLogo = () => metadata.logo ? /* @__PURE__ */ import_react25.default.createElement(
+    import_react_native11.Image,
+    {
+      source: { uri: metadata.logo },
+      style: styles10.logo,
+      resizeMode: "contain"
+    }
+  ) : /* @__PURE__ */ import_react25.default.createElement(
+    import_react_native11.View,
+    {
+      style: [
+        styles10.logoPlaceholder,
+        { backgroundColor: theme.colors.surface }
+      ]
+    },
+    /* @__PURE__ */ import_react25.default.createElement(import_react_native11.Text, { style: { color: theme.colors.text } }, metadata.name?.charAt(0) || "?")
+  );
+  const renderInput = (key, props) => /* @__PURE__ */ import_react25.default.createElement(
+    Input,
+    {
+      placeholder: props.placeholder,
+      value: formValues[key],
+      onChangeText: (text) => setFormValues((prev) => ({ ...prev, [key]: text })),
+      error: formErrors[key],
+      autoCapitalize: props.autoCapitalize,
+      autoCorrect: props.autoCorrect,
+      secureTextEntry: props.secureTextEntry
+    }
+  );
+  const renderErrorAlert = () => errorMessage ? /* @__PURE__ */ import_react25.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react25.default.createElement(AlertDescription, null, errorMessage)) : null;
+  const renderChainSelection = () => userUsedChains.length > 0 && formValues.address && /* @__PURE__ */ import_react25.default.createElement(import_react_native11.View, { style: styles10.chainSelection }, /* @__PURE__ */ import_react25.default.createElement(import_react_native11.Text, { style: [styles10.chainTitle, { color: theme.colors.text }] }, "Select Chains to Add:"), /* @__PURE__ */ import_react25.default.createElement(import_react_native11.ScrollView, { contentContainerStyle: styles10.scrollViewContent }, /* @__PURE__ */ import_react25.default.createElement(import_react_native11.View, { style: styles10.chainChips }, userUsedChains.map((chain) => {
+    const isSelected = selectedChains.has(chain.id);
+    const hasError = chainErrors[chain.id];
+    return /* @__PURE__ */ import_react25.default.createElement(
+      import_react_native11.TouchableOpacity,
+      {
+        onPress: () => toggleChainSelection(chain.id),
+        style: styles10.chainButton,
+        key: chain.id
+      },
+      /* @__PURE__ */ import_react25.default.createElement(
+        import_react_native11.View,
+        {
+          style: [
+            styles10.chainChip,
+            {
+              backgroundColor: hasError ? theme.colors.errorLight : isSelected ? theme.colors.primary + "20" : theme.colors.surface,
+              borderColor: hasError ? theme.colors.error : isSelected ? theme.colors.primary : theme.colors.border
+            }
+          ]
+        },
+        /* @__PURE__ */ import_react25.default.createElement(
+          import_react_native11.Text,
+          {
+            style: [
+              styles10.chainName,
+              {
+                color: hasError ? theme.colors.error : isSelected ? theme.colors.primary : theme.colors.text
+              }
+            ]
+          },
+          chain.name
+        ),
+        isSelected ? /* @__PURE__ */ import_react25.default.createElement(
+          CloseIcon,
+          {
+            size: 12,
+            color: hasError ? theme.colors.error : theme.colors.primary
+          }
+        ) : /* @__PURE__ */ import_react25.default.createElement(PlusIcon, { size: 12, color: theme.colors.textSecondary })
+      )
+    );
+  }))), Object.keys(chainErrors).length > 0 && /* @__PURE__ */ import_react25.default.createElement(import_react_native11.View, { style: styles10.chainErrorsContainer }, /* @__PURE__ */ import_react25.default.createElement(
+    import_react_native11.Text,
+    {
+      style: [styles10.chainErrorsTitle, { color: theme.colors.error }]
+    },
+    "Errors:"
+  ), Object.entries(chainErrors).map(([chainId, error]) => {
+    const chain = userUsedChains.find((c) => c.id === chainId);
+    return /* @__PURE__ */ import_react25.default.createElement(
+      import_react_native11.Text,
+      {
+        key: chainId,
+        style: [styles10.chainErrorItem, { color: theme.colors.error }]
+      },
+      "\u2022 ",
+      chain?.name,
+      ": ",
+      error
+    );
+  })));
+  const renderFormBlock = () => /* @__PURE__ */ import_react25.default.createElement(import_react25.default.Fragment, null, /* @__PURE__ */ import_react25.default.createElement(import_react_native11.View, { style: styles10.header }, renderLogo(), /* @__PURE__ */ import_react25.default.createElement(import_react_native11.Text, { style: [styles10.name, { color: theme.colors.text }] }, metadata.name)), renderErrorAlert(), shouldShowFormFields && /* @__PURE__ */ import_react25.default.createElement(import_react25.default.Fragment, null, metadata.address && /* @__PURE__ */ import_react25.default.createElement(import_react25.default.Fragment, null, renderInput("address", {
+    placeholder: "Enter address",
+    autoCapitalize: "none",
+    autoCorrect: false
+  }), renderChainSelection()), metadata.account_name && renderInput("account_name", { placeholder: "Enter account name" }), metadata.api_key && renderInput("api_key", {
+    placeholder: "Enter API key",
+    autoCapitalize: "none",
+    autoCorrect: false
+  }), metadata.secret_key && renderInput("secret_key", {
+    placeholder: "Enter API secret",
+    autoCapitalize: "none",
+    autoCorrect: false,
+    secureTextEntry: true
+  }), metadata.password && renderInput("password", {
+    placeholder: "Enter Password",
+    secureTextEntry: true
+  })), hasNoFields && !metadata?.isWalletConnectSupported && /* @__PURE__ */ import_react25.default.createElement(Alert, { variant: "default", style: { marginTop: 12 } }, /* @__PURE__ */ import_react25.default.createElement(AlertDescription, null, "This integration is not supported here yet \u2014 try using it through our Kryptos Platform.")));
+  const addIntegrationLabel = formValues.address && userUsedChains.length > 0 && selectedChains.size > 0 ? `Add ${selectedChains.size} Chain${selectedChains.size !== 1 ? "s" : ""}` : "Add Integration";
+  return /* @__PURE__ */ import_react25.default.createElement(import_react25.default.Fragment, null, !metadata?.isWalletConnectSupported ? /* @__PURE__ */ import_react25.default.createElement(Modal, { isOpen: open, onClose: handleClose, size: "full" }, /* @__PURE__ */ import_react25.default.createElement(ModalHeader, { onClose: handleClose }, /* @__PURE__ */ import_react25.default.createElement(import_react_native11.View, { style: styles10.headerContent }, /* @__PURE__ */ import_react25.default.createElement(
+    import_react_native11.TouchableOpacity,
+    {
+      onPress: () => setAddIntegrationMode(null),
+      style: styles10.backButton
+    },
+    /* @__PURE__ */ import_react25.default.createElement(ArrowLeftIcon, { size: 20, color: theme.colors.text })
+  ), /* @__PURE__ */ import_react25.default.createElement(import_react_native11.Text, { style: [styles10.headerTitle, { color: theme.colors.text }] }, "Integration"))), /* @__PURE__ */ import_react25.default.createElement(ModalBody, { scrollable: false, style: styles10.contentContainer }, renderFormBlock()), !hasNoFields && /* @__PURE__ */ import_react25.default.createElement(ModalFooter, null, /* @__PURE__ */ import_react25.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: handleSubmit,
+      loading: isLoading,
+      disabled: isLoading || !!formValues.address && userUsedChains.length > 0 && selectedChains.size === 0,
+      style: styles10.button
+    },
+    addIntegrationLabel
+  ))) : /* @__PURE__ */ import_react25.default.createElement(
+    WalletConnectComponent,
+    {
+      integration: metadata,
+      onClose: handleClose,
+      onAddHandle,
+      modalOpen: open,
+      setAddIntegrationMode,
+      handleClose
+    }
+  ));
+};
+var styles10 = import_react_native11.StyleSheet.create({
+  scrollViewContent: {
+    flexGrow: 1,
+    paddingBottom: 100
+  },
+  headerContent: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  backButton: {
+    padding: 4,
+    // theme.spacing.xs
+    marginRight: 8
+    // theme.spacing.sm
+  },
+  headerTitle: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600"
+  },
+  container: {
+    flex: 1
+  },
+  contentContainer: {
+    padding: 20,
+    // theme.spacing.xl
+    paddingBottom: 40,
+    width: "100%",
+    overflow: "hidden",
+    alignSelf: "center",
+    flexDirection: "column",
+    flex: 1
+  },
+  header: {
+    flexDirection: "row",
+    justifyContent: "center",
+    alignItems: "center",
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  logo: {
+    width: 32,
+    height: 32,
+    borderRadius: 8
+    // theme.borderRadius.sm
+  },
+  logoPlaceholder: {
+    width: 32,
+    height: 32,
+    borderRadius: 8,
+    // theme.borderRadius.sm
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  name: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600",
+    marginLeft: 12,
+    // theme.spacing.md
+    textTransform: "capitalize"
+  },
+  chainSelection: {
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  chainTitle: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "500",
+    marginBottom: 12
+    // theme.spacing.md - consistent label spacing
+  },
+  chainChips: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    gap: 6
+    // theme.spacing.sm
+  },
+  chainChip: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingHorizontal: 8,
+    // theme.spacing.sm
+    paddingVertical: 5,
+    // theme.spacing.xs
+    borderRadius: 12,
+    // theme.borderRadius.md
+    borderWidth: 1
+  },
+  chainName: {
+    fontSize: 12,
+    fontWeight: "500",
+    marginRight: 6
+    // theme.spacing.xs
+  },
+  chainButton: {
+    padding: 2
+    // theme.spacing.xs
+  },
+  chainErrorsContainer: {
+    marginTop: 12
+    // theme.spacing.md - consistent spacing
+  },
+  chainErrorsTitle: {
+    fontSize: 13,
+    fontWeight: "500",
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  chainErrorItem: {
+    fontSize: 12,
+    // theme.fontSize.sm
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  button: {
+    width: "100%",
+    marginTop: 16
+    // theme.spacing.lg - consistent button spacing
+  }
+});
+
+// src/components/SkeletonItem.tsx
+var import_react26 = __toESM(require("react"));
+var import_react_native12 = require("react-native");
+var SkeletonItem = () => {
+  const opacity = (0, import_react26.useRef)(new import_react_native12.Animated.Value(0.3)).current;
+  (0, import_react26.useEffect)(() => {
+    import_react_native12.Animated.loop(
+      import_react_native12.Animated.sequence([
+        import_react_native12.Animated.timing(opacity, {
+          toValue: 1,
+          duration: 600,
+          useNativeDriver: true
+        }),
+        import_react_native12.Animated.timing(opacity, {
+          toValue: 0.3,
+          duration: 600,
+          useNativeDriver: true
+        })
+      ])
+    ).start();
+  }, []);
+  return /* @__PURE__ */ import_react26.default.createElement(import_react_native12.Animated.View, { style: [styles11.row, { opacity }] }, /* @__PURE__ */ import_react26.default.createElement(import_react_native12.View, { style: styles11.iconCircle }), /* @__PURE__ */ import_react26.default.createElement(import_react_native12.View, { style: styles11.textBlock }, /* @__PURE__ */ import_react26.default.createElement(import_react_native12.View, { style: styles11.lineLong }), /* @__PURE__ */ import_react26.default.createElement(import_react_native12.View, { style: styles11.lineShort })));
+};
+var styles11 = import_react_native12.StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingVertical: 16
+  },
+  iconCircle: {
+    width: 45,
+    height: 45,
+    borderRadius: 22.5,
+    backgroundColor: "#E5E5E5"
+  },
+  textBlock: {
+    marginLeft: 12,
+    flex: 1
+  },
+  lineShort: {
+    width: "50%",
+    height: 14,
+    borderRadius: 6,
+    backgroundColor: "#E5E5E5"
+  },
+  lineLong: {
+    marginBottom: 6,
+    width: "100%",
+    height: 14,
+    borderRadius: 6,
+    backgroundColor: "#E5E5E5"
+  }
+});
+var SkeletonItem_default = SkeletonItem;
+
+// src/molecules/Integration.tsx
+var Integration = ({
+  open,
+  onSuccess,
+  onClose
+}) => {
+  const { appName, linkToken } = useKryptosConnect();
+  const theme = useTheme();
+  const [addIntegrationMode, setAddIntegrationMode] = import_react27.default.useState(null);
+  const [query, setQuery] = import_react27.default.useState("");
+  const [supportedProviders, setSupportedProviders] = import_react27.default.useState([]);
+  const [addedIntegrations, setAddedIntegrations] = import_react27.default.useState([]);
+  const [existingIntegrations, setExistingIntegrations] = import_react27.default.useState([]);
+  const [isLoading, setIsLoading] = import_react27.default.useState(false);
+  const [errorMessage, setErrorMessage] = import_react27.default.useState("");
+  const handleClose = () => {
+    onClose();
+  };
+  const fetchExistingIntegrations = async () => {
+    try {
+      const res = await getUserIntegrations(linkToken);
+      setExistingIntegrations(res?.integrations || []);
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to fetch existing integrations"
+      );
+      console.error(error);
+    }
+  };
+  const fetchSupportedProviders = async () => {
+    try {
+      setIsLoading(true);
+      const res = await getSupportedProviders(linkToken);
+      setSupportedProviders(res?.providers || []);
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to fetch supported providers"
+      );
+      console.error(error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  import_react27.default.useEffect(() => {
+    if (linkToken) {
+      fetchSupportedProviders();
+      fetchExistingIntegrations();
+    }
+  }, [linkToken]);
+  const isIntegrationAdded = import_react27.default.useCallback(
+    (publicName) => {
+      const integrations = [...addedIntegrations, ...existingIntegrations];
+      return integrations.some(
+        (integration) => integration.public_name === publicName
+      );
+    },
+    [addedIntegrations, existingIntegrations]
+  );
+  const getIntegrationCount = import_react27.default.useCallback(
+    (publicName) => {
+      const integrations = [...addedIntegrations, ...existingIntegrations];
+      return integrations.filter(
+        (integration) => integration.public_name === publicName
+      ).length;
+    },
+    [addedIntegrations, existingIntegrations]
+  );
+  const filteredResults = import_react27.default.useMemo(() => {
+    if (query) {
+      const lowerQuery = query.toLowerCase();
+      return supportedProviders.filter(
+        (provider) => provider.name?.toLowerCase().includes(lowerQuery) || provider.public_name?.toLowerCase().includes(lowerQuery) || provider.id?.toLowerCase().includes(lowerQuery)
+      );
+    }
+    return [...supportedProviders].sort((a, b) => {
+      const countA = getIntegrationCount(a.public_name);
+      const countB = getIntegrationCount(b.public_name);
+      if (countB !== countA) {
+        return countB - countA;
+      }
+      return a.name.localeCompare(b.name);
+    });
+  }, [query, supportedProviders, getIntegrationCount]);
+  const handleAddIntegration = async () => {
+    try {
+      setIsLoading(true);
+      const integrations = [...addedIntegrations, ...existingIntegrations];
+      if (integrations.length === 0) {
+        setErrorMessage("Please add at least one integration");
+      } else if (addedIntegrations.length === 0) {
+        onSuccess();
+      } else {
+        await addUserIntegration(linkToken, addedIntegrations);
+        onSuccess();
+      }
+    } catch (error) {
+      const err = error;
+      console.error(error);
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to add integrations"
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const renderProviderItem = ({ item }) => /* @__PURE__ */ import_react27.default.createElement(
+    import_react_native13.TouchableOpacity,
+    {
+      style: [
+        styles12.providerItem,
+        {
+          backgroundColor: theme.colors.surface,
+          borderColor: theme.colors.border
+        }
+      ],
+      onPress: () => setAddIntegrationMode(item),
+      activeOpacity: 0.7
+    },
+    /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.providerInfo }, item?.logo ? /* @__PURE__ */ import_react27.default.createElement(
+      import_react_native13.Image,
+      {
+        source: { uri: item?.logo },
+        style: styles12.providerLogo,
+        resizeMode: "contain"
+      }
+    ) : /* @__PURE__ */ import_react27.default.createElement(
+      import_react_native13.View,
+      {
+        style: [
+          styles12.providerLogoPlaceholder,
+          { backgroundColor: theme.colors.surfaceSecondary }
+        ]
+      },
+      /* @__PURE__ */ import_react27.default.createElement(import_react_native13.Text, { style: { color: theme.colors.text } }, item?.name?.charAt(0) || "?")
+    ), /* @__PURE__ */ import_react27.default.createElement(import_react_native13.Text, { style: [styles12.providerName, { color: theme.colors.text }] }, item?.name + "\u200B")),
+    isIntegrationAdded(item?.public_name) && /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.providerStatus }, /* @__PURE__ */ import_react27.default.createElement(CheckCircleIcon, { size: 18, color: theme.colors.success }), /* @__PURE__ */ import_react27.default.createElement(
+      import_react_native13.Text,
+      {
+        style: [
+          styles12.providerCount,
+          { color: theme.colors.textSecondary }
+        ]
+      },
+      getIntegrationCount(item?.public_name)
+    ))
+  );
+  const renderSkeletonItem = () => /* @__PURE__ */ import_react27.default.createElement(SkeletonItem_default, null);
+  return /* @__PURE__ */ import_react27.default.createElement(import_react27.default.Fragment, null, !addIntegrationMode ? /* @__PURE__ */ import_react27.default.createElement(Modal, { isOpen: open, onClose: handleClose, size: "full" }, /* @__PURE__ */ import_react27.default.createElement(ModalHeader, { onClose: handleClose }, /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.headerContent }, addIntegrationMode && /* @__PURE__ */ import_react27.default.createElement(
+    import_react_native13.TouchableOpacity,
+    {
+      onPress: () => setAddIntegrationMode(null),
+      style: styles12.backButton
+    },
+    /* @__PURE__ */ import_react27.default.createElement(ArrowLeftIcon, { size: 20, color: theme.colors.text })
+  ), /* @__PURE__ */ import_react27.default.createElement(import_react_native13.Text, { style: [styles12.headerTitle, { color: theme.colors.text }] }, "Integration"))), /* @__PURE__ */ import_react27.default.createElement(ModalBody, { scrollable: false, style: styles12.noPadding }, /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.container }, /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.headerSection }, /* @__PURE__ */ import_react27.default.createElement(ConnectLogo, null), /* @__PURE__ */ import_react27.default.createElement(import_react_native13.Text, { style: [styles12.title, { color: theme.colors.text }] }, "Connect ", appName, " to your Kryptos account")), /* @__PURE__ */ import_react27.default.createElement(
+    import_react_native13.FlatList,
+    {
+      data: isLoading ? Array.from({ length: 8 }, (_, i) => ({
+        id: `skeleton-${i}`,
+        name: "",
+        public_name: "",
+        type: ""
+      })) : filteredResults,
+      keyExtractor: (item, index) => isLoading ? item.id : `provider-${item.id}-${index}`,
+      renderItem: isLoading ? renderSkeletonItem : renderProviderItem,
+      style: styles12.list,
+      contentContainerStyle: [
+        styles12.listContent,
+        { paddingHorizontal: theme.spacing.xl }
+      ],
+      showsVerticalScrollIndicator: false,
+      ListHeaderComponent: /* @__PURE__ */ import_react27.default.createElement(
+        import_react_native13.View,
+        {
+          style: {
+            paddingVertical: theme.spacing.sm + 2,
+            backgroundColor: theme.colors.background,
+            zIndex: 10
+          }
+        },
+        /* @__PURE__ */ import_react27.default.createElement(
+          Input,
+          {
+            value: query,
+            onChangeText: setQuery,
+            placeholder: "Search Integrations...",
+            containerStyle: styles12.searchInput
+          }
+        )
+      ),
+      stickyHeaderIndices: [0],
+      ListEmptyComponent: /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.emptyContainer }, !isLoading && /* @__PURE__ */ import_react27.default.createElement(
+        import_react_native13.Text,
+        {
+          style: [
+            styles12.emptyText,
+            { color: theme.colors.textSecondary }
+          ]
+        },
+        query ? "No search results found" : "No supported integrations found"
+      ))
+    }
+  ), errorMessage && /* @__PURE__ */ import_react27.default.createElement(import_react_native13.View, { style: styles12.errorContainer }, /* @__PURE__ */ import_react27.default.createElement(Alert, { variant: "destructive", style: styles12.errorAlert }, /* @__PURE__ */ import_react27.default.createElement(AlertDescription, null, errorMessage))))), /* @__PURE__ */ import_react27.default.createElement(ModalFooter, null, /* @__PURE__ */ import_react27.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: handleAddIntegration,
+      loading: isLoading,
+      disabled: isLoading,
+      style: styles12.continueButton
+    },
+    "Continue"
+  ))) : /* @__PURE__ */ import_react27.default.createElement(
+    IntegrationForm,
+    {
+      metadata: addIntegrationMode,
+      onAddHandle: (integrations) => {
+        setAddedIntegrations((prev) => [...prev, ...integrations]);
+        setAddIntegrationMode(null);
+      },
+      open: !!addIntegrationMode,
+      setAddIntegrationMode,
+      handleClose
+    }
+  ));
+};
+var styles12 = import_react_native13.StyleSheet.create({
+  headerContent: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  backButton: {
+    padding: 4,
+    // theme.spacing.xs
+    marginRight: 8
+    // theme.spacing.sm
+  },
+  headerTitle: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600"
+  },
+  noPadding: {
+    padding: 0
+  },
+  container: {
+    flex: 1
+  },
+  headerSection: {
+    paddingHorizontal: 20,
+    // theme.spacing.xl
+    paddingTop: 10
+    // theme.spacing.xl
+  },
+  title: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600",
+    textAlign: "center",
+    marginBottom: 10
+    // theme.spacing.lg
+  },
+  searchInput: {},
+  list: {
+    flex: 1,
+    minHeight: 200
+  },
+  listContent: {
+    paddingBottom: 12
+    // theme.spacing.md - consistent padding
+  },
+  providerItem: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    padding: 12,
+    // theme.spacing.md
+    borderRadius: 12,
+    // theme.borderRadius.md
+    borderWidth: 1,
+    marginBottom: 12
+    // theme.spacing.md - consistent list item spacing
+  },
+  providerInfo: {
+    flexDirection: "row",
+    alignItems: "center",
+    flex: 1
+  },
+  providerLogo: {
+    width: 32,
+    height: 32,
+    borderRadius: 8
+    // theme.borderRadius.sm
+  },
+  providerLogoPlaceholder: {
+    width: 32,
+    height: 32,
+    borderRadius: 8,
+    // theme.borderRadius.sm
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  providerName: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "500",
+    marginLeft: 12,
+    // theme.spacing.md
+    textTransform: "capitalize"
+  },
+  providerStatus: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  providerCount: {
+    fontSize: 14,
+    // theme.fontSize.md
+    marginLeft: 4
+    // theme.spacing.xs
+  },
+  emptyContainer: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    paddingVertical: 40
+    // theme.spacing.xxxl + sm
+  },
+  emptyText: {
+    fontSize: 14
+    // theme.fontSize.md
+  },
+  continueButton: {
+    width: "100%"
+  },
+  errorContainer: {
+    paddingHorizontal: 20
+    // theme.spacing.xl
+  },
+  errorAlert: {
+    marginTop: 16
+    // theme.spacing.lg - consistent alert spacing
+  }
+});
+
+// src/molecules/OTPVerify.tsx
+var import_react28 = __toESM(require("react"));
+var import_react_native14 = require("react-native");
+var OTPVerify = ({
+  open,
+  onSuccess,
+  onClose
+}) => {
+  const theme = useTheme();
+  const [otp, setOtp] = import_react28.default.useState("");
+  const { linkToken, clientId, email, setUser } = useKryptosConnect();
+  const [isLoading, setIsLoading] = import_react28.default.useState(false);
+  const [isResending, setIsResending] = import_react28.default.useState(false);
+  const [resendCooldown, setResendCooldown] = import_react28.default.useState(0);
+  const [errorMessage, setErrorMessage] = import_react28.default.useState("");
+  const [successMessage, setSuccessMessage] = import_react28.default.useState("");
+  const handleSubmit = async () => {
+    if (otp.length !== 6) return;
+    setIsLoading(true);
+    setErrorMessage("");
+    try {
+      const res = await loginWithOtp(linkToken, email, otp, clientId);
+      setUser(res);
+      onSuccess();
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to login with OTP"
+      );
+      console.error(error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const handleOtpComplete = (value) => {
+    setOtp(value);
+  };
+  const handleResendOtp = async () => {
+    if (resendCooldown > 0 || isResending) return;
+    try {
+      setIsResending(true);
+      setErrorMessage("");
+      setSuccessMessage("");
+      await sendEmailOtp(linkToken, email, clientId);
+      setSuccessMessage("OTP sent successfully!");
+      setResendCooldown(60);
+      setOtp("");
+      setTimeout(() => {
+        setSuccessMessage("");
+      }, 3e3);
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to resend OTP. Please try again."
+      );
+      console.error(error);
+    } finally {
+      setIsResending(false);
+    }
+  };
+  const handleClose = () => {
+    onClose();
+    setErrorMessage("");
+    setSuccessMessage("");
+    setOtp("");
+  };
+  import_react28.default.useEffect(() => {
+    if (resendCooldown > 0) {
+      const timer = setTimeout(() => {
+        setResendCooldown(resendCooldown - 1);
+      }, 1e3);
+      return () => clearTimeout(timer);
+    }
+    return void 0;
+  }, [resendCooldown]);
+  return /* @__PURE__ */ import_react28.default.createElement(Modal, { isOpen: open, onClose: handleClose, size: "lg" }, /* @__PURE__ */ import_react28.default.createElement(ModalHeader, { onClose: handleClose }, /* @__PURE__ */ import_react28.default.createElement(import_react_native14.View, { style: styles13.headerContent }, /* @__PURE__ */ import_react28.default.createElement(import_react_native14.Text, { style: [styles13.headerTitle, { color: theme.colors.text }] }, "OTP Verification"))), /* @__PURE__ */ import_react28.default.createElement(ModalBody, null, /* @__PURE__ */ import_react28.default.createElement(import_react_native14.View, { style: styles13.container }, /* @__PURE__ */ import_react28.default.createElement(ConnectLogo, null), /* @__PURE__ */ import_react28.default.createElement(import_react_native14.View, { style: styles13.emailInfo }, /* @__PURE__ */ import_react28.default.createElement(
+    import_react_native14.Text,
+    {
+      style: [styles13.infoText, { color: theme.colors.textSecondary }]
+    },
+    "We have sent a verification code to"
+  ), /* @__PURE__ */ import_react28.default.createElement(import_react_native14.Text, { style: [styles13.emailText, { color: theme.colors.text }] }, email)), /* @__PURE__ */ import_react28.default.createElement(OTP, { onComplete: handleOtpComplete, length: 6, setErrorMessage }), errorMessage ? /* @__PURE__ */ import_react28.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react28.default.createElement(AlertDescription, null, errorMessage)) : null, successMessage ? /* @__PURE__ */ import_react28.default.createElement(Alert, { variant: "default" }, /* @__PURE__ */ import_react28.default.createElement(AlertDescription, null, successMessage)) : null, /* @__PURE__ */ import_react28.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: handleSubmit,
+      loading: isLoading,
+      disabled: otp.length !== 6 || isLoading,
+      style: styles13.button
+    },
+    "Continue"
+  ), /* @__PURE__ */ import_react28.default.createElement(
+    import_react_native14.TouchableOpacity,
+    {
+      onPress: handleResendOtp,
+      disabled: resendCooldown > 0 || isResending,
+      style: styles13.resendContainer
+    },
+    isResending ? /* @__PURE__ */ import_react28.default.createElement(import_react_native14.View, { style: styles13.resendLoading }, /* @__PURE__ */ import_react28.default.createElement(LoaderIcon, { size: 16, color: theme.colors.primary }), /* @__PURE__ */ import_react28.default.createElement(
+      import_react_native14.Text,
+      {
+        style: [styles13.resendText, { color: theme.colors.primary }]
+      },
+      " ",
+      "Sending..."
+    )) : resendCooldown > 0 ? /* @__PURE__ */ import_react28.default.createElement(
+      import_react_native14.Text,
+      {
+        style: [
+          styles13.resendText,
+          { color: theme.colors.textSecondary }
+        ]
+      },
+      "Resend OTP in ",
+      resendCooldown,
+      "s"
+    ) : /* @__PURE__ */ import_react28.default.createElement(
+      import_react_native14.Text,
+      {
+        style: [styles13.resendText, { color: theme.colors.primary }]
+      },
+      "Resend OTP"
+    )
+  ))));
+};
+var styles13 = import_react_native14.StyleSheet.create({
+  headerContent: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  backButton: {
+    padding: 4,
+    // theme.spacing.xs
+    marginRight: 8
+    // theme.spacing.sm
+  },
+  headerTitle: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600"
+  },
+  container: {
+    flex: 1,
+    alignItems: "center"
+  },
+  emailInfo: {
+    alignItems: "center",
+    marginBottom: 24
+    // theme.spacing.xxl
+  },
+  infoText: {
+    fontSize: 14,
+    // theme.fontSize.md
+    marginBottom: 4
+    // theme.spacing.xs
+  },
+  emailText: {
+    fontSize: 16,
+    // theme.fontSize.lg
+    fontWeight: "600"
+  },
+  button: {
+    width: "100%",
+    marginTop: 16
+    // theme.spacing.lg
+  },
+  resendContainer: {
+    marginTop: 16,
+    // theme.spacing.lg - consistent spacing
+    padding: 8
+    // theme.spacing.sm
+  },
+  resendLoading: {
+    flexDirection: "row",
+    alignItems: "center"
+  },
+  resendText: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "500"
+  }
+});
+
+// src/molecules/Permissions.tsx
+var import_react29 = __toESM(require("react"));
+var import_react_native15 = require("react-native");
+var Permissions = ({
+  open,
+  onClose,
+  onSuccess
+}) => {
+  const { appName, linkToken, setUserConsent } = useKryptosConnect();
+  const theme = useTheme();
+  const [isLoading, setIsLoading] = import_react29.default.useState(false);
+  const [errorMessage, setErrorMessage] = import_react29.default.useState("");
+  const handleConsentClick = async () => {
+    try {
+      setIsLoading(true);
+      setErrorMessage("");
+      const res = await giveUserConsent(linkToken);
+      setUserConsent(res);
+      onSuccess();
+    } catch (error) {
+      const err = error;
+      setErrorMessage(
+        err?.response?.data?.message || "Failed to give consent. Please try again."
+      );
+      console.error(error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const permissionItems = [
+    "View your crypto holdings, wallet balances, and portfolio data",
+    "Access your transaction history and trading activity",
+    "Keep this data updated and accessible when you're offline"
+  ];
+  return /* @__PURE__ */ import_react29.default.createElement(Modal, { isOpen: open, onClose, size: "xl" }, /* @__PURE__ */ import_react29.default.createElement(ModalHeader, { onClose }, "Permissions"), /* @__PURE__ */ import_react29.default.createElement(ModalBody, null, /* @__PURE__ */ import_react29.default.createElement(import_react_native15.View, { style: styles14.container }, /* @__PURE__ */ import_react29.default.createElement(ConnectLogo, null), errorMessage ? /* @__PURE__ */ import_react29.default.createElement(Alert, { variant: "destructive" }, /* @__PURE__ */ import_react29.default.createElement(AlertDescription, null, errorMessage)) : null, /* @__PURE__ */ import_react29.default.createElement(import_react_native15.View, { style: styles14.permissionsList }, /* @__PURE__ */ import_react29.default.createElement(
+    import_react_native15.Text,
+    {
+      style: [styles14.subtitle, { color: theme.colors.textSecondary }]
+    },
+    "Allow ",
+    appName,
+    " to:"
+  ), permissionItems.map((item, index) => /* @__PURE__ */ import_react29.default.createElement(import_react_native15.View, { key: `permission-${index}`, style: styles14.permissionItem }, /* @__PURE__ */ import_react29.default.createElement(import_react_native15.Text, { style: [styles14.bullet, { color: theme.colors.primary }] }, index + 1, "."), /* @__PURE__ */ import_react29.default.createElement(
+    import_react_native15.Text,
+    {
+      style: [styles14.permissionText, { color: theme.colors.text }]
+    },
+    item
+  )))), /* @__PURE__ */ import_react29.default.createElement(
+    import_react_native15.View,
+    {
+      style: [
+        styles14.infoBox,
+        {
+          backgroundColor: theme.colors.surface,
+          borderColor: theme.colors.border
+        }
+      ]
+    },
+    /* @__PURE__ */ import_react29.default.createElement(
+      import_react_native15.Text,
+      {
+        style: [styles14.infoText, { color: theme.colors.textSecondary }]
+      },
+      "By selecting",
+      " ",
+      /* @__PURE__ */ import_react29.default.createElement(import_react_native15.Text, { style: { fontWeight: "600", color: theme.colors.text } }, "'Allow'"),
+      ", you agree to share this information and keep it updated."
+    )
+  ))), /* @__PURE__ */ import_react29.default.createElement(ModalFooter, null, /* @__PURE__ */ import_react29.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: handleConsentClick,
+      loading: isLoading,
+      disabled: isLoading,
+      style: styles14.button
+    },
+    "Allow"
+  )));
+};
+var styles14 = import_react_native15.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  permissionsList: {
+    marginBottom: 24
+    // theme.spacing.xxl
+  },
+  subtitle: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "500",
+    marginBottom: 16
+    // theme.spacing.lg
+  },
+  permissionItem: {
+    flexDirection: "row",
+    marginBottom: 12,
+    // theme.spacing.md
+    paddingLeft: 4
+    // theme.spacing.xs
+  },
+  bullet: {
+    fontSize: 14,
+    // theme.fontSize.md
+    fontWeight: "600",
+    marginRight: 8,
+    // theme.spacing.sm
+    width: 20
+    // theme.spacing.xl
+  },
+  permissionText: {
+    fontSize: 14,
+    // theme.fontSize.md
+    flex: 1,
+    lineHeight: 20
+    // theme.spacing.xl
+  },
+  infoBox: {
+    padding: 16,
+    // theme.spacing.lg
+    borderRadius: 12,
+    // theme.borderRadius.md
+    borderWidth: 1,
+    marginBottom: 24
+    // theme.spacing.xxl
+  },
+  infoText: {
+    fontSize: 13,
+    lineHeight: 18,
+    textAlign: "center"
+  },
+  button: {
+    width: "100%"
+  }
+});
+
+// src/molecules/StatusModal.tsx
+var import_react30 = __toESM(require("react"));
+var import_react_native16 = require("react-native");
+var StatusModal = ({
+  open,
+  onClose,
+  status,
+  onSuccess,
+  onError
+}) => {
+  const theme = useTheme();
+  const handleClose = () => {
+    if (status === "success") {
+      onSuccess();
+    } else {
+      onError();
+    }
+    onClose();
+  };
+  return /* @__PURE__ */ import_react30.default.createElement(Modal, { isOpen: open, onClose: handleClose, size: "xs" }, /* @__PURE__ */ import_react30.default.createElement(ModalBody, null, /* @__PURE__ */ import_react30.default.createElement(import_react_native16.View, { style: styles15.container }, /* @__PURE__ */ import_react30.default.createElement(import_react_native16.View, { style: styles15.iconContainer }, status === "success" ? /* @__PURE__ */ import_react30.default.createElement(SuccessIcon, { size: 80 }) : /* @__PURE__ */ import_react30.default.createElement(ErrorIcon, { size: 80 })), /* @__PURE__ */ import_react30.default.createElement(import_react_native16.Text, { style: [styles15.message, { color: theme.colors.text }] }, status === "success" ? "Connection successful" : "Connection failed"), /* @__PURE__ */ import_react30.default.createElement(
+    Button,
+    {
+      variant: "outline",
+      size: "lg",
+      onPress: status === "success" ? onSuccess : onError,
+      style: styles15.button
+    },
+    status === "success" ? "Continue" : "Try again later"
+  ))));
+};
+var styles15 = import_react_native16.StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    paddingVertical: 24
+    // theme.spacing.xxl
+  },
+  iconContainer: {
+    marginBottom: 24
+    // theme.spacing.xxl
+  },
+  message: {
+    fontSize: 18,
+    // theme.fontSize.xl
+    fontWeight: "600",
+    marginBottom: 32,
+    // theme.spacing.xxxl
+    textAlign: "center"
+  },
+  button: {
+    width: "100%"
+  }
+});
+
+// src/KryptosConnectButton.tsx
+var KryptosConnectButton = ({
+  children,
+  onSuccess,
+  onError,
+  generateLinkToken,
+  style,
+  textStyle
+}) => {
+  const { theme: themeName } = useKryptosConnect();
+  const [open, setOpen] = import_react31.default.useState(false);
+  const theme = useTheme();
+  return /* @__PURE__ */ import_react31.default.createElement(import_react31.default.Fragment, null, children ? /* @__PURE__ */ import_react31.default.createElement(import_react_native17.TouchableOpacity, { onPress: () => setOpen(true), style }, children) : /* @__PURE__ */ import_react31.default.createElement(
+    import_react_native17.TouchableOpacity,
+    {
+      onPress: () => setOpen(true),
+      style: [
+        styles16.defaultButton,
+        themeName === "light" ? {
+          backgroundColor: theme.colors.white,
+          borderRadius: theme.borderRadius.md,
+          borderWidth: 1,
+          borderColor: theme.colors.primary
+        } : {
+          backgroundColor: theme.colors.black,
+          borderRadius: theme.borderRadius.md
+        },
+        style
+      ],
+      activeOpacity: 0.8
+    },
+    /* @__PURE__ */ import_react31.default.createElement(
+      import_react_native17.Text,
+      {
+        style: [
+          styles16.buttonText,
+          {
+            color: themeName === "light" ? theme.colors.primary : theme.colors.white,
+            fontSize: theme.fontSize.lg
+          },
+          textStyle
+        ]
+      },
+      "Connect with",
+      " "
+    ),
+    /* @__PURE__ */ import_react31.default.createElement(LogoIcon, { size: 24 })
+  ), /* @__PURE__ */ import_react31.default.createElement(
+    KryptosConnectModal,
+    {
+      open,
+      setOpen,
+      onSuccess,
+      onError,
+      generateLinkToken
+    }
+  ));
+};
+var KryptosConnectModal = ({
+  open,
+  setOpen,
+  onSuccess,
+  onError,
+  generateLinkToken
+}) => {
+  const {
+    setIsInitialized,
+    userConsent,
+    setUserConsent,
+    setUser,
+    setEmail,
+    setLinkToken
+  } = useKryptosConnect();
+  const [step, setStep] = import_react31.default.useState("INIT" /* INIT */);
+  const handleClose = () => {
+    setOpen(false);
+    setIsInitialized(false);
+    setStep("INIT" /* INIT */);
+    setUserConsent(null);
+    setUser(null);
+    setEmail("");
+    setLinkToken("");
+  };
+  const handleSuccess = () => {
+    onSuccess?.(userConsent);
+    handleClose();
+  };
+  const handleError = () => {
+    onError?.(userConsent);
+    handleClose();
+  };
+  const handleAbort = () => {
+    onError?.(new Error("User closed the modal"));
+    handleClose();
+  };
+  if (!open) return null;
+  return /* @__PURE__ */ import_react31.default.createElement(import_react_native17.View, { style: styles16.container }, step === "INIT" /* INIT */ && /* @__PURE__ */ import_react31.default.createElement(
+    Init,
+    {
+      open,
+      generateLinkToken,
+      onSuccess: () => {
+        setStep("AUTH" /* AUTH */);
+      },
+      onClose: handleAbort
+    }
+  ), step === "AUTH" /* AUTH */ && /* @__PURE__ */ import_react31.default.createElement(
+    Auth,
+    {
+      open,
+      onEmailSuccess: () => setStep("OTP" /* OTP */),
+      onGuestSuccess: () => setStep("INTEGRATION" /* INTEGRATION */),
+      onClose: handleAbort
+    }
+  ), step === "OTP" /* OTP */ && /* @__PURE__ */ import_react31.default.createElement(
+    OTPVerify,
+    {
+      open,
+      onSuccess: () => setStep("INTEGRATION" /* INTEGRATION */),
+      onClose: handleAbort
+    }
+  ), step === "INTEGRATION" /* INTEGRATION */ && /* @__PURE__ */ import_react31.default.createElement(
+    Integration,
+    {
+      open,
+      onSuccess: () => setStep("PERMISSIONS" /* PERMISSIONS */),
+      onClose: handleAbort
+    }
+  ), step === "PERMISSIONS" /* PERMISSIONS */ && /* @__PURE__ */ import_react31.default.createElement(
+    Permissions,
+    {
+      open,
+      onClose: handleAbort,
+      onSuccess: () => setStep("STATUS" /* STATUS */)
+    }
+  ), step === "STATUS" /* STATUS */ && /* @__PURE__ */ import_react31.default.createElement(
+    StatusModal,
+    {
+      open,
+      onClose: handleAbort,
+      onSuccess: handleSuccess,
+      onError: handleError,
+      status: userConsent?.public_token ? "success" : "error"
+    }
+  ));
+};
+var styles16 = import_react_native17.StyleSheet.create({
+  defaultButton: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    paddingVertical: 14,
+    paddingHorizontal: 20,
+    minHeight: 48,
+    gap: 8
+  },
+  buttonText: {
+    fontWeight: "600"
+  },
+  container: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  KryptosConnectButton,
+  KryptosConnectModal,
+  KryptosConnectProvider,
+  useKryptosConnect
+});