From 58b64e686641c4707a0afc38889f9b70dac3a27a Mon Sep 17 00:00:00 2001
From: Pavel Korchevskii <danone1994@gmail.com>
Date: Tue, 22 Oct 2024 15:54:10 +0200
Subject: [PATCH] feat(CookieConsent): add `modalClassName` property to
 `ConsentPopup` Modal (#230)

---
 src/components/CookieConsent/README.md                          | 1 +
 .../CookieConsent/__stories__/CookieConsent.stories.tsx         | 2 ++
 .../CookieConsent/components/ConsentPopup/ConsentPopup.tsx      | 2 ++
 src/components/CookieConsent/components/ConsentPopup/types.ts   | 2 ++
 4 files changed, 7 insertions(+)

diff --git a/src/components/CookieConsent/README.md b/src/components/CookieConsent/README.md
index d1effb08..77c18ecd 100644
--- a/src/components/CookieConsent/README.md
+++ b/src/components/CookieConsent/README.md
@@ -53,6 +53,7 @@ const Analytics = () => {
       consentManager={consentManager}
       cookieList={cookieList}
       onConsentPopupClose={props.onClose}
+      modalClassName={'unique-class-name-for-adblockers'}
     />
   );
 };
diff --git a/src/components/CookieConsent/__stories__/CookieConsent.stories.tsx b/src/components/CookieConsent/__stories__/CookieConsent.stories.tsx
index 6ce321c7..dd76af44 100644
--- a/src/components/CookieConsent/__stories__/CookieConsent.stories.tsx
+++ b/src/components/CookieConsent/__stories__/CookieConsent.stories.tsx
@@ -72,6 +72,7 @@ ConsentPopup.args = {
     consentMode: ConsentMode.Manage,
     policyLink: 'https://google.com',
     cookieList,
+    modalClassName: 'unique-class-name-for-adblockers',
 } as DefaultTemplateProps;
 
 export const ManageCookies = DefaultTemplate.bind({});
@@ -80,6 +81,7 @@ ManageCookies.args = {
     manageCookies: true,
     policyLink: 'https://google.com',
     cookieList,
+    modalClassName: 'unique-class-name-for-adblockers',
 } as DefaultTemplateProps;
 
 export const ConsentNotification = DefaultTemplate.bind({});
diff --git a/src/components/CookieConsent/components/ConsentPopup/ConsentPopup.tsx b/src/components/CookieConsent/components/ConsentPopup/ConsentPopup.tsx
index 6ce4b483..570e1d12 100644
--- a/src/components/CookieConsent/components/ConsentPopup/ConsentPopup.tsx
+++ b/src/components/CookieConsent/components/ConsentPopup/ConsentPopup.tsx
@@ -101,6 +101,7 @@ export const ConsentPopup = ({
     policyLink,
     onAction,
     className,
+    modalClassName,
     policyLinkText = i18n('label_policy_extended'),
     text,
     manageLabelText = i18n('manage_label_text_extended'),
@@ -156,6 +157,7 @@ export const ConsentPopup = ({
             open
             disableOutsideClick
             disableEscapeKeyDown
+            className={modalClassName}
             contentClassName={b('modal-content', {step: currentStep, mobile})}
             onClose={onClose}
         >
diff --git a/src/components/CookieConsent/components/ConsentPopup/types.ts b/src/components/CookieConsent/components/ConsentPopup/types.ts
index 06571594..108b9e85 100644
--- a/src/components/CookieConsent/components/ConsentPopup/types.ts
+++ b/src/components/CookieConsent/components/ConsentPopup/types.ts
@@ -40,6 +40,8 @@ export type ConsentPopupProps = ConsentPopupData &
     CookieConsentBaseProps & {
         /* Active step */
         step?: `${ConsentPopupStep}`;
+        /* Class for the root Modal node */
+        modalClassName?: string;
     };
 
 export interface HeaderProps {