@redacto.io/consent-sdk-react 10.0.0-beta.8 → 10.0.0-beta.9

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @redacto.io/consent-sdk-react
 
+## 10.0.0-beta.9
+
+### Patch Changes
+
+- e44b1a3: Privacy Center: fix the DSAR request form showing "No products available" against the legacy Python backend. The request-form product picker is now sourced from `user-consents` on **both** backends — the Go ledger's `/public/.../user-consents` when `ledgerBaseUrl` is configured, Python's `/dsar/privacy-center/user-consents` otherwise (the same read the Manage Consent view already used in both modes) — instead of being skipped entirely without a ledger, which left the picker dependent on `form/data` product groups that Python no longer emits.
+
+  Two related gaps are closed: a successful-but-empty `user-consents` response no longer overwrites the product groups `form/data` did supply, and a backend that returns only the legacy flat `purposes` list now renders those purposes under a single "Your data" group instead of the empty state. Cases raised from that fallback group are submitted without a `product_uuid` anchor, matching the pre-grouping org-level case shape.
+
+- source Privacy Center DSAR product picker from user-consents on both backends
+
 ## 10.0.0-beta.8
 
 ### Patch Changes

package/dist/{chunk-6A665OPR.mjs → chunk-OGL6OC3A.mjs}

@@ -25,6 +25,10 @@ var useMediaQuery = (query) => {
   return matches;
 };
 
+// src/shared/sandbox.ts
+var SANDBOX_TOKEN_HEADER = "X-Consent-Token";
+
 export {
+  SANDBOX_TOKEN_HEADER,
   useMediaQuery
 };

package/dist/index.d.mts

