npm - @vaultix.ai/react - Versions diffs - 0.2.4 → 0.3.1 - Mend

@vaultix.ai/react 0.2.4 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/index.js CHANGED Viewed

@@ -170,21 +170,22 @@ function VaultixProvider({
         }
         jwtRef.current = jwt;
       }
+      if (!jwt) {
+        if (!cancelled) setIsLoaded(true);
+        return;
+      }
       try {
         const headers = {
+          "Authorization": `Bearer ${jwt}`,
           "X-Vaultix-Publishable-Key": publishableKey
         };
-        if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
         const res = await fetch(`${apiOrigin}/api/v1/me`, {
-          // Use Bearer token for cross-domain; fall back to cookie for same-domain
-          credentials: jwt ? "omit" : "include",
+          credentials: "omit",
           headers
         });
         if (!res.ok) {
-          if (jwt) {
-            clearJwt();
-            jwtRef.current = null;
-          }
+          clearJwt();
+          jwtRef.current = null;
           if (!cancelled) setIsLoaded(true);
           return;
         }
@@ -210,16 +211,14 @@ function VaultixProvider({
     const jwt = jwtRef.current;
     clearAuth();
     if (refreshTimerRef.current) clearTimeout(refreshTimerRef.current);
-    try {
-      const headers = {};
-      if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
-      await fetch(`${apiOrigin}/api/v1/session`, {
-        method: "DELETE",
-        credentials: jwt ? "omit" : "include",
-        headers
-      });
-    } catch {
-    }
+    const headers = {};
+    if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
+    fetch(`${apiOrigin}/api/v1/session`, {
+      method: "DELETE",
+      credentials: jwt ? "omit" : "include",
+      headers
+    }).catch(() => {
+    });
     if (afterSignInUrl) window.location.href = afterSignInUrl;
   }, [apiOrigin, afterSignInUrl, clearAuth]);
   const value = {
@@ -344,13 +343,18 @@ function SignIn({
     url.searchParams.set("__vaultix_handshake", handshakeToken);
     window.location.href = url.toString();
   }
-  function handleGoogleSignIn() {
+  function oauthRedirect(provider) {
     const target = resolveAfterSignInUrl(redirectUrl);
     const pk = resolvePk();
     const params = new URLSearchParams({ redirect_url: target });
     if (pk) params.set("pk", pk);
-    window.location.href = `${apiOrigin}/api/v1/auth/oauth/google?${params}`;
+    window.location.href = `${apiOrigin}/api/v1/auth/oauth/${provider}?${params}`;
   }
+  const handleGoogleSignIn = () => oauthRedirect("google");
+  const handleMetaSignIn = () => oauthRedirect("meta");
+  const handleLinkedInSignIn = () => oauthRedirect("linkedin");
+  const handleXSignIn = () => oauthRedirect("x");
+  const handleGitHubSignIn = () => oauthRedirect("github");
   async function handleEmailSubmit(e) {
     e.preventDefault();
     setError(null);
@@ -575,6 +579,10 @@ function SignIn({
           info && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "rounded-lg bg-blue-500/10 border border-blue-500/30 px-3 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "text-xs text-blue-400", children: info }) }),
           step === "email" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "space-y-3", children: [
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(GoogleButton, { onClick: handleGoogleSignIn }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(GitHubButton, { onClick: handleGitHubSignIn }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(MetaButton, { onClick: handleMetaSignIn }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkedInButton, { onClick: handleLinkedInSignIn }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(XButton, { onClick: handleXSignIn }),
             /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Divider, {}),
             /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("form", { onSubmit: handleEmailSubmit, className: "space-y-3", children: [
               /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
@@ -740,7 +748,11 @@ function GhostButton({ children, onClick }) {
     }
   );
 }
-function GoogleButton({ onClick }) {
+function OAuthButton({
+  icon,
+  label,
+  onClick
+}) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     "button",
     {
@@ -754,12 +766,27 @@ function GoogleButton({ onClick }) {
         "transition-all duration-150"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(GoogleIcon, {}),
-        "Continue with Google"
+        icon,
+        label
       ]
     }
   );
 }
+function GoogleButton({ onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OAuthButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(GoogleIcon, {}), label: "Continue with Google", onClick });
+}
+function MetaButton({ onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OAuthButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(MetaIcon, {}), label: "Continue with Facebook", onClick });
+}
+function LinkedInButton({ onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OAuthButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LinkedInIcon, {}), label: "Continue with LinkedIn", onClick });
+}
+function GitHubButton({ onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OAuthButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(GitHubIcon, {}), label: "Continue with GitHub", onClick });
+}
+function XButton({ onClick }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OAuthButton, { icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(XIcon, {}), label: "Continue with X", onClick });
+}
 function Divider() {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex-1 h-px bg-white/8" }),
@@ -821,6 +848,18 @@ function GoogleIcon() {
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z", fill: "#EA4335" })
   ] });
 }
+function MetaIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "#1877F2", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" }) });
+}
+function LinkedInIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "#0A66C2", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.063 2.063 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" }) });
+}
+function GitHubIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "white", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z" }) });
+}
+function XIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "white", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.744l7.737-8.835L1.254 2.25H8.08l4.253 5.622 5.911-5.622zm-1.161 17.52h1.833L7.084 4.126H5.117z" }) });
+}
 // src/components/SignUp.tsx
 var import_clsx2 = require("clsx");

