@solidxai/core-ui 0.1.7-beta.0 → 0.1.7-beta.10

package/dist/components/auth/AuthLayout.tsx

@@ -1,20 +1,15 @@
 import Link from "../common/Link";
 import { usePathname } from "../../hooks/usePathname";
 import { useRouter } from "../../hooks/useRouter";
-import { PrimeReactContext } from "primereact/api";
-import { Button } from "primereact/button";
-import { Dialog } from "primereact/dialog";
 import { useEffect, useState } from "react";
-import { useDispatch, useSelector } from "react-redux";
 import Image from "../common/Image";
 import SolidLogo from '../../resources/images/SolidXLogo.svg'
-import { Divider } from "primereact/divider";
-import AuthScreenRightBackgroundImage from '../../resources/images/auth/solid-left-layout-bg.png';
-import AuthScreenLeftBackgroundImage from '../../resources/images/auth/solid-right-layout-bg.png';
 import AuthScreenCenterBackgroundImage from '../../resources/images/auth/solid-login-light.png';
 import { useLazyGetAuthSettingsQuery } from "../../redux/api/solidSettingsApi";
 import { env } from "../../adapters/env";
+import { SolidButton, SolidDialog, SolidDivider } from "../shad-cn-ui";
 
+const SHADCN_PLACEHOLDER_IMAGE = "https://ui.shadcn.com/placeholder.svg";
 
 export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
     const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery()
@@ -43,9 +38,10 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
     //     }
     // }, [solidSettingsData]);
     useEffect(() => {
-        // Fetch settings if not already available
         trigger("");
+    }, [trigger]);
 
+    useEffect(() => {
         const allowPublicRegistration = solidSettingsData?.data?.allowPublicRegistration;
         if (allowPublicRegistration === false) {
             setAllowRegistration(false);
@@ -58,7 +54,7 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
             setAllowRegistration(true);
             setIsRestricted(false);
         }
-    }, [solidSettingsData, pathname, trigger]);
+    }, [solidSettingsData, pathname]);
 
     if (allowRegistration === null && pathname === "/auth/register") {
         console.log(`AuthLayout returning null because allowRegistration is null for register route`);
@@ -77,9 +73,9 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
         let src = '';
 
         if (layout === 'left') {
-            src = solidSettingsData?.data?.authScreenLeftBackgroundImage || (AuthScreenLeftBackgroundImage as any).src || AuthScreenLeftBackgroundImage;
+            src = solidSettingsData?.data?.authScreenLeftBackgroundImage || SHADCN_PLACEHOLDER_IMAGE;
         } else if (layout === 'right') {
-            src = solidSettingsData?.data?.authScreenRightBackgroundImage || (AuthScreenRightBackgroundImage as any).src || AuthScreenRightBackgroundImage;
+            src = solidSettingsData?.data?.authScreenRightBackgroundImage || SHADCN_PLACEHOLDER_IMAGE;
         } else if (layout === 'center') {
             src = solidSettingsData?.data?.authScreenCenterBackgroundImage || (AuthScreenCenterBackgroundImage as any).src || AuthScreenCenterBackgroundImage;
         }
@@ -93,84 +89,90 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
         return src;
     };
 
