@authon/react-native 0.2.1 → 0.3.0

package/dist/index.cjs

@@ -37,6 +37,9 @@ __export(index_exports, {
   SocialButton: () => SocialButton,
   SocialButtons: () => SocialButtons,
   useAuthon: () => useAuthon,
+  useAuthonPasskeys: () => useAuthonPasskeys,
+  useAuthonPasswordless: () => useAuthonPasswordless,
+  useAuthonWeb3: () => useAuthonWeb3,
   useUser: () => useUser
 });
 module.exports = __toCommonJS(index_exports);
@@ -227,6 +230,100 @@ var AuthonMobileClient = class {
   getApiUrl() {
     return this.apiUrl;
   }
+  // ── Web3 ──
+  async web3GetNonce(address, chain, walletType, chainId) {
+    return this.request("POST", "/v1/auth/web3/nonce", {
+      address,
+      chain,
+      walletType,
+      ...chainId != null ? { chainId } : {}
+    });
+  }
+  async web3Verify(message, signature, address, chain, walletType) {
+    const res = await this.request("POST", "/v1/auth/web3/verify", {
+      message,
+      signature,
+      address,
+      chain,
+      walletType
+    });
+    this.tokens = this.toTokenPair(res);
+    this.user = res.user;
+    await this.persistTokens();
+    this.scheduleRefresh(this.tokens.expiresAt);
+    this.emit("signedIn", res.user);
+    return { tokens: this.tokens, user: res.user };
+  }
+  async web3GetWallets() {
+    return this.request("GET", "/v1/auth/web3/wallets");
+  }
+  async web3LinkWallet(params) {
+    return this.request("POST", "/v1/auth/web3/wallets/link", params);
+  }
+  async web3UnlinkWallet(walletId) {
+    await this.requestAuth("DELETE", `/v1/auth/web3/wallets/${walletId}`);
+  }
+  // ── Passwordless ──
+  async passwordlessSendCode(identifier, type = "email") {
+    if (type === "sms") {
+      await this.request("POST", "/v1/auth/passwordless/sms-otp", { phone: identifier });
+    } else {
+      await this.request("POST", "/v1/auth/passwordless/email-otp", { email: identifier });
+    }
+  }
+  async passwordlessVerifyCode(identifier, code) {
+    const res = await this.request("POST", "/v1/auth/passwordless/verify", {
+      email: identifier,
+      code
+    });
+    this.tokens = this.toTokenPair(res);
+    this.user = res.user;
+    await this.persistTokens();
+    this.scheduleRefresh(this.tokens.expiresAt);
+    this.emit("signedIn", res.user);
+    return { tokens: this.tokens, user: res.user };
+  }
+  // ── Passkeys ──
+  async passkeyStartRegister(name) {
+    return this.requestAuth(
+      "POST",
+      "/v1/auth/passkeys/register/options",
+      name ? { name } : void 0
+    );
+  }
+  async passkeyCompleteRegister(credential) {
+    return this.requestAuth(
+      "POST",
+      "/v1/auth/passkeys/register/verify",
+      credential
+    );
+  }
+  async passkeyStartAuth(email) {
+    return this.request(
+      "POST",
+      "/v1/auth/passkeys/authenticate/options",
+      email ? { email } : void 0
+    );
+  }
+  async passkeyCompleteAuth(credential) {
+    const res = await this.request(
+      "POST",
+      "/v1/auth/passkeys/authenticate/verify",
+      credential
+    );
+    this.tokens = this.toTokenPair(res);
+    this.user = res.user;
+    await this.persistTokens();
+    this.scheduleRefresh(this.tokens.expiresAt);
+    this.emit("signedIn", res.user);
+    return { tokens: this.tokens, user: res.user };
+  }
+  async passkeyList() {
+    return this.requestAuth("GET", "/v1/auth/passkeys");
+  }
+  async passkeyDelete(credentialId) {
+    await this.requestAuth("DELETE", `/v1/auth/passkeys/${credentialId}`);
+  }
   // ── Event system ──
   on(event, listener) {
     if (!this.listeners.has(event)) this.listeners.set(event, /* @__PURE__ */ new Set());
@@ -279,6 +376,10 @@ var AuthonMobileClient = class {
       expiresAt: Date.now() + res.expiresIn * 1e3
     };
   }
+  async requestAuth(method, path, body) {
+    if (!this.tokens?.accessToken) throw new Error("Must be signed in");
+    return this.request(method, path, body);
+  }
   async request(method, path, body) {
     const headers = {
       "Content-Type": "application/json",
@@ -461,8 +562,162 @@ function useUser() {
   return { isLoaded, isSignedIn, user };
 }
 
-// src/icons.tsx
+// src/useAuthonWeb3.ts
 var import_react3 = require("react");
+function useAuthonWeb3() {
+  const ctx = (0, import_react3.useContext)(AuthonContext);
+  if (!ctx) throw new Error("useAuthonWeb3 must be used within <AuthonProvider>");
+  const [isLoading, setIsLoading] = (0, import_react3.useState)(false);
+  const [error, setError] = (0, import_react3.useState)(null);
+  const wrap = (0, import_react3.useCallback)(async (fn) => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      return await fn();
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+      return null;
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+  const getNonce = (0, import_react3.useCallback)(
+    (address, chain, walletType, chainId) => wrap(() => ctx.client.web3GetNonce(address, chain, walletType, chainId)),
+    [ctx.client, wrap]
+  );
+  const verify = (0, import_react3.useCallback)(
+    async (message, signature, address, chain, walletType) => {
+      const result = await wrap(
+        () => ctx.client.web3Verify(message, signature, address, chain, walletType)
+      );
+      return result !== null;
+    },
+    [ctx.client, wrap]
+  );
+  const getWallets = (0, import_react3.useCallback)(
+    () => wrap(() => ctx.client.web3GetWallets()),
+    [ctx.client, wrap]
+  );
+  const linkWallet = (0, import_react3.useCallback)(
+    (params) => wrap(() => ctx.client.web3LinkWallet(params)),
+    [ctx.client, wrap]
+  );
+  const unlinkWallet = (0, import_react3.useCallback)(
+    async (walletId) => {
+      const result = await wrap(() => ctx.client.web3UnlinkWallet(walletId));
+      return result !== null;
+    },
+    [ctx.client, wrap]
+  );
+  return {
+    getNonce,
+    verify,
+    getWallets,
+    linkWallet,
+    unlinkWallet,
+    isLoading,
+    error
+  };
+}
+
+// src/useAuthonPasswordless.ts
+var import_react4 = require("react");
+function useAuthonPasswordless() {
+  const ctx = (0, import_react4.useContext)(AuthonContext);
+  if (!ctx) throw new Error("useAuthonPasswordless must be used within <AuthonProvider>");
+  const [isLoading, setIsLoading] = (0, import_react4.useState)(false);
+  const [error, setError] = (0, import_react4.useState)(null);
+  const wrap = (0, import_react4.useCallback)(async (fn) => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      return await fn();
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+      return null;
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+  const sendCode = (0, import_react4.useCallback)(
+    async (identifier, type = "email") => {
+      const result = await wrap(() => ctx.client.passwordlessSendCode(identifier, type));
+      return result !== null;
+    },
+    [ctx.client, wrap]
+  );
+  const verifyCode = (0, import_react4.useCallback)(
+    (identifier, code) => wrap(() => ctx.client.passwordlessVerifyCode(identifier, code)),
+    [ctx.client, wrap]
+  );
+  return {
+    sendCode,
+    verifyCode,
+    isLoading,
+    error
+  };
+}
+
+// src/useAuthonPasskeys.ts
+var import_react5 = require("react");
+function useAuthonPasskeys() {
+  const ctx = (0, import_react5.useContext)(AuthonContext);
+  if (!ctx) throw new Error("useAuthonPasskeys must be used within <AuthonProvider>");
+  const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
+  const [error, setError] = (0, import_react5.useState)(null);
+  const wrap = (0, import_react5.useCallback)(async (fn) => {
+    setIsLoading(true);
+    setError(null);
+    try {
+      return await fn();
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+      return null;
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+  const startRegister = (0, import_react5.useCallback)(
+    (name) => wrap(() => ctx.client.passkeyStartRegister(name)),
+    [ctx.client, wrap]
+  );
+  const completeRegister = (0, import_react5.useCallback)(
+    (credential) => wrap(() => ctx.client.passkeyCompleteRegister(credential)),
+    [ctx.client, wrap]
+  );
+  const startAuth = (0, import_react5.useCallback)(
+    (email) => wrap(() => ctx.client.passkeyStartAuth(email)),
+    [ctx.client, wrap]
+  );
+  const completeAuth = (0, import_react5.useCallback)(
+    (credential) => wrap(() => ctx.client.passkeyCompleteAuth(credential)),
+    [ctx.client, wrap]
+  );
+  const listPasskeys = (0, import_react5.useCallback)(
+    () => wrap(() => ctx.client.passkeyList()),
+    [ctx.client, wrap]
+  );
+  const deletePasskey = (0, import_react5.useCallback)(
+    async (credentialId) => {
+      const result = await wrap(() => ctx.client.passkeyDelete(credentialId));
+      return result !== null;
+    },
+    [ctx.client, wrap]
+  );
+  return {
+    startRegister,
+    completeRegister,
+    startAuth,
+    completeAuth,
+    listPasskeys,
+    deletePasskey,
+    isLoading,
+    error
+  };
+}
+
+// src/icons.tsx
+var import_react6 = require("react");
 var import_react_native_svg = __toESM(require("react-native-svg"), 1);
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function GoogleIcon({ size = 20 }) {
@@ -524,7 +779,7 @@ function ProviderIcon({ provider, size = 20, color }) {
 }
 
 // src/SocialButton.tsx
-var import_react4 = require("react");
+var import_react7 = require("react");
 var import_react_native = require("react-native");
 var import_shared = require("@authon/shared");
 var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -534,16 +789,41 @@ function SocialButton({
   loading = false,
   disabled = false,
   label,
+  compact = false,
   style,
   labelStyle,
-  iconSize = 20,
+  iconSize,
   borderRadius = 10,
-  height = 48
+  height = 48,
+  size = 48
 }) {
   const colors = import_shared.PROVIDER_COLORS[provider] || { bg: "#333", text: "#fff" };
   const displayName = import_shared.PROVIDER_DISPLAY_NAMES[provider] || provider;
   const buttonLabel = label ?? `Continue with ${displayName}`;
   const needsBorder = colors.bg.toLowerCase() === "#ffffff";
+  const resolvedIconSize = iconSize ?? (compact ? 24 : 20);
+  if (compact) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_react_native.TouchableOpacity,
+      {
+        style: [
+          styles.compactButton,
+          {
+            backgroundColor: colors.bg,
+            borderRadius,
+            width: size,
+            height: size
+          },
+          needsBorder && styles.bordered,
+          style
+        ],
+        onPress: () => onPress(provider),
+        disabled: disabled || loading,
+        activeOpacity: 0.8,
+        children: loading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native.ActivityIndicator, { color: colors.text, size: "small" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ProviderIcon, { provider, size: resolvedIconSize, color: colors.text })
+      }
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     import_react_native.TouchableOpacity,
     {
@@ -561,7 +841,7 @@ function SocialButton({
       disabled: disabled || loading,
       activeOpacity: 0.8,
       children: loading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_native.ActivityIndicator, { color: colors.text, size: "small" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ProviderIcon, { provider, size: iconSize, color: colors.text }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ProviderIcon, { provider, size: resolvedIconSize, color: colors.text }),
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           import_react_native.Text,
           {
@@ -586,6 +866,10 @@ var styles = import_react_native.StyleSheet.create({
     gap: 10,
     paddingHorizontal: 16
   },
+  compactButton: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
   bordered: {
     borderWidth: 1,
     borderColor: "#dadce0"
@@ -597,19 +881,22 @@ var styles = import_react_native.StyleSheet.create({
 });
 
 // src/SocialButtons.tsx
-var import_react5 = require("react");
+var import_react8 = require("react");
 var import_react_native2 = require("react-native");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function SocialButtons({
   onSuccess,
   onError,
   style,
-  gap = 10,
+  gap,
+  compact = false,
+  labels,
   buttonProps
 }) {
   const { providers, startOAuth, completeOAuth } = useAuthon();
-  const [loadingProvider, setLoadingProvider] = (0, import_react5.useState)(null);
+  const [loadingProvider, setLoadingProvider] = (0, import_react8.useState)(null);
   if (providers.length === 0) return null;
+  const resolvedGap = gap ?? (compact ? 12 : 10);
   const handlePress = async (provider) => {
     setLoadingProvider(provider);
     try {
@@ -626,20 +913,37 @@ function SocialButtons({
       setLoadingProvider(null);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_native2.View, { style: [styles2.container, { gap }, style], children: providers.map((provider) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    SocialButton,
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    import_react_native2.View,
     {
-      provider,
-      onPress: handlePress,
-      loading: loadingProvider === provider,
-      disabled: !!loadingProvider,
-      ...buttonProps
-    },
-    provider
-  )) });
+      style: [
+        compact ? styles2.compactContainer : styles2.container,
+        { gap: resolvedGap },
+        style
+      ],
+      children: providers.map((provider) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        SocialButton,
+        {
+          provider,
+          onPress: handlePress,
+          loading: loadingProvider === provider,
+          disabled: !!loadingProvider,
+          compact,
+          label: labels?.[provider],
+          ...buttonProps
+        },
+        provider
+      ))
+    }
+  );
 }
 var styles2 = import_react_native2.StyleSheet.create({
-  container: {}
+  container: {},
+  compactContainer: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    justifyContent: "center"
+  }
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -650,6 +954,9 @@ var styles2 = import_react_native2.StyleSheet.create({
   SocialButton,
   SocialButtons,
   useAuthon,
+  useAuthonPasskeys,
+  useAuthonPasswordless,
+  useAuthonWeb3,
   useUser
 });
 //# sourceMappingURL=index.cjs.map