@@ -43,8 +43,34 @@ type DigiLockerCallbackProps = {
 
 type Props$1 = Readonly<{
     noticeId: string;
-    accessToken: string;
-    refreshToken: string;
+    /**
+     * JWT access token. Optional so sandbox integrations (see `token`) can
+     * omit it. Required in the normal JWT flow.
+     */
+    accessToken?: string;
+    /** JWT refresh token. Optional; accepted for source-compat, currently unused. */
+    refreshToken?: string;
+    /**
+     * Sandbox PoC: a pasted static token. When set, the SDK runs against the
+     * sandbox with no JWT — it sends the single `X-Consent-Token` header, carries
+     * the acting identity (`email` || `mobile`) in each request's own payload,
+     * takes org/workspace from `organisationUuid`/`workspaceUuid`, and does no
+     * token refresh.
+     */
+    token?: string;
+    /** Sandbox test subject email (carried in the request payload when set). */
+    email?: string;
+    /** Sandbox test subject mobile (fallback subject when `email` is absent). */
+    mobile?: string;
+    /**
+     * Sandbox UCIC: the client's own user id / org_user_id, e.g. a UUID or
+     * customer code; optional third identifier alongside email/mobile.
+     */
+    ucic?: string;
+    /** Sandbox org UUID (replaces the JWT-decoded org in sandbox mode). */
+    organisationUuid?: string;
+    /** Sandbox workspace UUID (replaces the JWT-decoded workspace in sandbox mode). */
+    workspaceUuid?: string;
     baseUrl?: string;
     ledgerBaseUrl?: string;
     settings?: Partial<Settings$1>;
@@ -76,7 +102,7 @@ type Props$1 = Readonly<{
  * to view and manage their consent preferences. Supports both initial consent
  * collection and reconsent flows.
  */
-declare const RedactoNoticeConsent: ({ noticeId, accessToken, refreshToken, baseUrl, ledgerBaseUrl, language, blockUI, onAccept, onDecline, onError, settings, applicationId, validateAgainst, digilockerMode, digilockerCallbackUrl, includeFullyConsentedData, reviewModeButtonText, }: Props$1) => react__default.JSX.Element;
+declare const RedactoNoticeConsent: ({ noticeId, accessToken, refreshToken, token, email, mobile, ucic, organisationUuid, workspaceUuid, baseUrl, ledgerBaseUrl, language, blockUI, onAccept, onDecline, onError, settings, applicationId, validateAgainst, digilockerMode, digilockerCallbackUrl, includeFullyConsentedData, reviewModeButtonText, }: Props$1) => react__default.JSX.Element;
 
 type Settings = {
     button: {

package/dist/index.d.ts

@@ -43,8 +43,34 @@ type DigiLockerCallbackProps = {
 
 type Props$1 = Readonly<{
     noticeId: string;
-    accessToken: string;
-    refreshToken: string;
+    /**
+     * JWT access token. Optional so sandbox integrations (see `token`) can
+     * omit it. Required in the normal JWT flow.
+     */
+    accessToken?: string;
+    /** JWT refresh token. Optional; accepted for source-compat, currently unused. */
+    refreshToken?: string;
+    /**
+     * Sandbox PoC: a pasted static token. When set, the SDK runs against the
+     * sandbox with no JWT — it sends the single `X-Consent-Token` header, carries
+     * the acting identity (`email` || `mobile`) in each request's own payload,
+     * takes org/workspace from `organisationUuid`/`workspaceUuid`, and does no
+     * token refresh.
+     */
+    token?: string;
+    /** Sandbox test subject email (carried in the request payload when set). */
+    email?: string;
+    /** Sandbox test subject mobile (fallback subject when `email` is absent). */
+    mobile?: string;
+    /**
+     * Sandbox UCIC: the client's own user id / org_user_id, e.g. a UUID or
+     * customer code; optional third identifier alongside email/mobile.
+     */
+    ucic?: string;
+    /** Sandbox org UUID (replaces the JWT-decoded org in sandbox mode). */
+    organisationUuid?: string;
+    /** Sandbox workspace UUID (replaces the JWT-decoded workspace in sandbox mode). */
+    workspaceUuid?: string;
     baseUrl?: string;
     ledgerBaseUrl?: string;
     settings?: Partial<Settings$1>;
@@ -76,7 +102,7 @@ type Props$1 = Readonly<{
  * to view and manage their consent preferences. Supports both initial consent
  * collection and reconsent flows.
  */
-declare const RedactoNoticeConsent: ({ noticeId, accessToken, refreshToken, baseUrl, ledgerBaseUrl, language, blockUI, onAccept, onDecline, onError, settings, applicationId, validateAgainst, digilockerMode, digilockerCallbackUrl, includeFullyConsentedData, reviewModeButtonText, }: Props$1) => react__default.JSX.Element;
+declare const RedactoNoticeConsent: ({ noticeId, accessToken, refreshToken, token, email, mobile, ucic, organisationUuid, workspaceUuid, baseUrl, ledgerBaseUrl, language, blockUI, onAccept, onDecline, onError, settings, applicationId, validateAgainst, digilockerMode, digilockerCallbackUrl, includeFullyConsentedData, reviewModeButtonText, }: Props$1) => react__default.JSX.Element;
 
 type Settings = {
     button: {

package/dist/index.js

@@ -92,6 +92,67 @@ async function parseApiError(response, fallbackMessage) {
   });
 }
 
+// src/shared/sandbox.ts
+var SANDBOX_TOKEN_HEADER = "X-Consent-Token";
+
+// src/RedactoNoticeConsent/api/sandbox.ts
+var resolveSandboxAuth = (params) => {
+  var _a, _b, _c, _d, _e;
+  const token = (_a = params.token) == null ? void 0 : _a.trim();
+  if (!token) {
+    return null;
+  }
+  const organisationUuid = (_b = params.organisationUuid) == null ? void 0 : _b.trim();
+  const workspaceUuid = (_c = params.workspaceUuid) == null ? void 0 : _c.trim();
+  const ucic = (_d = params.sandboxUcic) == null ? void 0 : _d.trim();
+  const subject = (_e = params.sandboxSubject) == null ? void 0 : _e.trim();
+  if (!organisationUuid || !workspaceUuid) {
+    throw new Error(
+      "Sandbox mode requires organisationUuid and workspaceUuid props"
+    );
+  }
+  if (!ucic && !subject) {
+    throw new Error("Sandbox mode requires a UCIC, email, or mobile");
+  }
+  return { token, ucic, subject: subject != null ? subject : "", organisationUuid, workspaceUuid };
+};
+var resolveRequestAuth = (accessToken, sandboxParams, decodeTokenSafely2) => {
+  const sandbox = resolveSandboxAuth(sandboxParams);
+  if (sandbox) {
+    return {
+      organisationUuid: sandbox.organisationUuid,
+      workspaceUuid: sandbox.workspaceUuid,
+      sandbox
+    };
+  }
+  const decodedToken = accessToken ? decodeTokenSafely2(accessToken) : null;
+  if (!decodedToken) {
+    throw new Error("Invalid access token");
+  }
+  const { organisation_uuid, workspace_uuid } = decodedToken;
+  if (!organisation_uuid || !workspace_uuid) {
+    throw new Error("Invalid token: missing organization or workspace UUID");
+  }
+  return {
+    organisationUuid: organisation_uuid,
+    workspaceUuid: workspace_uuid,
+    sandbox: null
+  };
+};
+var buildAuthHeaders = (accessToken, sandbox) => {
+  if (sandbox) {
+    return { [SANDBOX_TOKEN_HEADER]: sandbox.token };
+  }
+  return { Authorization: `Bearer ${accessToken}` };
+};
+var sandboxBodyIdentity = (sandbox) => {
+  if (sandbox.ucic) {
+    return { org_user_id: sandbox.ucic };
+  }
+  return sandbox.subject.includes("@") ? { primary_email: sandbox.subject } : { primary_mobile: sandbox.subject };
+};
+var sandboxQueryIdentity = (sandbox) => sandboxBodyIdentity(sandbox);
+
 // src/shared/notice-consent-status.ts
 var import_jwt_decode = require("jwt-decode");
 var decodeNoticeConsentToken = (token) => {
@@ -205,21 +266,19 @@ var fetchConsentContent = async ({
   specific_uuid,
   validate_against = "all",
   include_fully_consented_data = false,
-  signal
+  signal,
+  ...sandboxParams
 }) => {
-  if (!noticeId || !accessToken || !validate_against) {
-    throw new Error("noticeId and accessToken are required");
-  }
-  const decodedToken = decodeTokenSafely(accessToken);
-  if (!decodedToken) {
-    throw new Error("Invalid access token");
+  if (!noticeId || !validate_against) {
+    throw new Error("noticeId is required");
   }
-  const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
-  if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
-    throw new Error("Invalid token: missing organization or workspace UUID");
+  if (!accessToken && !sandboxParams.token) {
+    throw new Error("accessToken or token is required");
   }
+  const { organisationUuid: ORGANISATION_UUID, workspaceUuid: WORKSPACE_UUID, sandbox } = resolveRequestAuth(accessToken, sandboxParams, decodeTokenSafely);
   const apiBaseUrl = baseUrl || BASE_URL;
-  const cacheKey = `${accessToken}-${noticeId}-${validate_against}-${language}-${specific_uuid || ""}-${include_fully_consented_data}`;
+  const cacheIdentity = sandbox ? `sandbox:${sandbox.organisationUuid}:${sandbox.workspaceUuid}:${sandbox.ucic || sandbox.subject}` : accessToken;
+  const cacheKey = `${cacheIdentity}-${noticeId}-${validate_against}-${language}-${specific_uuid || ""}-${include_fully_consented_data}`;
   if (validate_against === "all" && !specific_uuid) {
     const cachedData = getCachedData(cacheKey);
     if (cachedData) {
@@ -236,10 +295,15 @@ var fetchConsentContent = async ({
   if (include_fully_consented_data) {
     url.searchParams.append("include_fully_consented_data", "true");
   }
+  if (sandbox) {
+    for (const [key, value] of Object.entries(sandboxQueryIdentity(sandbox))) {
+      url.searchParams.append(key, value);
+    }
+  }
   const response = await fetch(url.toString(), {
     method: "GET",
     headers: {
-      Authorization: `Bearer ${accessToken}`,
+      ...buildAuthHeaders(accessToken, sandbox),
       "Accept-Language": language
     },
     signal
@@ -267,20 +331,17 @@ var submitConsentEvent = async ({
   meta_data,
   guardianVerificationReference,
   selfDeclaredAdult,
-  signal
+  signal,
+  ...sandboxParams
 }) => {
-  if (!noticeUuid || !accessToken || !Array.isArray(purposes)) {
-    throw new Error("noticeUuid, accessToken, and purposes array are required");
+  if (!noticeUuid || !Array.isArray(purposes)) {
+    throw new Error("noticeUuid and purposes array are required");
   }
-  const decodedToken = decodeTokenSafely(accessToken);
-  if (!decodedToken) {
-    throw new Error("Invalid access token");
+  if (!accessToken && !sandboxParams.token) {
+    throw new Error("accessToken or token is required");
   }
-  const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
-  if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
-    throw new Error("Invalid token: missing organization or workspace UUID");
-  }
-  const apiBaseUrl = ledgerBaseUrl || baseUrl || BASE_URL;
+  const { organisationUuid: ORGANISATION_UUID, workspaceUuid: WORKSPACE_UUID, sandbox } = resolveRequestAuth(accessToken, sandboxParams, decodeTokenSafely);
+  const apiBaseUrl = (sandbox ? null : ledgerBaseUrl) || baseUrl || BASE_URL;
   const validatedPurposes = purposes.map((purpose) => {
     if (!purpose.uuid) {
       throw new Error(`Invalid purpose data: missing uuid`);
@@ -306,15 +367,16 @@ var submitConsentEvent = async ({
     guardian_verification_reference: guardianVerificationReference,
     self_declared_adult: selfDeclaredAdult
   };
+  const requestBody = sandbox ? { ...payload, ...sandboxBodyIdentity(sandbox) } : payload;
   const response = await fetch(
     `${apiBaseUrl}/public/organisations/${ORGANISATION_UUID}/workspaces/${WORKSPACE_UUID}/submit-consent`,
     {
       method: "POST",
       headers: {
-        Authorization: `Bearer ${accessToken}`,
+        ...buildAuthHeaders(accessToken, sandbox),
         "Content-Type": "application/json"
       },
-      body: JSON.stringify(payload),
+      body: JSON.stringify(requestBody),
       signal
     }
   );
@@ -370,25 +432,26 @@ var fetchTTSAudioUrls = async ({
   baseUrl,
   noticeUuid,
   language,
-  signal
+  signal,
+  ...sandboxParams
 }) => {
-  if (!accessToken || !noticeUuid || !language) {
-    throw new Error("accessToken, noticeUuid, and language are required");
-  }
-  const decodedToken = decodeTokenSafely(accessToken);
-  if (!decodedToken) {
-    throw new Error("Invalid access token");
-  }
-  const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
-  if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
-    throw new Error("Invalid token: missing organization or workspace UUID");
+  if (!accessToken && !sandboxParams.token || !noticeUuid || !language) {
+    throw new Error("accessToken (or token), noticeUuid, and language are required");
   }
+  const { organisationUuid: ORGANISATION_UUID, workspaceUuid: WORKSPACE_UUID, sandbox } = resolveRequestAuth(accessToken, sandboxParams, decodeTokenSafely);
   const apiBaseUrl = baseUrl || BASE_URL;
-  const url = `${apiBaseUrl}/public/organisations/${ORGANISATION_UUID}/workspaces/${WORKSPACE_UUID}/notices/${noticeUuid}/audio/${language}`;
-  const response = await fetch(url, {
+  const url = new URL(
+    `${apiBaseUrl}/public/organisations/${ORGANISATION_UUID}/workspaces/${WORKSPACE_UUID}/notices/${noticeUuid}/audio/${language}`
+  );
+  if (sandbox) {
+    for (const [key, value] of Object.entries(sandboxQueryIdentity(sandbox))) {
+      url.searchParams.append(key, value);
+    }
+  }
+  const response = await fetch(url.toString(), {
     method: "GET",
     headers: {
-      Authorization: `Bearer ${accessToken}`,
+      ...buildAuthHeaders(accessToken, sandbox),
       Accept: "application/json"
     },
     signal
@@ -430,7 +493,10 @@ var initiateGuardianVerification = async ({
     if (!decodedToken) {
       throw new Error("Invalid access token");
     }
-    const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
+    const {
+      organisation_uuid: ORGANISATION_UUID,
+      workspace_uuid: WORKSPACE_UUID
+    } = decodedToken;
     if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
       throw new Error("Invalid token: missing organization or workspace UUID");
     }
@@ -504,7 +570,10 @@ var verifyGuardianStatus = async ({
   if (!decodedToken) {
     throw new Error("Invalid access token");
   }
-  const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
+  const {
+    organisation_uuid: ORGANISATION_UUID,
+    workspace_uuid: WORKSPACE_UUID
+  } = decodedToken;
   if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
     throw new Error("Invalid token: missing organization or workspace UUID");
   }
@@ -517,9 +586,7 @@ var verifyGuardianStatus = async ({
         Authorization: `Bearer ${accessToken}`,
         "Content-Type": "application/json"
       },
-      body: JSON.stringify({
-        session_token: sessionToken
-      }),
+      body: JSON.stringify({ session_token: sessionToken }),
       signal
     }
   );
@@ -2408,6 +2475,12 @@ var RedactoNoticeConsent = ({
   noticeId,
   accessToken,
   refreshToken,
+  token,
+  email,
+  mobile,
+  ucic,
+  organisationUuid,
+  workspaceUuid,
   baseUrl,
   ledgerBaseUrl,
   language = "en",
@@ -2426,15 +2499,43 @@ var RedactoNoticeConsent = ({
   reviewModeButtonText = "Continue"
 }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
+  const sandboxParams = (0, import_react2.useMemo)(
+    () => ({
+      token,
+      sandboxUcic: ucic,
+      sandboxSubject: email || mobile,
+      organisationUuid,
+      workspaceUuid
+    }),
+    [token, ucic, email, mobile, organisationUuid, workspaceUuid]
+  );
   const propValidationError = (0, import_react2.useMemo)(() => {
     if (!(noticeId == null ? void 0 : noticeId.trim())) {
       return "RedactoNoticeConsent: 'noticeId' prop is required and cannot be empty";
     }
+    if (token == null ? void 0 : token.trim()) {
+      if (!(organisationUuid == null ? void 0 : organisationUuid.trim()) || !(workspaceUuid == null ? void 0 : workspaceUuid.trim())) {
+        return "RedactoNoticeConsent: sandbox mode requires 'organisationUuid' and 'workspaceUuid'";
+      }
+      if (!(email == null ? void 0 : email.trim()) && !(mobile == null ? void 0 : mobile.trim()) && !(ucic == null ? void 0 : ucic.trim())) {
+        return "RedactoNoticeConsent: sandbox mode requires 'email', 'mobile', or 'ucic'";
+      }
+      return null;
+    }
     if (!(accessToken == null ? void 0 : accessToken.trim())) {
       return "RedactoNoticeConsent: 'accessToken' prop is required and cannot be empty";
     }
     return null;
-  }, [noticeId, accessToken]);
+  }, [
+    noticeId,
+    accessToken,
+    token,
+    organisationUuid,
+    workspaceUuid,
+    email,
+    mobile,
+    ucic
+  ]);
   if (propValidationError) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       "div",
@@ -2787,7 +2888,8 @@ var RedactoNoticeConsent = ({
         specific_uuid: applicationId,
         validate_against: validateAgainst,
         include_fully_consented_data: includeFullyConsentedData,
-        signal: (_a2 = abortControllerRef.current) == null ? void 0 : _a2.signal
+        signal: (_a2 = abortControllerRef.current) == null ? void 0 : _a2.signal,
+        ...sandboxParams
       });
       const activeConfig = consentContentData.detail.active_config;
       setContent(activeConfig);
@@ -2812,7 +2914,8 @@ var RedactoNoticeConsent = ({
           accessToken,
           ledgerBaseUrl,
           noticeUuid: noticeId,
-          signal: (_b2 = abortControllerRef.current) == null ? void 0 : _b2.signal
+          signal: (_b2 = abortControllerRef.current) == null ? void 0 : _b2.signal,
+          ...sandboxParams
         });
         if (ledgerStatus) {
           const overlay = buildLedgerConsentOverlay(
@@ -2944,6 +3047,7 @@ var RedactoNoticeConsent = ({
     noticeId,
     accessToken,
     refreshToken,
+    sandboxParams,
     language,
     applicationId,
     validateAgainst,
@@ -3060,7 +3164,8 @@ var RedactoNoticeConsent = ({
           meta_data: applicationId ? { specific_uuid: applicationId } : void 0,
           guardianVerificationReference: verificationReference || void 0,
           selfDeclaredAdult: selfDeclaredAdult || void 0,
-          signal: submitController.signal
+          signal: submitController.signal,
+          ...sandboxParams
         });
       }
       onAccept == null ? void 0 : onAccept();
@@ -3243,7 +3348,7 @@ var RedactoNoticeConsent = ({
     } finally {
       setIsSubmittingGuardian(false);
     }
-  }, [accessToken, baseUrl, guardianFormData, digilockerMode, digilockerCallbackUrl, selectedPurposes, selectedDataElements, noticeId, onError]);
+  }, [accessToken, sandboxParams, baseUrl, guardianFormData, digilockerMode, digilockerCallbackUrl, selectedPurposes, selectedDataElements, noticeId, onError]);
   const handleAgeVerificationYes = (0, import_react2.useCallback)(() => {
     setShowAgeVerification(false);
     setIsMinorFlow(false);
@@ -3300,7 +3405,7 @@ var RedactoNoticeConsent = ({
     setIsPollingStatus(false);
     isPollingStatusRef.current = false;
     setIsInitiatingVerification(false);
-  }, [accessToken, baseUrl]);
+  }, [accessToken, sandboxParams, baseUrl]);
   const startPopupMonitoring = (0, import_react2.useCallback)((popup) => {
     popupCheckIntervalRef.current = window.setInterval(() => {
       if (popup.closed) {
@@ -3328,8 +3433,8 @@ var RedactoNoticeConsent = ({
     []
   );
   const startStatusPolling = (0, import_react2.useCallback)(
-    (token) => {
-      verificationSessionTokenRef.current = token;
+    (token2) => {
+      verificationSessionTokenRef.current = token2;
       setIsPollingStatus(true);
       isPollingStatusRef.current = true;
       setVerificationError(null);
@@ -3381,7 +3486,7 @@ var RedactoNoticeConsent = ({
           const response = await verifyGuardianStatus({
             accessToken,
             baseUrl,
-            sessionToken: token
+            sessionToken: token2
           });
           consecutiveErrors = 0;
           if (response.status === "verified") {
@@ -3451,7 +3556,7 @@ var RedactoNoticeConsent = ({
       };
       statusPollIntervalRef.current = window.setTimeout(poll, POLL_INTERVAL);
     },
-    [accessToken, baseUrl, getVerificationErrorMessage]
+    [accessToken, sandboxParams, baseUrl, getVerificationErrorMessage]
   );
   const handleBackToGuardianForm = (0, import_react2.useCallback)((clearName = false) => {
     var _a2, _b2;
@@ -3793,7 +3898,8 @@ var RedactoNoticeConsent = ({
       baseUrl,
       noticeUuid: content.notice_uuid,
       language: languageCode,
-      signal: ttsAbortController.signal
+      signal: ttsAbortController.signal,
+      ...sandboxParams
     }).then((response) => {
       setTtsAudioUrls(response.detail);
       setIsTTSAvailable(true);
@@ -3806,7 +3912,7 @@ var RedactoNoticeConsent = ({
     return () => {
       ttsAbortController.abort();
     };
-  }, [content, selectedLanguage, accessToken, baseUrl, getLanguageCode]);
+  }, [content, selectedLanguage, accessToken, sandboxParams, baseUrl, getLanguageCode]);
   const modalStyle = {
     borderRadius: (settings == null ? void 0 : settings.borderRadius) || "8px",
     backgroundColor: (settings == null ? void 0 : settings.backgroundColor) || "#ffffff"