-    return (
-        <div className={`solid-auth-theme-wrapper ${solidSettingsData?.data?.authPagesLayout || 'center'}`}
-            style={
-                solidSettingsData?.data?.authPagesLayout === 'center' ? { backgroundImage: `url(${solidSettingsData?.data?.authScreenCenterBackgroundImage || (AuthScreenCenterBackgroundImage as any)?.src || AuthScreenCenterBackgroundImage})` } : {}
-            }
+    const normalizeAssetUrl = (src?: string) => {
+        if (!src) return "";
+        const isBlobOrAbsolute = src.startsWith("blob:") || src.startsWith("http");
+        if (isBlobOrAbsolute || src.startsWith("/")) return src;
+        return `${env("API_URL")}/${src}`;
+    };
+
+    const authLogoSrc = normalizeAssetUrl(solidSettingsData?.data?.appLogo || "");
+    const appName = solidSettingsData?.data?.appTitle || "SolidX";
+
+    const renderBrand = (align: "center" | "start" = "start") => (
+        <a href="#" className={`solid-auth-brand ${align === "center" ? "is-center" : ""}`} aria-label={appName}>
+                {authLogoSrc ? (
+                    <span className="solid-auth-brand-logo">
+                    <img src={authLogoSrc} alt={appName} />
+                    </span>
+                ) : (
+                    <span className="solid-auth-brand-icon">
+                    <span className="solid-auth-brand-fallback">{appName.slice(0, 1).toUpperCase()}</span>
+                    <span className="solid-auth-brand-text">{appName}</span>
+                    </span>
+                )}
+        </a>
+    );
+
+    const authLayout = solidSettingsData?.data?.authPagesLayout || "center";
+    const authTheme = solidSettingsData?.data?.authPagesTheme === "dark" ? "dark" : "light";
+    const isCenter = authLayout === "center";
+    const isLeft = authLayout === "left";
+    const isRight = authLayout === "right";
+
+    const formPane = (
+        <div className="solid-auth-form-pane solid-login-dark-bg">
+            <div className="solid-auth-form-pane-inner">
+                {renderBrand("start")}
+                {authChildren}
+            </div>
+        </div>
+    );
+
+    const imagePane = (
+        <div
+            className={`solid-auth-image-pane position-relative ${isLeft ? "solid-left-layout pane-on-right" : "solid-right-layout pane-on-left"}`.trim()}
+            style={{ backgroundImage: `url(${solidSideBanner()})` }}
         >
-            <div className={`${solidSettingsData?.data?.authPagesLayout !== 'center' ? 'grid w-full h-full m-0' : ''}`}>
-                {solidSettingsData?.data?.authPagesLayout === 'left' &&
-                    <div className='col-12 lg:col-7 xl:col-6  flex align-items-center justify-content-center solid-login-dark-bg'>
-                        <div className="w-full">
-                            {solidSettingsData?.data?.appLogoPosition === "in_form_view" &&
-                                <div className="flex justify-content-center">
-                                    <div className={`solid-logo flex align-items-center ${solidSettingsData?.data?.appLogoPosition}`}>
-                                        <Image
-                                            alt="solid logo"
-                                            src={solidSettingsData?.data?.appLogo || SolidLogo}
-                                            className="relative"
-                                            fill
-                                        />
-                                    </div>
-                                </div>
-                            }
-                            {authChildren}
+            {solidSettingsData?.data?.appLogoPosition === "in_image_view" &&
+                <div className={`solid-logo flex align-items-center gap-3 ${solidSettingsData?.data?.appLogoPosition}`}>
+                    <Image
+                        alt="solid logo"
+                        src={solidSettingsData?.data?.appLogo || SolidLogo}
+                        className="relative"
+                        fill
+                    />
+                </div>
+            }
+            {solidSettingsData?.data?.showAuthContent &&
+                <div className="w-full" style={{ zIndex: 1 }}>
+                    <div className="grid">
+                        <div className="col-8 mx-auto">
+                            {solidSettingsData?.data?.appSubtitle && <h1 className="solid-auth-image-subtitle m-0">{solidSettingsData?.data?.appSubtitle}</h1>}
+                            {solidSettingsData?.data?.appTitle && <h1 className="solid-auth-image-title mt-0">{solidSettingsData?.data?.appTitle}</h1>}
+                            {solidSettingsData?.data?.appDescription && <p className="solid-auth-image-helper-text">{solidSettingsData?.data?.appDescription}</p>}
                         </div>
                     </div>
-                }
+                </div>
+            }
+        </div>
+    );
 
-                <div
-                    className={`hidden lg:flex ${solidSettingsData?.data?.authPagesLayout !== 'center' ? 'col-5 xl:col-6 position-relative' : ''} 
-                                ${solidSettingsData?.data?.authPagesLayout === 'left' ? 'solid-left-layout' : ''} 
-                                ${solidSettingsData?.data?.authPagesLayout === 'right' ? 'solid-right-layout' : ''}`.trim()}
-                    style={{ backgroundImage: `url(${solidSideBanner()})` }}
-                >
-                    {solidSettingsData?.data?.appLogoPosition === "in_image_view" && solidSettingsData?.data?.authPagesLayout !== 'center' &&
-                        <div className={`solid-logo flex align-items-center gap-3 ${solidSettingsData?.data?.appLogoPosition}`}>
-                            <Image
-                                alt="solid logo"
-                                src={solidSettingsData?.data?.appLogo || SolidLogo}
-                                className="relative"
-                                fill
-                            />
-                        </div>
-                    }
-                    {solidSettingsData?.data?.showAuthContent && solidSettingsData?.data?.authPagesLayout !== 'center' &&
-                        <div className="w-full" style={{ zIndex: 1 }}>
-                            <div className="grid">
-                                <div className="col-8 mx-auto">
-                                    {solidSettingsData?.data?.appSubtitle && <h1 className="solid-auth-image-subtitle m-0">{solidSettingsData?.data?.appSubtitle}</h1>}
-                                    {solidSettingsData?.data?.appTitle && <h1 className="solid-auth-image-title mt-0">{solidSettingsData?.data?.appTitle}</h1>}
-                                    {solidSettingsData?.data?.appDescription && <p className="solid-auth-image-helper-text">{solidSettingsData?.data?.appDescription}</p>}
-                                </div>
-                            </div>
-                        </div>
-                    }
+    return (
+        <div className={`solid-auth-theme-wrapper ${authLayout} auth-theme-${authTheme}`} data-auth-theme={authTheme}>
+            {!isCenter && (
+                <div className="solid-auth-split">
+                    {isLeft && formPane}
+                    {imagePane}
+                    {isRight && formPane}
                 </div>
-                {solidSettingsData?.data?.authPagesLayout === 'center' && <div className="solid-center-layout">
+            )}
+            {isCenter && <div className="solid-center-layout">
+                <div className="solid-auth-center-stack">
+                    {renderBrand("center")}
                     {authChildren}
-                </div>}
-                {solidSettingsData?.data?.authPagesLayout === 'right' &&
-                    <div className='col-12 lg:col-7 xl:col-6 flex align-items-center justify-content-center solid-login-dark-bg'>
-                        <div className="w-full">
-                            {solidSettingsData?.data?.appLogoPosition === "in_form_view" &&
-                                <div className="flex justify-content-center">
-                                    <div className={`solid-logo flex align-items-center gap-3 ${solidSettingsData?.data?.appLogoPosition}`}>
-                                        <Image
-                                            alt="solid logo"
-                                            src={solidSettingsData?.data?.appLogo || SolidLogo}
-                                            className="relative"
-                                            fill
-                                        />
-                                    </div>
-                                </div>
-                            }
-                            {authChildren}
-                        </div>
-                    </div>
-                }
-            </div>
+                </div>
+            </div>}
             {/* {solidSettingsData?.data?.showLegalLinks === true && */}
             <div className={`absolute hidden md:flex ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'solid-auth-footer flex flex-column sm:flex-row align-items-center justify-content-between' : 'solid-auth-footer-2 grid'}`}>
                 {solidSettingsData?.data?.authPagesLayout !== 'left' &&
@@ -203,7 +205,7 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
             </div >
 
             {/* } */}
-            < Dialog
+            <SolidDialog
                 visible={isRestricted}
                 onHide={handleRegistration}
                 header="Access Restricted"
@@ -211,16 +213,15 @@ export const AuthLayout = ({ children }: { children: React.ReactNode }) => {
                 className="solid-confirm-dialog "
                 footer={
                     < div className="flex align-items-center justify-content-start" >
-                        <Button label="Close" onClick={handleRegistration} size="small" />
+                        <SolidButton size="sm" onClick={handleRegistration}>Close</SolidButton>
                     </div >
                 }
-                draggable={false}
             >
-                <Divider className="m-0" />
+                <SolidDivider className="m-0" />
                 <div className="p-4">
                     <p>Sign-up is not available. Please contact the admin.</p>
                 </div>
-            </Dialog >
+            </SolidDialog >
         </div >
     )
 }

package/dist/components/auth/ForgotPasswordThankYou.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ForgotPasswordThankYou.d.ts","sourceRoot":"","sources":["../../../src/components/auth/ForgotPasswordThankYou.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,sBAAsB,+CAwBlC,CAAA"}
+{"version":3,"file":"ForgotPasswordThankYou.d.ts","sourceRoot":"","sources":["../../../src/components/auth/ForgotPasswordThankYou.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,sBAAsB,+CA0BlC,CAAA"}

package/dist/components/auth/ForgotPasswordThankYou.js

@@ -1,17 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "../common/Link";
 import { useSearchParams } from "../../hooks/useSearchParams";
 import { useLazyGetAuthSettingsQuery } from "../../redux/api/solidSettingsApi";
 import { useEffect } from "react";
+import { SolidButton } from "../shad-cn-ui";
+import { useRouter } from "../../hooks/useRouter";
 export var ForgotPasswordThankYou = function () {
     var _a;
     var _b = useLazyGetAuthSettingsQuery(), trigger = _b[0], solidSettingsData = _b[1].data;
+    var router = useRouter();
     useEffect(function () {
         trigger(""); // Fetch settings on mount
     }, [trigger]);
     var searchParams = useSearchParams();
     var email = searchParams.get('email');
     var decodedEmail = email ? decodeURIComponent(email) : '';
-    return (_jsx("div", { children: _jsxs("div", { className: "auth-container ".concat(((_a = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _a === void 0 ? void 0 : _a.authPagesLayout) === 'center' ? 'center' : 'side'), children: [_jsx("h5", { className: 'text-center font-bold', children: "We have sent an email to your registered email address" }), _jsx("p", { className: 'font-bold text-center', children: decodedEmail }), _jsx("p", { className: 'text-center', children: "Please follow the instructions in the email" }), _jsx("div", { className: 'text-center', children: _jsx(Link, { href: "/", className: 'btn', children: "Back to Home" }) })] }) }));
+    return (_jsxs("div", { className: "auth-container ".concat(((_a = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _a === void 0 ? void 0 : _a.authPagesLayout) === 'center' ? 'center' : 'side'), children: [_jsx("h2", { className: "solid-auth-title", children: "Check your inbox" }), _jsx("p", { className: "solid-auth-helper", children: "We sent reset instructions to your registered email address." }), _jsx("p", { className: "solid-auth-input-label mt-3", style: { fontWeight: 600 }, children: decodedEmail }), _jsx("p", { className: "solid-auth-helper", children: "Please follow the instructions in the email to continue." }), _jsx("div", { className: "mt-4", children: _jsx(SolidButton, { className: "w-full", onClick: function () { return router.push("/auth/login"); }, children: "Back to Sign In" }) })] }));
 };
 //# sourceMappingURL=ForgotPasswordThankYou.js.map

package/dist/components/auth/ForgotPasswordThankYou.js.map

@@ -1 +1 @@
-{"version":3,"file":"ForgotPasswordThankYou.js","sourceRoot":"","sources":["../../../src/components/auth/ForgotPasswordThankYou.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,gBAAgB,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,MAAM,CAAC,IAAM,sBAAsB,GAAG;;IAC5B,IAAA,KAAyC,2BAA2B,EAAE,EAArE,OAAO,QAAA,EAAU,iBAAiB,aAAmC,CAAA;IAE5E,SAAS,CAAC;QACN,OAAO,CAAC,EAAE,CAAC,CAAA,CAAC,0BAA0B;IAC1C,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,IAAM,KAAK,GAAG,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACxC,IAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,OAAO,CACH,wBACI,eAAK,SAAS,EAAE,yBAAkB,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,0CAAE,eAAe,MAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAE,aACzG,aAAI,SAAS,EAAC,uBAAuB,uEAA4D,EACjG,YAAG,SAAS,EAAC,uBAAuB,YAAE,YAAY,GAAK,EACvD,YAAG,SAAS,EAAC,aAAa,4DAEtB,EACJ,cAAK,SAAS,EAAC,aAAa,YACxB,KAAC,IAAI,IAAC,IAAI,EAAE,GAAG,EAAE,SAAS,EAAC,KAAK,6BAAoB,GAClD,IACJ,GACJ,CACT,CAAA;AACL,CAAC,CAAA","sourcesContent":["import Link from \"../common/Link\";\nimport { useSearchParams } from \"../../hooks/useSearchParams\";\nimport { useLazyGetAuthSettingsQuery } from \"../../redux/api/solidSettingsApi\";\nimport { useEffect } from \"react\";\n\n\nexport const ForgotPasswordThankYou = () => {\n    const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery()\n\n    useEffect(() => {\n        trigger(\"\") // Fetch settings on mount\n    }, [trigger])\n\n    const searchParams = useSearchParams();\n    const email = searchParams.get('email');\n    const decodedEmail = email ? decodeURIComponent(email) : '';\n    return (\n        <div>\n            <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`}>\n                <h5 className='text-center font-bold'>We have sent an email to your registered email address</h5>\n                <p className='font-bold text-center'>{decodedEmail}</p>\n                <p className='text-center'>\n                    Please follow the instructions in the email\n                </p>\n                <div className='text-center'>\n                    <Link href={\"/\"} className='btn'>Back to Home</Link>\n                </div>\n            </div>\n        </div>\n    )\n}\n"]}
+{"version":3,"file":"ForgotPasswordThankYou.js","sourceRoot":"","sources":["../../../src/components/auth/ForgotPasswordThankYou.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD,MAAM,CAAC,IAAM,sBAAsB,GAAG;;IAC5B,IAAA,KAAyC,2BAA2B,EAAE,EAArE,OAAO,QAAA,EAAU,iBAAiB,aAAmC,CAAA;IAC5E,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAE3B,SAAS,CAAC;QACN,OAAO,CAAC,EAAE,CAAC,CAAA,CAAC,0BAA0B;IAC1C,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,IAAM,KAAK,GAAG,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACxC,IAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,OAAO,CACH,eAAK,SAAS,EAAE,yBAAkB,CAAA,MAAA,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,0CAAE,eAAe,MAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAE,aACzG,aAAI,SAAS,EAAC,kBAAkB,iCAAsB,EACtD,YAAG,SAAS,EAAC,mBAAmB,6EAAiE,EACjG,YAAG,SAAS,EAAC,6BAA6B,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YAAG,YAAY,GAAK,EACzF,YAAG,SAAS,EAAC,mBAAmB,yEAE5B,EACJ,cAAK,SAAS,EAAC,MAAM,YACjB,KAAC,WAAW,IAAC,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,cAAM,OAAA,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,EAA1B,CAA0B,gCAE3D,GACZ,IACJ,CACT,CAAA;AACL,CAAC,CAAA","sourcesContent":["import { useSearchParams } from \"../../hooks/useSearchParams\";\nimport { useLazyGetAuthSettingsQuery } from \"../../redux/api/solidSettingsApi\";\nimport { useEffect } from \"react\";\nimport { SolidButton } from \"../shad-cn-ui\";\nimport { useRouter } from \"../../hooks/useRouter\";\n\n\nexport const ForgotPasswordThankYou = () => {\n    const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery()\n    const router = useRouter();\n\n    useEffect(() => {\n        trigger(\"\") // Fetch settings on mount\n    }, [trigger])\n\n    const searchParams = useSearchParams();\n    const email = searchParams.get('email');\n    const decodedEmail = email ? decodeURIComponent(email) : '';\n    return (\n        <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`}>\n            <h2 className=\"solid-auth-title\">Check your inbox</h2>\n            <p className=\"solid-auth-helper\">We sent reset instructions to your registered email address.</p>\n            <p className=\"solid-auth-input-label mt-3\" style={{ fontWeight: 600 }}>{decodedEmail}</p>\n            <p className=\"solid-auth-helper\">\n                Please follow the instructions in the email to continue.\n            </p>\n            <div className=\"mt-4\">\n                <SolidButton className=\"w-full\" onClick={() => router.push(\"/auth/login\")}>\n                    Back to Sign In\n                </SolidButton>\n            </div>\n        </div>\n    )\n}\n"]}

package/dist/components/auth/ForgotPasswordThankYou.tsx

@@ -1,11 +1,13 @@
-import Link from "../common/Link";
 import { useSearchParams } from "../../hooks/useSearchParams";
 import { useLazyGetAuthSettingsQuery } from "../../redux/api/solidSettingsApi";
 import { useEffect } from "react";
+import { SolidButton } from "../shad-cn-ui";
+import { useRouter } from "../../hooks/useRouter";
 
 
 export const ForgotPasswordThankYou = () => {
     const [trigger, { data: solidSettingsData }] = useLazyGetAuthSettingsQuery()
+    const router = useRouter();
 
     useEffect(() => {
         trigger("") // Fetch settings on mount
@@ -15,16 +17,17 @@ export const ForgotPasswordThankYou = () => {
     const email = searchParams.get('email');
     const decodedEmail = email ? decodeURIComponent(email) : '';
     return (
-        <div>
-            <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`}>
-                <h5 className='text-center font-bold'>We have sent an email to your registered email address</h5>
-                <p className='font-bold text-center'>{decodedEmail}</p>
-                <p className='text-center'>
-                    Please follow the instructions in the email
-                </p>
-                <div className='text-center'>
-                    <Link href={"/"} className='btn'>Back to Home</Link>
-                </div>
+        <div className={`auth-container ${solidSettingsData?.data?.authPagesLayout === 'center' ? 'center' : 'side'}`}>
+            <h2 className="solid-auth-title">Check your inbox</h2>
+            <p className="solid-auth-helper">We sent reset instructions to your registered email address.</p>
+            <p className="solid-auth-input-label mt-3" style={{ fontWeight: 600 }}>{decodedEmail}</p>
+            <p className="solid-auth-helper">
+                Please follow the instructions in the email to continue.
+            </p>
+            <div className="mt-4">
+                <SolidButton className="w-full" onClick={() => router.push("/auth/login")}>
+                    Back to Sign In
+                </SolidButton>
             </div>
         </div>
     )

package/dist/components/auth/GoogleAuthChecking.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GoogleAuthChecking.d.ts","sourceRoot":"","sources":["../../../src/components/auth/GoogleAuthChecking.tsx"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB,+CAgD9B,CAAA"}
+{"version":3,"file":"GoogleAuthChecking.d.ts","sourceRoot":"","sources":["../../../src/components/auth/GoogleAuthChecking.tsx"],"names":[],"mappings":"AAYA,eAAO,MAAM,kBAAkB,+CAiD9B,CAAA"}

package/dist/components/auth/GoogleAuthChecking.js

@@ -39,11 +39,13 @@ import { ERROR_MESSAGES } from '../../constants/error-messages';
 import { signInWithOAuthAccessCode } from "../../adapters/auth/index";
 import { useRouter } from "../../hooks/useRouter";
 import { useSearchParams } from "../../hooks/useSearchParams";
-import { ProgressSpinner } from 'primereact/progressspinner';
 import { useEffect, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { env } from "../../adapters/env";
 import { showToast } from "../../redux/features/toastSlice";
+import { loadSession } from "../../adapters/auth/storage";
+import { hasAnyRole } from "../../helpers/rolesHelper";
+import { SolidSpinner } from "../shad-cn-ui";
 export var GoogleAuthChecking = function () {
     var searchParams = useSearchParams();
     var accessCode = searchParams.get("accessCode");
@@ -52,37 +54,40 @@ export var GoogleAuthChecking = function () {
     var dispatch = useDispatch();
     useEffect(function () {
         var handleOAuthAuthentication = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var response, redirectUrl, err_1;
-            var _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
+            var response, session, isAdmin, isDev, redirectUrl, err_1;
+            var _a, _b;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
                     case 0:
                         if (!accessCode) {
                             dispatch(showToast({ severity: "error", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: ERROR_MESSAGES.AUTHENICATION__FAILED }));
                             setError(ERROR_MESSAGES.AUTHENICATION__FAILED);
                             return [2 /*return*/];
                         }
-                        _b.label = 1;
+                        _c.label = 1;
                     case 1:
-                        _b.trys.push([1, 3, , 4]);
+                        _c.trys.push([1, 3, , 4]);
                         return [4 /*yield*/, signInWithOAuthAccessCode({
                                 accessCode: accessCode,
                             })];
                     case 2:
-                        response = _b.sent();
+                        response = _c.sent();
                         if (response === null || response === void 0 ? void 0 : response.error) {
                             dispatch(showToast({ severity: "error", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: response.error }));
                             setError(ERROR_MESSAGES.AUTHENICATION__FAILED);
                         }
                         else {
                             dispatch(showToast({ severity: "success", summary: ERROR_MESSAGES.LOGIN_SUCCESS, detail: ERROR_MESSAGES.DASHBOARD_REDIRECTING }));
-                            redirectUrl = env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin";
+                            session = loadSession();
+                            isAdmin = hasAnyRole((_a = session === null || session === void 0 ? void 0 : session.user) === null || _a === void 0 ? void 0 : _a.roles, ["Admin"]);
+                            isDev = env("VITE_SOLIDX_ENV") === "dev";
+                            redirectUrl = isAdmin && isDev ? "/studio" : (env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin");
                             router.push(redirectUrl);
                         }
                         return [3 /*break*/, 4];
                     case 3:
-                        err_1 = _b.sent();
-                        dispatch(showToast({ severity: "error", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: ((_a = err_1 === null || err_1 === void 0 ? void 0 : err_1.data) === null || _a === void 0 ? void 0 : _a.message) || ERROR_MESSAGES.AUTHENICATION__FAILED }));
+                        err_1 = _c.sent();
+                        dispatch(showToast({ severity: "error", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: ((_b = err_1 === null || err_1 === void 0 ? void 0 : err_1.data) === null || _b === void 0 ? void 0 : _b.message) || ERROR_MESSAGES.AUTHENICATION__FAILED }));
                         return [3 /*break*/, 4];
                     case 4: return [2 /*return*/];
                 }
@@ -93,6 +98,6 @@ export var GoogleAuthChecking = function () {
     if (error) {
         return (_jsx("div", { className: "flex items-center justify-center min-h-screen", children: _jsx("h2", { className: "text-red-500 text-xl font-semibold", children: error }) }));
     }
-    return (_jsx("div", { children: _jsx(ProgressSpinner, {}) }));
+    return (_jsx(SolidSpinner, { className: "flex items-center justify-center min-h-screen" }));
 };
 //# sourceMappingURL=GoogleAuthChecking.js.map

package/dist/components/auth/GoogleAuthChecking.js.map

@@ -1 +1 @@
-{"version":3,"file":"GoogleAuthChecking.js","sourceRoot":"","sources":["../../../src/components/auth/GoogleAuthChecking.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAC9B,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,IAAM,UAAU,GAAG,YAAY,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;IAElD,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IACrB,IAAA,KAAoB,QAAQ,CAAgB,IAAI,CAAC,EAAhD,KAAK,QAAA,EAAE,QAAQ,QAAiC,CAAC;IACxD,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,SAAS,CAAC;QACN,IAAM,yBAAyB,GAAG;;;;;;wBAC9B,IAAI,CAAC,UAAU,EAAE;4BACb,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,WAAW,EAAE,MAAM,EAAE,cAAc,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC;4BAC9H,QAAQ,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAC;4BAC/C,sBAAO;yBACV;;;;wBAGoB,qBAAM,yBAAyB,CAAC;gCAC7C,UAAU,EAAE,UAAU;6BACzB,CAAC,EAAA;;wBAFI,QAAQ,GAAG,SAEf;wBAEF,IAAI,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,EAAE;4BACjB,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;4BACxG,QAAQ,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAA;yBACjD;6BAAM;4BACH,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,CAAC,aAAa,EAAE,MAAM,EAAE,cAAc,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC;4BAC5H,WAAW,GAAG,GAAG,CAAC,gCAAgC,CAAC,IAAI,QAAQ,CAAC;4BACtE,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;yBAC5B;;;;wBAED,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,WAAW,EAAE,MAAM,EAAE,CAAA,MAAA,KAAG,aAAH,KAAG,uBAAH,KAAG,CAAE,IAAI,0CAAE,OAAO,KAAI,cAAc,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC;;;;;aAE3J,CAAC;QAEF,yBAAyB,EAAE,CAAC;IAChC,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC;IAEzB,IAAI,KAAK,EAAE;QACP,OAAO,CACH,cAAK,SAAS,EAAC,+CAA+C,YAC1D,aAAI,SAAS,EAAC,oCAAoC,YAAE,KAAK,GAAM,GAC7D,CACT,CAAC;KACL;IACD,OAAO,CACH,wBACI,KAAC,eAAe,KAAG,GACjB,CACT,CAAA;AACL,CAAC,CAAA","sourcesContent":["import { ERROR_MESSAGES } from '../../constants/error-messages';\nimport { signInWithOAuthAccessCode } from \"../../adapters/auth/index\";\nimport { useRouter } from \"../../hooks/useRouter\";\nimport { useSearchParams } from \"../../hooks/useSearchParams\";\nimport { ProgressSpinner } from 'primereact/progressspinner';\nimport { useEffect, useState } from 'react'\nimport { useDispatch } from 'react-redux';\nimport { env } from \"../../adapters/env\";\nimport { showToast } from \"../../redux/features/toastSlice\";\n\nexport const GoogleAuthChecking = () => {\n    const searchParams = useSearchParams();\n    const accessCode = searchParams.get(\"accessCode\");\n\n    const router = useRouter();\n    const [error, setError] = useState<string | null>(null);\n    const dispatch = useDispatch();\n    useEffect(() => {\n        const handleOAuthAuthentication = async () => {\n            if (!accessCode) {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: ERROR_MESSAGES.AUTHENICATION__FAILED }));\n                setError(ERROR_MESSAGES.AUTHENICATION__FAILED);\n                return;\n            }\n\n            try {\n                const response = await signInWithOAuthAccessCode({\n                    accessCode: accessCode,\n                });\n\n                if (response?.error) {\n                    dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: response.error }));\n                    setError(ERROR_MESSAGES.AUTHENICATION__FAILED)\n                } else {\n                    dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.LOGIN_SUCCESS, detail: ERROR_MESSAGES.DASHBOARD_REDIRECTING }));\n                    const redirectUrl = env(\"NEXT_PUBLIC_LOGIN_REDIRECT_URL\") || \"/admin\";\n                    router.push(redirectUrl);\n                }\n            } catch (err: any) {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: err?.data?.message || ERROR_MESSAGES.AUTHENICATION__FAILED }));\n            }\n        };\n\n        handleOAuthAuthentication();\n    }, [accessCode, router]);\n\n    if (error) {\n        return (\n            <div className=\"flex items-center justify-center min-h-screen\">\n                <h2 className=\"text-red-500 text-xl font-semibold\">{error}</h2>\n            </div>\n        );\n    }\n    return (\n        <div>\n            <ProgressSpinner />\n        </div>\n    )\n}\n"]}
+{"version":3,"file":"GoogleAuthChecking.js","sourceRoot":"","sources":["../../../src/components/auth/GoogleAuthChecking.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ERROR_MESSAGES } from '../../constants/error-messages';\nimport { signInWithOAuthAccessCode } from \"../../adapters/auth/index\";\nimport { useRouter } from \"../../hooks/useRouter\";\nimport { useSearchParams } from \"../../hooks/useSearchParams\";\nimport { useEffect, useState } from 'react'\nimport { useDispatch } from 'react-redux';\nimport { env } from \"../../adapters/env\";\nimport { showToast } from \"../../redux/features/toastSlice\";\nimport { loadSession } from \"../../adapters/auth/storage\";\nimport { hasAnyRole } from \"../../helpers/rolesHelper\";\nimport { SolidSpinner } from \"../shad-cn-ui\";\n\nexport const GoogleAuthChecking = () => {\n    const searchParams = useSearchParams();\n    const accessCode = searchParams.get(\"accessCode\");\n\n    const router = useRouter();\n    const [error, setError] = useState<string | null>(null);\n    const dispatch = useDispatch();\n    useEffect(() => {\n        const handleOAuthAuthentication = async () => {\n            if (!accessCode) {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: ERROR_MESSAGES.AUTHENICATION__FAILED }));\n                setError(ERROR_MESSAGES.AUTHENICATION__FAILED);\n                return;\n            }\n\n            try {\n                const response = await signInWithOAuthAccessCode({\n                    accessCode: accessCode,\n                });\n\n                if (response?.error) {\n                    dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: response.error }));\n                    setError(ERROR_MESSAGES.AUTHENICATION__FAILED)\n                } else {\n                    dispatch(showToast({ severity: \"success\", summary: ERROR_MESSAGES.LOGIN_SUCCESS, detail: ERROR_MESSAGES.DASHBOARD_REDIRECTING }));\n                    const session = loadSession();\n                    const isAdmin = hasAnyRole(session?.user?.roles, [\"Admin\"]);\n                    const isDev = env(\"VITE_SOLIDX_ENV\") === \"dev\";\n                    const redirectUrl = isAdmin && isDev ? \"/studio\" : (env(\"NEXT_PUBLIC_LOGIN_REDIRECT_URL\") || \"/admin\");\n                    router.push(redirectUrl);\n                }\n            } catch (err: any) {\n                dispatch(showToast({ severity: \"error\", summary: ERROR_MESSAGES.LOGIN_ERROR, detail: err?.data?.message || ERROR_MESSAGES.AUTHENICATION__FAILED }));\n            }\n        };\n\n        handleOAuthAuthentication();\n    }, [accessCode, router]);\n\n    if (error) {\n        return (\n            <div className=\"flex items-center justify-center min-h-screen\">\n                <h2 className=\"text-red-500 text-xl font-semibold\">{error}</h2>\n            </div>\n        );\n    }\n    return (\n        <SolidSpinner className=\"flex items-center justify-center min-h-screen\" />\n    )\n}\n"]}

package/dist/components/auth/GoogleAuthChecking.tsx

@@ -2,11 +2,13 @@ import { ERROR_MESSAGES } from '../../constants/error-messages';
 import { signInWithOAuthAccessCode } from "../../adapters/auth/index";
 import { useRouter } from "../../hooks/useRouter";
 import { useSearchParams } from "../../hooks/useSearchParams";
-import { ProgressSpinner } from 'primereact/progressspinner';
 import { useEffect, useState } from 'react'
 import { useDispatch } from 'react-redux';
 import { env } from "../../adapters/env";
 import { showToast } from "../../redux/features/toastSlice";
+import { loadSession } from "../../adapters/auth/storage";
+import { hasAnyRole } from "../../helpers/rolesHelper";
+import { SolidSpinner } from "../shad-cn-ui";
 
 export const GoogleAuthChecking = () => {
     const searchParams = useSearchParams();
@@ -33,7 +35,10 @@ export const GoogleAuthChecking = () => {
                     setError(ERROR_MESSAGES.AUTHENICATION__FAILED)
                 } else {
                     dispatch(showToast({ severity: "success", summary: ERROR_MESSAGES.LOGIN_SUCCESS, detail: ERROR_MESSAGES.DASHBOARD_REDIRECTING }));
-                    const redirectUrl = env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin";
+                    const session = loadSession();
+                    const isAdmin = hasAnyRole(session?.user?.roles, ["Admin"]);
+                    const isDev = env("VITE_SOLIDX_ENV") === "dev";
+                    const redirectUrl = isAdmin && isDev ? "/studio" : (env("NEXT_PUBLIC_LOGIN_REDIRECT_URL") || "/admin");
                     router.push(redirectUrl);
                 }
             } catch (err: any) {
@@ -52,8 +57,6 @@ export const GoogleAuthChecking = () => {
         );
     }
     return (
-        <div>
-            <ProgressSpinner />
-        </div>
+        <SolidSpinner className="flex items-center justify-center min-h-screen" />
     )
 }

package/dist/components/auth/SolidChangeForcePassword.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidChangeForcePassword.d.ts","sourceRoot":"","sources":["../../../src/components/auth/SolidChangeForcePassword.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,wBAAwB,+CAmM7B,CAAA;AACD,eAAe,wBAAwB,CAAA"}
+{"version":3,"file":"SolidChangeForcePassword.d.ts","sourceRoot":"","sources":["../../../src/components/auth/SolidChangeForcePassword.tsx"],"names":[],"mappings":"AAWA,QAAA,MAAM,wBAAwB,+CA4M7B,CAAA;AACD,eAAe,wBAAwB,CAAA"}

package/dist/components/auth/SolidChangeForcePassword.js

@@ -40,13 +40,11 @@ import { useChangePasswordMutation } from '../../redux/api/authApi';
 import { useFormik } from 'formik';
 import { signOut } from "../../adapters/auth/index";
 import { useSession } from "../../hooks/useSession";
-import { Button } from 'primereact/button';
-import { Message } from 'primereact/message';
-import { Password } from 'primereact/password';
 import { useDispatch } from 'react-redux';
 import * as Yup from 'yup';
 import { env } from "../../adapters/env";
 import { showToast } from "../../redux/features/toastSlice";
+import { SolidButton, SolidMessage, SolidPasswordInput } from "../shad-cn-ui";
 var SolidChangeForcePassword = function () {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     var dispatch = useDispatch();
@@ -152,9 +150,9 @@ var SolidChangeForcePassword = function () {
             policy: "One special character(!, @, #, $)"
         },
     ];
-    return (_jsx(_Fragment, { children: _jsxs("form", { onSubmit: formik.handleSubmit, className: 'd-flex flex-column gap-3 auth-form', children: [_jsxs("div", { className: "flex flex-column gap-2 mt-2", style: {}, children: [_jsx("label", { htmlFor: "currentPassword", className: "solid-auth-input-label", children: "Current Password" }), _jsx(Password, { id: "currentPassword", name: "currentPassword", value: formik.values.currentPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggleMask: true, invalid: !!formik.errors.currentPassword, inputClassName: "w-full", feedback: false }), isFormFieldValid(formik, "currentPassword") && _jsx(Message, { className: "text-red-500 text-sm", severity: "error", text: (_f = (_e = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _e === void 0 ? void 0 : _e.currentPassword) === null || _f === void 0 ? void 0 : _f.toString() })] }), _jsxs("div", { className: "flex flex-column gap-2 mt-1 sm:mt-2 md:mt-3 lg:mt-4", style: {}, children: [_jsx("label", { htmlFor: "password", className: "solid-auth-input-label", children: "New Password" }), _jsx(Password, { id: "newPassword", name: "newPassword", value: formik.values.newPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggleMask: true, invalid: !!formik.errors.newPassword, inputClassName: "w-full", feedback: false }), isFormFieldValid(formik, "newPassword") && _jsx(Message, { className: "text-red-500 text-sm", severity: "error", text: (_h = (_g = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _g === void 0 ? void 0 : _g.newPassword) === null || _h === void 0 ? void 0 : _h.toString() })] }), _jsxs("div", { className: "flex flex-column gap-2 mt-1 sm:mt-2 md:mt-3 lg:mt-4", style: {}, children: [_jsx("label", { htmlFor: "password", className: "solid-auth-input-label", children: "Confirm Password" }), _jsx(Password, { id: "confirmPassword", name: "confirmPassword", value: formik.values.confirmPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggleMask: true, invalid: !!formik.errors.confirmPassword, inputClassName: "w-full", feedback: false }), isFormFieldValid(formik, "confirmPassword") && _jsx(Message, { className: "text-red-500 text-sm", severity: "error", text: (_k = (_j = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _j === void 0 ? void 0 : _j.confirmPassword) === null || _k === void 0 ? void 0 : _k.toString() })] }), envPasswordHelperText && (_jsx("div", { className: "mt-4", children: _jsx("div", { className: "grid", children: envPasswordHelperText
+    return (_jsx(_Fragment, { children: _jsxs("form", { onSubmit: formik.handleSubmit, className: 'd-flex flex-column gap-3 auth-form', children: [_jsxs("div", { className: "flex flex-column gap-2 mt-2", style: {}, children: [_jsx("label", { htmlFor: "currentPassword", className: "solid-auth-input-label", children: "Current Password" }), _jsx(SolidPasswordInput, { id: "currentPassword", name: "currentPassword", value: formik.values.currentPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggle: true, "aria-invalid": !!formik.errors.currentPassword, className: "w-full" }), isFormFieldValid(formik, "currentPassword") && (_jsx(SolidMessage, { className: "text-red-500 text-sm", severity: "error", text: (_f = (_e = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _e === void 0 ? void 0 : _e.currentPassword) === null || _f === void 0 ? void 0 : _f.toString() }))] }), _jsxs("div", { className: "flex flex-column gap-2 mt-1 sm:mt-2 md:mt-3 lg:mt-4", style: {}, children: [_jsx("label", { htmlFor: "password", className: "solid-auth-input-label", children: "New Password" }), _jsx(SolidPasswordInput, { id: "newPassword", name: "newPassword", value: formik.values.newPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggle: true, "aria-invalid": !!formik.errors.newPassword, className: "w-full" }), isFormFieldValid(formik, "newPassword") && (_jsx(SolidMessage, { className: "text-red-500 text-sm", severity: "error", text: (_h = (_g = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _g === void 0 ? void 0 : _g.newPassword) === null || _h === void 0 ? void 0 : _h.toString() }))] }), _jsxs("div", { className: "flex flex-column gap-2 mt-1 sm:mt-2 md:mt-3 lg:mt-4", style: {}, children: [_jsx("label", { htmlFor: "password", className: "solid-auth-input-label", children: "Confirm Password" }), _jsx(SolidPasswordInput, { id: "confirmPassword", name: "confirmPassword", value: formik.values.confirmPassword, onChange: formik.handleChange, onBlur: formik.handleBlur, toggle: true, "aria-invalid": !!formik.errors.confirmPassword, className: "w-full" }), isFormFieldValid(formik, "confirmPassword") && (_jsx(SolidMessage, { className: "text-red-500 text-sm", severity: "error", text: (_k = (_j = formik === null || formik === void 0 ? void 0 : formik.errors) === null || _j === void 0 ? void 0 : _j.confirmPassword) === null || _k === void 0 ? void 0 : _k.toString() }))] }), envPasswordHelperText && (_jsx("div", { className: "mt-4", children: _jsx("div", { className: "grid", children: envPasswordHelperText
                             .split('\\n')
-                            .map(function (text, idx) { return (_jsx("div", { className: "col-6 pt-0", children: _jsxs("div", { className: 'flex gap-2', children: [_jsx("span", { children: "\u2022" }), _jsx("span", { children: text })] }) }, idx)); }) }) })), _jsx("div", { className: "mt-4", children: _jsx(Button, { className: "w-full font-light auth-submit-button", label: "Change Password", disabled: formik.isSubmitting, loading: formik.isSubmitting }) })] }) }));
+                            .map(function (text, idx) { return (_jsx("div", { className: "col-6 pt-0", children: _jsxs("div", { className: 'flex gap-2', children: [_jsx("span", { children: "\u2022" }), _jsx("span", { children: text })] }) }, idx)); }) }) })), _jsx("div", { className: "mt-4", children: _jsx(SolidButton, { type: "submit", className: "w-full font-light auth-submit-button", label: "Change Password", disabled: formik.isSubmitting, loading: formik.isSubmitting }) })] }) }));
 };
 export default SolidChangeForcePassword;
 //# sourceMappingURL=SolidChangeForcePassword.js.map