@nibssplc/cams-sdk-react 0.0.1-beta.58 → 0.0.1-beta.60

package/dist/components/ClientOnly.d.ts

@@ -2,5 +2,5 @@ interface ClientOnlyProps {
     children: React.ReactNode;
     fallback?: React.ReactNode;
 }
-export declare function ClientOnly({ children, fallback }: ClientOnlyProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare const ClientOnly: ({ children, fallback }: ClientOnlyProps) => import("react/jsx-runtime").JSX.Element;
+export default ClientOnly;

package/dist/components/LoginButton.d.ts

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

package/dist/components/MFAGate.d.ts

@@ -1,6 +1,7 @@
 interface MFAGateProps {
     children: React.ReactNode;
     fallback?: React.ReactNode;
+    loginComponent?: React.ComponentType;
 }
-declare const MFAGate: ({ children, fallback }: MFAGateProps) => string | number | bigint | true | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element;
+declare const MFAGate: ({ children, fallback, loginComponent: LoginComponent }: MFAGateProps) => string | number | bigint | true | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element;
 export default MFAGate;

package/dist/components/UnifiedCAMSProvider.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 import { PublicClientApplication, Configuration } from "@azure/msal-browser";
 import { UseCAMSAuthOptions } from "../hooks/useCAMSAuth";
 import { UseCAMSMSALAuthOptions } from "../hooks/useCAMSMSALAuth";
+import { useCAMSContext } from "../context/CAMSContext";
 interface BaseProviderProps {
     children: React.ReactNode;
     appCode: string;
@@ -19,4 +20,4 @@ type UnifiedCAMSProviderProps = RegularProviderProps | MSALProviderProps;
 export declare function UnifiedCAMSProvider(props: UnifiedCAMSProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare const CAMSProvider: (props: Omit<RegularProviderProps, "mode">) => import("react/jsx-runtime").JSX.Element;
 export declare const CAMSMSALProvider: (props: Omit<MSALProviderProps, "mode">) => import("react/jsx-runtime").JSX.Element;
-export {};
+export { useCAMSContext };

package/dist/index.cjs.js

@@ -330,74 +330,67 @@ function useCAMSMSALAuth(options) {
     //   handleRedirect();
     // }, []);
     var login = React.useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
-        var err_1, camsError_1, camsError;
-        var _a, _b, _c;
-        return __generator(this, function (_d) {
-            switch (_d.label) {
+        var response, mfaConfig, authenticator, err_1, camsError_1, camsError;
+        var _a, _b, _c, _d;
+        return __generator(this, function (_e) {
+            switch (_e.label) {
                 case 0:
                     setError(null);
-                    _d.label = 1;
+                    _e.label = 1;
                 case 1:
-                    _d.trys.push([1, 3, , 4]);
-                    // await instance.loginR edirect({
-                    //   scopes,
-                    //   prompt: options.prompt || "login",
-                    // });
-                    return [4 /*yield*/, instance
-                            .loginPopup({
+                    _e.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, instance.loginPopup({
                             scopes: scopes,
                             prompt: options.prompt || "login",
-                        })
-                            .then(function (response) {
-                            var _a;
-                            camsSdk.Logger.debug("Login Token response:", {
-                                accessToken: response.accessToken,
-                                idToken: response.idToken,
-                            });
-                            setAccessToken(response.accessToken);
-                            setIdToken(response.idToken);
-                            // Initialize MFA authenticator
-                            var mfaConfig = {
-                                accessToken: response.accessToken,
-                                idToken: response.idToken,
-                                appCode: options.appCode,
-                                provider: "MSAL",
-                                apiEndpoint: options.mfaApiEndpoint,
-                            };
-                            var authenticator = new camsSdk.CAMSMFAAuthenticator(mfaConfig);
-                            setMfaAuthenticator(authenticator);
-                            setRequiresMFA(true);
-                            // Don't persist as authenticated until MFA is complete
-                            if (typeof window !== "undefined") {
-                                localStorage.setItem(options.storageKey, JSON.stringify({
-                                    isAuthenticated: false,
-                                    requiresMFA: true,
-                                    accessToken: response.accessToken,
-                                    idToken: response.idToken,
-                                }));
-                            }
-                            (_a = options.onAuthSuccess) === null || _a === void 0 ? void 0 : _a.call(options, response.accessToken);
                         })];
                 case 2:
-                    // await instance.loginR edirect({
-                    //   scopes,
-                    //   prompt: options.prompt || "login",
-                    // });
-                    _d.sent();
+                    response = _e.sent();
+                    camsSdk.Logger.debug("Login Token response:", {
+                        accessToken: response.accessToken,
+                        idToken: response.idToken,
+                    });
+                    setAccessToken(response.accessToken);
+                    setIdToken(response.idToken);
+                    mfaConfig = {
+                        accessToken: response.accessToken,
+                        idToken: response.idToken,
+                        appCode: options.appCode,
+                        provider: "MSAL",
+                        apiEndpoint: options.mfaApiEndpoint,
+                    };
+                    authenticator = new camsSdk.CAMSMFAAuthenticator(mfaConfig);
+                    setMfaAuthenticator(authenticator);
+                    setRequiresMFA(true);
+                    // Don't persist as authenticated until MFA is complete
+                    if (typeof window !== "undefined") {
+                        localStorage.setItem(options.storageKey, JSON.stringify({
+                            isAuthenticated: false,
+                            requiresMFA: true,
+                            accessToken: response.accessToken,
+                            idToken: response.idToken,
+                        }));
+                    }
+                    (_a = options.onAuthSuccess) === null || _a === void 0 ? void 0 : _a.call(options, response.accessToken);
                     return [3 /*break*/, 4];
                 case 3:
-                    err_1 = _d.sent();
+                    err_1 = _e.sent();
+                    // Handle user cancellation gracefully
+                    if (err_1.errorCode === "user_cancelled") {
+                        camsSdk.Logger.info("User cancelled login");
+                        setError(null); // Don't treat cancellation as an error
+                        return [2 /*return*/];
+                    }
                     // If popup is blocked
                     if (err_1.errorCode === "popup_window_error" ||
-                        ((_a = err_1.message) === null || _a === void 0 ? void 0 : _a.includes("popup"))) {
-                        camsError_1 = new camsSdk.CAMSError(camsSdk.CAMSErrorType.POPUP_BLOCKED, "Both popup and redirect failed: " + err_1);
+                        ((_b = err_1.message) === null || _b === void 0 ? void 0 : _b.includes("popup"))) {
+                        camsError_1 = new camsSdk.CAMSError(camsSdk.CAMSErrorType.POPUP_BLOCKED, "Popup blocked by browser. Please allow popups and try again.");
                         setError(camsError_1);
-                        (_b = options.onAuthError) === null || _b === void 0 ? void 0 : _b.call(options, camsError_1);
+                        (_c = options.onAuthError) === null || _c === void 0 ? void 0 : _c.call(options, camsError_1);
                         return [2 /*return*/];
                     }
-                    camsError = new camsSdk.CAMSError(camsSdk.CAMSErrorType.API_VALIDATION_ERROR, "Login failed: " + err_1);
+                    camsError = new camsSdk.CAMSError(camsSdk.CAMSErrorType.API_VALIDATION_ERROR, "Login failed: " + err_1.message || err_1);
                     setError(camsError);
-                    (_c = options.onAuthError) === null || _c === void 0 ? void 0 : _c.call(options, camsError);
+                    (_d = options.onAuthError) === null || _d === void 0 ? void 0 : _d.call(options, camsError);
                     return [3 /*break*/, 4];
                 case 4: return [2 /*return*/];
             }
@@ -1102,7 +1095,7 @@ function useCAMSMSALContext() {
     return context;
 }
 
-function ClientOnly(_a) {
+var ClientOnly = function (_a) {
     var children = _a.children, _b = _a.fallback, fallback = _b === void 0 ? null : _b;
     var _c = React.useState(false), hasMounted = _c[0], setHasMounted = _c[1];
     React.useEffect(function () {
@@ -1112,7 +1105,7 @@ function ClientOnly(_a) {
         return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: fallback });
     }
     return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children });
-}
+};
 
 var CAMSContext = React.createContext(null);
 function useCAMSContext() {
@@ -1143,7 +1136,7 @@ var getCookie = function (name) {
 var deleteCookie = function (name) {
     document.cookie = name + "=; Max-Age=-99999999; path=/";
 };
-function CAMSProviderInner(props) {
+function CAMSProviderCore(props) {
     var _this = this;
     var _a = props, children = _a.children, mode = _a.mode, appCode = _a.appCode, validateTokenUrl = _a.validateTokenUrl;
     // Always call both hooks to satisfy Rules of Hooks
@@ -1239,9 +1232,9 @@ function UnifiedCAMSProvider(props) {
     if (props.mode === "MSAL") {
         var msalConfig = props.msalConfig, msalInstance = props.msalInstance;
         var instance = msalInstance || new msalBrowser.PublicClientApplication(msalConfig);
-        return (jsxRuntimeExports.jsx(msalReact.MsalProvider, { instance: instance, children: jsxRuntimeExports.jsx(CAMSProviderInner, __assign({}, props)) }));
+        return (jsxRuntimeExports.jsx(msalReact.MsalProvider, { instance: instance, children: jsxRuntimeExports.jsx(CAMSProviderCore, __assign({}, props)) }));
     }
-    return jsxRuntimeExports.jsx(CAMSProviderInner, __assign({}, props));
+    return (jsxRuntimeExports.jsx(ClientOnly, { fallback: jsxRuntimeExports.jsx("div", { children: "Loading..." }), children: jsxRuntimeExports.jsx(CAMSProviderCore, __assign({}, props)) }));
 }
 // Backward compatibility exports
 var CAMSProvider = function (props) { return (jsxRuntimeExports.jsx(UnifiedCAMSProvider, __assign({}, props, { mode: "REGULAR" }))); };
@@ -1765,8 +1758,23 @@ var MFAOptions = function (_a) {
     return (jsxRuntimeExports.jsxs(Card, { className: "mx-auto space-y-6 p-6 bg-white rounded-lg shadow-md", children: [jsxRuntimeExports.jsxs(CardHeader, { children: [jsxRuntimeExports.jsx("img", { src: "/OTPAuthentication1.svg", alt: "NIBSS Logo", width: 365, height: 365 }), jsxRuntimeExports.jsx(CardTitle, { className: "text-3xl font-bold mb-6 text-center", children: "Two-Factor Authentication" }), jsxRuntimeExports.jsx(CardTitle, { className: "text-gray-300 text-sm -tracking-wide text-center", children: "Your Microsoft account has been validated. Please complete two-factor authentication to continue." })] }), jsxRuntimeExports.jsx(CardContent, { children: content }), jsxRuntimeExports.jsxs(CardFooter, { className: "flex items-center justify-center mt-6 space-x-2 text-gray-400 text-sm", children: [jsxRuntimeExports.jsx(lucideReact.ShieldCheck, { className: "w-4 h-4 text-[#506f4a] pulse-glow" }), jsxRuntimeExports.jsx("span", { children: "Powered By NIBSS" })] })] }));
 };
 
+var LoginButton = function () {
+    var context = useCAMSContext();
+    var login = context.login, isLoading = context.isLoading, error = context.error, authMode = context.authMode;
+    var handleLogin = function () {
+        if (authMode === "MSAL") {
+            login();
+        }
+        else {
+            // For regular mode, you'd need to provide CAMSConfig
+            console.warn("Regular CAMS login requires configuration");
+        }
+    };
+    return (jsxRuntimeExports.jsxs("div", { className: "flex flex-col items-center gap-4 p-6", children: [jsxRuntimeExports.jsx(Button, { onClick: handleLogin, disabled: isLoading, className: "min-w-[200px]", children: isLoading ? 'Logging in...' : 'Login with Microsoft' }), error && (jsxRuntimeExports.jsxs("p", { className: "text-red-600 text-sm text-center", children: ["Error: ", error.message] }))] }));
+};
+
 var MFAGate = function (_a) {
-    var children = _a.children, fallback = _a.fallback;
+    var children = _a.children, fallback = _a.fallback, LoginComponent = _a.loginComponent;
     var context = useCAMSContext();
     // Only apply MFA gate for MSAL mode
     if (context.authMode !== "MSAL") {
@@ -1784,7 +1792,7 @@ var MFAGate = function (_a) {
             } }));
     }
     if (!isAuthenticated) {
-        return fallback || jsxRuntimeExports.jsx("div", { children: "Please log in" });
+        return fallback || (LoginComponent ? jsxRuntimeExports.jsx(LoginComponent, {}) : jsxRuntimeExports.jsx(LoginButton, {}));
     }
     return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: children });
 };
@@ -1792,6 +1800,7 @@ var MFAGate = function (_a) {
 exports.CAMSMSALProvider = CAMSMSALProvider;
 exports.CAMSProvider = CAMSProvider;
 exports.ClientOnly = ClientOnly;
+exports.LoginButton = LoginButton;
 exports.MFAGate = MFAGate;
 exports.MFAOptions = MFAOptions;
 exports.ProtectedRoute = ProtectedRoute;