@inf-monkeys-tech/monkeys-design 0.4.38 → 0.4.39

package/dist/index.mjs

@@ -20360,6 +20360,12 @@ var createBackgroundImage = (gradient, imageUrl) => {
 };
 var normalizeLogoPosition = (position) => position && LOGIN_LOGO_POSITIONS.includes(position) ? position : "bottom";
 var normalizeLogoScale = (scale) => typeof scale === "number" && Number.isFinite(scale) && scale > 0 ? scale : void 0;
+var resolveLogoUrls = (logo) => {
+  const url = normalizeCssValue(logo?.url);
+  const lightUrl = normalizeCssValue(logo?.lightUrl) || url;
+  const darkUrl = normalizeCssValue(logo?.darkUrl) || url || lightUrl;
+  return { lightUrl, darkUrl };
+};
 function LoginPage({
   className,
   style,
@@ -20389,6 +20395,9 @@ function LoginPage({
   const backgroundMode = backgroundImage ? "custom" : "default";
   const logoPosition = normalizeLogoPosition(logo?.position);
   const logoScale = normalizeLogoScale(logo?.scale);
+  const { lightUrl: logoLightUrl, darkUrl: logoDarkUrl } = resolveLogoUrls(logo);
+  const hasLogo = Boolean(logoLightUrl || logoDarkUrl);
+  const usesSeparateModeLogos = Boolean(logoLightUrl && logoDarkUrl && logoLightUrl !== logoDarkUrl);
   useEffect(() => {
     if (!availableMethods.length) {
       setInternalMethodId(void 0);
@@ -20451,19 +20460,42 @@ function LoginPage({
           }
         ),
         toolbar ? /* @__PURE__ */ jsx("div", { className: "login-page__toolbar", "data-login-part": "toolbar", children: toolbar }) : null,
-        logo?.url ? /* @__PURE__ */ jsx(
+        hasLogo ? /* @__PURE__ */ jsx(
           "div",
           {
             className: `login-page__logo login-page__logo--${logoPosition}`,
             "data-login-part": "logo",
             "data-logo-position": logoPosition,
-            children: /* @__PURE__ */ jsx(
+            children: usesSeparateModeLogos ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  className: "login-page__logo-image login-page__logo-image--light",
+                  "data-login-part": "logo-image",
+                  "data-login-logo-mode": "light",
+                  src: logoLightUrl,
+                  alt: logo?.alt ?? "",
+                  style: logoScale ? { transform: `scale(${logoScale})` } : void 0
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "img",
+                {
+                  className: "login-page__logo-image login-page__logo-image--dark",
+                  "data-login-part": "logo-image",
+                  "data-login-logo-mode": "dark",
+                  src: logoDarkUrl,
+                  alt: logo?.alt ?? "",
+                  style: logoScale ? { transform: `scale(${logoScale})` } : void 0
+                }
+              )
+            ] }) : /* @__PURE__ */ jsx(
               "img",
               {
                 className: "login-page__logo-image",
                 "data-login-part": "logo-image",
-                src: logo.url,
-                alt: logo.alt ?? "",
+                src: logoLightUrl || logoDarkUrl,
+                alt: logo?.alt ?? "",
                 style: logoScale ? { transform: `scale(${logoScale})` } : void 0
               }
             )