package/dist/index.mjs CHANGED Viewed

@@ -138,21 +138,22 @@ function VaultixProvider({
         }
         jwtRef.current = jwt;
       }
+      if (!jwt) {
+        if (!cancelled) setIsLoaded(true);
+        return;
+      }
       try {
         const headers = {
+          "Authorization": `Bearer ${jwt}`,
           "X-Vaultix-Publishable-Key": publishableKey
         };
-        if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
         const res = await fetch(`${apiOrigin}/api/v1/me`, {
-          // Use Bearer token for cross-domain; fall back to cookie for same-domain
-          credentials: jwt ? "omit" : "include",
+          credentials: "omit",
           headers
         });
         if (!res.ok) {
-          if (jwt) {
-            clearJwt();
-            jwtRef.current = null;
-          }
+          clearJwt();
+          jwtRef.current = null;
           if (!cancelled) setIsLoaded(true);
           return;
         }
@@ -178,16 +179,14 @@ function VaultixProvider({
     const jwt = jwtRef.current;
     clearAuth();
     if (refreshTimerRef.current) clearTimeout(refreshTimerRef.current);
-    try {
-      const headers = {};
-      if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
-      await fetch(`${apiOrigin}/api/v1/session`, {
-        method: "DELETE",
-        credentials: jwt ? "omit" : "include",
-        headers
-      });
-    } catch {
-    }
+    const headers = {};
+    if (jwt) headers["Authorization"] = `Bearer ${jwt}`;
+    fetch(`${apiOrigin}/api/v1/session`, {
+      method: "DELETE",
+      credentials: jwt ? "omit" : "include",
+      headers
+    }).catch(() => {
+    });
     if (afterSignInUrl) window.location.href = afterSignInUrl;
   }, [apiOrigin, afterSignInUrl, clearAuth]);
   const value = {
@@ -312,13 +311,18 @@ function SignIn({
     url.searchParams.set("__vaultix_handshake", handshakeToken);
     window.location.href = url.toString();
   }
-  function handleGoogleSignIn() {
+  function oauthRedirect(provider) {
     const target = resolveAfterSignInUrl(redirectUrl);
     const pk = resolvePk();
     const params = new URLSearchParams({ redirect_url: target });
     if (pk) params.set("pk", pk);
-    window.location.href = `${apiOrigin}/api/v1/auth/oauth/google?${params}`;
+    window.location.href = `${apiOrigin}/api/v1/auth/oauth/${provider}?${params}`;
   }
+  const handleGoogleSignIn = () => oauthRedirect("google");
+  const handleMetaSignIn = () => oauthRedirect("meta");
+  const handleLinkedInSignIn = () => oauthRedirect("linkedin");
+  const handleXSignIn = () => oauthRedirect("x");
+  const handleGitHubSignIn = () => oauthRedirect("github");
   async function handleEmailSubmit(e) {
     e.preventDefault();
     setError(null);
@@ -543,6 +547,10 @@ function SignIn({
           info && /* @__PURE__ */ jsx2("div", { className: "rounded-lg bg-blue-500/10 border border-blue-500/30 px-3 py-2", children: /* @__PURE__ */ jsx2("p", { className: "text-xs text-blue-400", children: info }) }),
           step === "email" && /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
             /* @__PURE__ */ jsx2(GoogleButton, { onClick: handleGoogleSignIn }),
+            /* @__PURE__ */ jsx2(GitHubButton, { onClick: handleGitHubSignIn }),
+            /* @__PURE__ */ jsx2(MetaButton, { onClick: handleMetaSignIn }),
+            /* @__PURE__ */ jsx2(LinkedInButton, { onClick: handleLinkedInSignIn }),
+            /* @__PURE__ */ jsx2(XButton, { onClick: handleXSignIn }),
             /* @__PURE__ */ jsx2(Divider, {}),
             /* @__PURE__ */ jsxs("form", { onSubmit: handleEmailSubmit, className: "space-y-3", children: [
               /* @__PURE__ */ jsx2(
@@ -708,7 +716,11 @@ function GhostButton({ children, onClick }) {
     }
   );
 }
-function GoogleButton({ onClick }) {
+function OAuthButton({
+  icon,
+  label,
+  onClick
+}) {
   return /* @__PURE__ */ jsxs(
     "button",
     {
@@ -722,12 +734,27 @@ function GoogleButton({ onClick }) {
         "transition-all duration-150"
       ),
       children: [
-        /* @__PURE__ */ jsx2(GoogleIcon, {}),
-        "Continue with Google"
+        icon,
+        label
       ]
     }
   );
 }
+function GoogleButton({ onClick }) {
+  return /* @__PURE__ */ jsx2(OAuthButton, { icon: /* @__PURE__ */ jsx2(GoogleIcon, {}), label: "Continue with Google", onClick });
+}
+function MetaButton({ onClick }) {
+  return /* @__PURE__ */ jsx2(OAuthButton, { icon: /* @__PURE__ */ jsx2(MetaIcon, {}), label: "Continue with Facebook", onClick });
+}
+function LinkedInButton({ onClick }) {
+  return /* @__PURE__ */ jsx2(OAuthButton, { icon: /* @__PURE__ */ jsx2(LinkedInIcon, {}), label: "Continue with LinkedIn", onClick });
+}
+function GitHubButton({ onClick }) {
+  return /* @__PURE__ */ jsx2(OAuthButton, { icon: /* @__PURE__ */ jsx2(GitHubIcon, {}), label: "Continue with GitHub", onClick });
+}
+function XButton({ onClick }) {
+  return /* @__PURE__ */ jsx2(OAuthButton, { icon: /* @__PURE__ */ jsx2(XIcon, {}), label: "Continue with X", onClick });
+}
 function Divider() {
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ jsx2("div", { className: "flex-1 h-px bg-white/8" }),
@@ -789,6 +816,18 @@ function GoogleIcon() {
     /* @__PURE__ */ jsx2("path", { d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z", fill: "#EA4335" })
   ] });
 }
+function MetaIcon() {
+  return /* @__PURE__ */ jsx2("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "#1877F2", children: /* @__PURE__ */ jsx2("path", { d: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" }) });
+}
+function LinkedInIcon() {
+  return /* @__PURE__ */ jsx2("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "#0A66C2", children: /* @__PURE__ */ jsx2("path", { d: "M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.063 2.063 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" }) });
+}
+function GitHubIcon() {
+  return /* @__PURE__ */ jsx2("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "white", children: /* @__PURE__ */ jsx2("path", { d: "M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0 1 12 6.844a9.59 9.59 0 0 1 2.504.337c1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.02 10.02 0 0 0 22 12.017C22 6.484 17.522 2 12 2z" }) });
+}
+function XIcon() {
+  return /* @__PURE__ */ jsx2("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "white", children: /* @__PURE__ */ jsx2("path", { d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.744l7.737-8.835L1.254 2.25H8.08l4.253 5.622 5.911-5.622zm-1.161 17.52h1.833L7.084 4.126H5.117z" }) });
+}
 // src/components/SignUp.tsx
 import { clsx as clsx2 } from "clsx";

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@vaultix.ai/react",
-  "version": "0.2.4",
+  "version": "0.3.1",
   "description": "Vaultix-ID React SDK — drop-in auth components for any React app",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",