@carbon/ibmdotcom-web-components 2.36.0 → 2.38.0

package/es/components/notice-choice/notice-choice.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _decorate from "@babel/runtime/helpers/esm/decorate";
 import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _get from "@babel/runtime/helpers/esm/get";
-let _ = t => t,
+let _2 = t => t,
   _t,
   _t2,
   _t3,
@@ -26,25 +26,18 @@ function _superPropGet(t, e, r, o) { var p = _get(_getPrototypeOf(1 & o ? t.prot
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
- */ /**
-     * @license
-     *
-     * Copyright IBM Corp. 2020, 2024
-     *
-     * This source code is licensed under the Apache-2.0 license found in the
-     * LICENSE file in the root directory of this source tree.
-     */
+ */
 
-import { loadContent, loadSettings, checkEmailStatus } from "./services.js";
 import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
-import { pwsValueMap, resetToWorldWideContent } from "./utils.js";
-import settings from '@carbon/ibmdotcom-utilities/es/utilities/settings/settings.js';
 import StableSelectorMixin from "../../globals/mixins/stable-selector.js";
-import styles from "././notice-choice.css.js";
-import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
 import '@carbon/web-components/es/components/skeleton-text/index.js';
+import settings from '@carbon/ibmdotcom-utilities/es/utilities/settings/settings.js';
+import { pwsValueMap, processCustomText, resetToWorldWideContent } from "./utils.js";
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+import { loadContent, loadSettings, checkEmailStatus } from "./services.js";
+import styles from "././notice-choice.css.js";
 const {
   prefix,
   stablePrefix: c4dPrefix
@@ -134,7 +127,7 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       })],
       key: "termsConditionLink",
       value() {
-        return html(_t || (_t = _``));
+        return html(_t || (_t = _2``));
       }
     }, {
       kind: "field",
@@ -166,6 +159,26 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       value() {
         return 'prod';
       }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: String,
+        attribute: 'show-custom-notice-text'
+      })],
+      key: "showCustomNotice",
+      value() {
+        return 'false';
+      }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: String,
+        attribute: 'custom-notice-text'
+      })],
+      key: "customNoticeText",
+      value() {
+        return '';
+      }
     }, {
       kind: "field",
       decorators: [property({
@@ -330,7 +343,7 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       })],
       key: "preText",
       value() {
-        return html(_t2 || (_t2 = _``));
+        return html(_t2 || (_t2 = _2``));
       }
     }, {
       kind: "field",
@@ -340,7 +353,27 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       })],
       key: "defaultPreText",
       value() {
-        return html(_t3 || (_t3 = _``));
+        return html(_t3 || (_t3 = _2``));
+      }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: Array,
+        attribute: false
+      })],
+      key: "doubleOptInCountries",
+      value() {
+        return [];
+      }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: Boolean,
+        attribute: false
+      })],
+      key: "isOriginalTextChanged",
+      value() {
+        return false;
       }
     }, {
       kind: "field",
@@ -369,6 +402,10 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           EMAIL: {
             checkBoxStatus: 'PERMISSION',
             punsStatus: ''
+          },
+          PHONE: {
+            checkBoxStatus: 'PERMISSION',
+            punsStatus: ''
           }
         };
       }
@@ -400,6 +437,24 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       value() {
         return {};
       }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: Object,
+        attribute: false
+      })],
+      key: "customNoticeTextValue",
+      value() {
+        return {
+          text: ''
+        };
+      }
+    }, {
+      kind: "field",
+      key: "pwsFieldsMap",
+      value() {
+        return new Map([['NC_HIDDEN_EMAIL', 'permission_email'], ['NC_HIDDEN_PHONE', 'permission_phone'], ['preventFormSubmission', 'preventFormSubmission'], ['Q_CHINA_PIPL', 'Q_CHINA_PIPL'], ['Q_COUNTRY_TRANSFER', 'Q_COUNTRY_TRANSFER'], ['NC_HIDDEN_EMAIL_VALUE', 'NC_HIDDEN_EMAIL'], ['NC_HIDDEN_PHONE_VALUE', 'NC_HIDDEN_PHONE'], ['EMAIL_CU', 'EMAIL_CU'], ['EMAIL_CC', 'EMAIL_CC'], ['EMAIL_UC', 'EMAIL_UC'], ['EMAIL_UU', 'EMAIL_UU'], ['PHONE_CU', 'PHONE_CU'], ['PHONE_CC', 'PHONE_CC'], ['PHONE_UC', 'PHONE_UC'], ['PHONE_UU', 'PHONE_UU'], ['EMAIL_NOTICE_ONLY', 'EMAIL_NOTICE_ONLY'], ['PHONE_NOTICE_ONLY', 'PHONE_NOTICE_ONLY'], ['NC_HIDDEN_PHONE_NONE', 'NC_HIDDEN_PHONE_NONE']]);
+      }
     }, {
       kind: "method",
       key: "connectedCallback",
@@ -446,50 +501,10 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       }
     }, {
       kind: "method",
-      key: "handleEmailChange",
-      value: function handleEmailChange(value, oldValue, hasValue) {
-        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-        this.emailValid = false;
-        if (hasValue && typeof value === 'string' && value.trim() && oldValue !== value && emailRegex.test(value.trim())) {
-          this.email = value.trim();
-          this.onEmailChange();
-        } else {
-          this.showCheckBox = false;
-        }
-      }
-    }, {
-      kind: "method",
-      key: "loadContentWithFallback",
-      value: function loadContentWithFallback(lang) {
-        loadContent(lang, this.environment, ncData => {
-          this.isLoading = false;
-          this.ncData = ncData;
-          this.prepareCheckboxes();
-        }, () => this.defaultLoadContent());
-      }
-    }, {
-      kind: "method",
-      key: "handleLanguageOrEnvironmentChange",
-      value: function handleLanguageOrEnvironmentChange(value) {
-        var _this$language;
-        if (['stage', 'prod'].includes(value)) {
-          this.environment = value;
-        } else {
-          this.language = value;
-        }
-        const langPart = (_this$language = this.language) === null || _this$language === void 0 ? void 0 : _this$language.split(/[-_]/)[0];
-        this.isLoading = true;
-        loadSettings(this.environment, settings => {
-          var _this$language2;
-          this.countrySettings = settings.preferences;
-          this.noticeOnly = settings.noticeOnly || ['us'];
-          this.supportedLanguages = settings.supportedLanguages || {};
-          const supportedLang = this.supportedLanguages[((_this$language2 = this.language) === null || _this$language2 === void 0 ? void 0 : _this$language2.toLowerCase()) || ''] || langPart && this.supportedLanguages[langPart.toLowerCase()] || 'en';
-          this.loadContentWithFallback(supportedLang);
-        }, err => {
-          console.error('Error loading settings', err);
-          this.loadContentWithFallback('en');
-        });
+      key: "countryChanged",
+      value: function countryChanged() {
+        resetToWorldWideContent();
+        this.countryChangeAction();
       }
     }, {
       kind: "method",
@@ -526,10 +541,85 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           case 'email':
             this.handleEmailChange(value, oldValue, hasValue);
             return;
+          case 'customNoticeText':
+            {
+              if (oldValue === value) {
+                return;
+              }
+              this.customNoticeTextValue = this.parseCustomNoticeText(value);
+              return;
+            }
+          case 'showCustomNotice':
+            if (oldValue !== value && typeof value === 'string') {
+              this.showCustomNotice = JSON.parse(value) || false;
+            }
+            return;
           default:
             return;
         }
       }
+    }, {
+      kind: "method",
+      key: "htmlDecode",
+      value: function htmlDecode(text) {
+        const textarea = document.createElement('textarea');
+        textarea.innerHTML = text;
+        return textarea.value;
+      }
+    }, {
+      kind: "method",
+      key: "tryParseJson",
+      value: function tryParseJson(text) {
+        try {
+          return JSON.parse(text);
+        } catch (error) {
+          // return null
+          return null;
+        }
+      }
+    }, {
+      kind: "method",
+      key: "normalizeObjectLiteral",
+      value: function normalizeObjectLiteral(input) {
+        let normalized = input;
+        normalized = normalized.replace(/`([^`]*)`/g, (_, content) => `"${content}"`);
+        normalized = normalized.replace(/'([^']*)'/g, (_, content) => `"${content}"`);
+        normalized = normalized.replace(/([{,]\s*)([a-zA-Z0-9_]+)\s*:/g, '$1"$2":');
+        normalized = normalized.replace(/,(\s*[}\]])/g, '$1');
+        return normalized;
+      }
+    }, {
+      kind: "method",
+      key: "parseCustomNoticeText",
+      value: function parseCustomNoticeText(rawValue) {
+        if (typeof rawValue !== 'string') {
+          return rawValue;
+        }
+        const decodedText = this.htmlDecode(rawValue).trim();
+        const jsonDirect = this.tryParseJson(decodedText);
+        if (jsonDirect !== null) {
+          return jsonDirect;
+        }
+        const normalized = this.normalizeObjectLiteral(decodedText);
+        const jsonNormalized = this.tryParseJson(normalized);
+        if (jsonNormalized !== null) {
+          return jsonNormalized;
+        }
+        return {
+          text: decodedText
+        };
+      }
+    }, {
+      kind: "method",
+      key: "_handleEmailCheckFailure",
+      value: function _handleEmailCheckFailure(responseData, expired) {
+        this.isAnnualPeriodExpired = expired;
+        this.showCheckBox = true;
+        this.renderCombinedEmailPhoneSection();
+        this._onEmailStatusChanged('emailStats', _objectSpread(_objectSpread({}, responseData), {}, {
+          isAnnualPeriodExpired: expired
+        }));
+      }
     }, {
       kind: "method",
       key: "onEmailChange",
@@ -568,44 +658,89 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           this._handleEmailCheckFailure(error, true);
         });
       }
-
-      /**
-       * Centralized handler for failed or invalid responses.
-       */
     }, {
       kind: "method",
-      key: "_handleEmailCheckFailure",
-      value: function _handleEmailCheckFailure(responseData, expired) {
-        this.isAnnualPeriodExpired = expired;
-        this.showCheckBox = true;
-        this.renderCombinedEmailPhoneSection();
-        this._onEmailStatusChanged('emailStats', _objectSpread(_objectSpread({}, responseData), {}, {
-          isAnnualPeriodExpired: expired
-        }));
+      key: "handleEmailChange",
+      value: function handleEmailChange(value, oldValue, hasValue) {
+        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+        this.emailValid = false;
+        if (hasValue && typeof value === 'string' && value.trim() && oldValue !== value && emailRegex.test(value.trim())) {
+          this.email = value.trim();
+          this.onEmailChange();
+        } else {
+          this.showCheckBox = false;
+        }
       }
     }, {
       kind: "method",
-      key: "_initSettingsAndContent",
-      value: function _initSettingsAndContent(language) {
-        const [lang] = language.split(/[-_]/);
-        const defaultLang = this.supportedLanguages[language === null || language === void 0 ? void 0 : language.toLocaleLowerCase()] || this.supportedLanguages[lang === null || lang === void 0 ? void 0 : lang.toLocaleLowerCase()] || 'en';
+      key: "loadContentWithFallback",
+      value: function loadContentWithFallback(lang) {
+        loadContent(lang, this.environment, ncData => {
+          this.isLoading = false;
+          this.ncData = ncData;
+          this.prepareCheckboxes();
+        }, () => this.defaultLoadContent());
+      }
+    }, {
+      kind: "method",
+      key: "handleLanguageOrEnvironmentChange",
+      value: function handleLanguageOrEnvironmentChange(value) {
+        var _this$language;
+        if (['stage', 'prod'].includes(value)) {
+          this.environment = value;
+        } else {
+          this.language = value;
+        }
+        const langPart = (_this$language = this.language) === null || _this$language === void 0 ? void 0 : _this$language.split(/[-_]/)[0];
+        this.isLoading = true;
         loadSettings(this.environment, settings => {
+          var _this$language2;
           this.countrySettings = settings.preferences;
           this.noticeOnly = settings.noticeOnly || ['us'];
           this.supportedLanguages = settings.supportedLanguages || {};
-        }, () => this.defaultLoadSettings());
-        loadContent(defaultLang, this.environment, ncData => {
-          this.ncData = ncData;
-          this.prepareCheckboxes();
-          this.countryChanged();
-        }, () => this.defaultLoadContent());
+          this.isOriginalTextChanged = true;
+          const supportedLang = this.supportedLanguages[((_this$language2 = this.language) === null || _this$language2 === void 0 ? void 0 : _this$language2.toLowerCase()) || ''] || langPart && this.supportedLanguages[langPart.toLowerCase()] || 'en';
+          this.loadContentWithFallback(supportedLang);
+        }, err => {
+          console.error('Error loading settings', err);
+          this.loadContentWithFallback('en');
+        });
+      }
+    }, {
+      kind: "method",
+      key: "setDefaultSelections",
+      value: function setDefaultSelections() {
+        var _this$country, _this$countrySettings2, _this$countrySettings3;
+        if (this.enableAllOptIn || !this.checkboxes) {
+          return;
+        }
+        const countryCode = (_this$country = this.country) === null || _this$country === void 0 ? void 0 : _this$country.toLowerCase();
+        const countryStatus = (_this$countrySettings2 = (_this$countrySettings3 = this.countrySettings) === null || _this$countrySettings3 === void 0 ? void 0 : _this$countrySettings3[countryCode]) !== null && _this$countrySettings2 !== void 0 ? _this$countrySettings2 : {
+          email: 'opt-in',
+          phone: 'opt-in'
+        };
+        const newValues = _objectSpread({}, this.values);
+        for (const key of Object.keys(this.checkboxes)) {
+          const isOptOut = countryStatus[key.toLowerCase()] === 'opt-out';
+          newValues[key] = isOptOut;
+          const hiddenFieldName = `NC_HIDDEN_${key}`;
+          newValues[hiddenFieldName] = isOptOut ? 'OPT_OUT' : 'OPT_IN';
+          if (Object.prototype.hasOwnProperty.call(this.defaultValues, key)) {
+            newValues[key] = this.defaultValues[key];
+          }
+          this._onChange(hiddenFieldName, newValues[key] ? 'OPT_IN' : 'OPT_OUT');
+        }
+        const changed = Object.keys(newValues).some(field => newValues[field] !== this.values[field]);
+        if (changed) {
+          this.values = newValues;
+        }
       }
     }, {
       kind: "method",
       key: "countryChangeAction",
       value: function countryChangeAction() {
-        var _this$country, _this$ncData;
-        const countryCode = (_this$country = this.country) === null || _this$country === void 0 ? void 0 : _this$country.toLowerCase();
+        var _this$country2, _this$ncData;
+        const countryCode = (_this$country2 = this.country) === null || _this$country2 === void 0 ? void 0 : _this$country2.toLowerCase();
         this.preventFormSubmission = false;
         const mandatory = (_this$ncData = this.ncData) === null || _this$ncData === void 0 || (_this$ncData = _this$ncData.mandatoryCheckbox) === null || _this$ncData === void 0 ? void 0 : _this$ncData[countryCode];
         this.setDefaultSelections();
@@ -628,67 +763,48 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       }
     }, {
       kind: "method",
-      key: "postTextTemplate",
-      value: function postTextTemplate() {
-        if (this.ncData) {
-          const OtherPreferences = this.ncData.trialPrivacyText;
-          let postText = this.ncData.postText;
-          if (postText) {
-            postText = '<p part="ncPostText">' + postText + '</p>';
-          }
-          if (!this.termsConditionLink.strings && this.termsConditionLink) {
-            const originalValue = OtherPreferences;
-            const matchedValue = originalValue.match(/<tc>.*<\/tc>/g);
-            if (matchedValue) {
-              const anrTagHtml = matchedValue[0].replace(/<tc>|<\/tc>/g, '');
-              const link = `<a href='${this.termsConditionLink}' target='_blank' class='ibm-tooltip' part="tooltip-link">${anrTagHtml}</a>`;
-              const reg = new RegExp('<tc>' + anrTagHtml + '</tc>', 'g');
-              postText = postText + originalValue.replace(reg, link).replace(/<p>/g, '<p part="nc-trial-text" id="nc-trial-text">');
-            }
-          }
-          if (postText !== '') {
-            postText = "<div part='ncPostTextContainer' id='ncPostTextContainer'>" + postText + '</div>';
-          }
-          return html(_t4 || (_t4 = _`${0}`), unsafeHTML(postText));
-        } else {
-          return html(_t5 || (_t5 = _``));
-        }
+      key: "defaultLoadSettings",
+      value: function defaultLoadSettings() {
+        loadSettings(this.environment, countryPreferencesSettings => {
+          this.countrySettings = countryPreferencesSettings.preferences;
+          this.noticeOnly = countryPreferencesSettings.noticeOnly || ['us'];
+          this.supportedLanguages = settings.supportedLanguages || {};
+          this.isOriginalTextChanged = true;
+        }, error => {
+          console.error('error loading content', error);
+        });
       }
     }, {
       kind: "method",
-      key: "countryChanged",
-      value: function countryChanged() {
-        resetToWorldWideContent();
-        this.countryChangeAction();
+      key: "_initSettingsAndContent",
+      value: function _initSettingsAndContent(language) {
+        const [lang] = language.split(/[-_]/);
+        const defaultLang = this.supportedLanguages[language === null || language === void 0 ? void 0 : language.toLocaleLowerCase()] || this.supportedLanguages[lang === null || lang === void 0 ? void 0 : lang.toLocaleLowerCase()] || 'en';
+        loadSettings(this.environment, settings => {
+          this.countrySettings = settings.preferences;
+          this.noticeOnly = settings.noticeOnly || ['us'];
+          this.supportedLanguages = settings.supportedLanguages || {};
+          this.doubleOptInCountries = settings.doubleOptInCountries || [];
+          this.isOriginalTextChanged = true;
+        }, () => this.defaultLoadSettings());
+        loadContent(defaultLang, this.environment, ncData => {
+          this.ncData = ncData;
+          this.prepareCheckboxes();
+          this.countryChanged();
+        }, () => this.defaultLoadContent());
       }
     }, {
       kind: "method",
-      key: "setDefaultSelections",
-      value: function setDefaultSelections() {
-        var _this$country2, _this$countrySettings2, _this$countrySettings3;
-        if (this.enableAllOptIn || !this.checkboxes) {
-          return;
-        }
-        const countryCode = (_this$country2 = this.country) === null || _this$country2 === void 0 ? void 0 : _this$country2.toLowerCase();
-        const countryStatus = (_this$countrySettings2 = (_this$countrySettings3 = this.countrySettings) === null || _this$countrySettings3 === void 0 ? void 0 : _this$countrySettings3[countryCode]) !== null && _this$countrySettings2 !== void 0 ? _this$countrySettings2 : {
-          email: 'opt-in',
-          phone: 'opt-in'
-        };
-        const newValues = _objectSpread({}, this.values);
-        for (const key of Object.keys(this.checkboxes)) {
-          const isOptOut = countryStatus[key.toLowerCase()] === 'opt-out';
-          newValues[key] = isOptOut;
-          const hiddenFieldName = `NC_HIDDEN_${key}`;
-          newValues[hiddenFieldName] = isOptOut ? 'OPT_OUT' : 'OPT_IN';
-          if (Object.prototype.hasOwnProperty.call(this.defaultValues, key)) {
-            newValues[key] = this.defaultValues[key];
-          }
-          this._onChange(hiddenFieldName, newValues[key] ? 'OPT_IN' : 'OPT_OUT');
-        }
-        const changed = Object.keys(newValues).some(field => newValues[field] !== this.values[field]);
-        if (changed) {
-          this.values = newValues;
-        }
+      key: "defaultLoadContent",
+      value: function defaultLoadContent() {
+        loadContent('en', this.environment, ncData => {
+          this.ncData = ncData;
+          this.prepareCheckboxes();
+          this.countryChanged();
+        }, error => {
+          this.isLoading = false;
+          console.error('error loading content', error);
+        });
       }
     }, {
       kind: "method",
@@ -728,31 +844,6 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           this.performUpdate();
         }
       }
-    }, {
-      kind: "method",
-      key: "defaultLoadContent",
-      value: function defaultLoadContent() {
-        loadContent('en', this.environment, ncData => {
-          this.ncData = ncData;
-          this.prepareCheckboxes();
-          this.countryChanged();
-        }, error => {
-          this.isLoading = false;
-          console.error('error loading content', error);
-        });
-      }
-    }, {
-      kind: "method",
-      key: "defaultLoadSettings",
-      value: function defaultLoadSettings() {
-        loadSettings(this.environment, countryPreferencesSettings => {
-          this.countrySettings = countryPreferencesSettings.preferences;
-          this.noticeOnly = countryPreferencesSettings.noticeOnly || ['us'];
-          this.supportedLanguages = settings.supportedLanguages || {};
-        }, error => {
-          console.error('error loading content', error);
-        });
-      }
     }, {
       kind: "method",
       key: "checkCombineEmailPhoneBoxChange",
@@ -766,14 +857,14 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           const hiddenFieldName = `NC_HIDDEN_${id}`;
           const hiddenFieldStatus = checked ? 'PERMISSION' : 'SUPPRESSION';
           this.valuesForEmailPhone[id]['checkBoxStatus'] = hiddenFieldStatus;
-          let statusPrechecked = '';
+          let statusPreChecked = '';
           switch (id) {
             case 'EMAIL':
             case 'PHONE':
-              statusPrechecked = this.combinedEmailPhonePrechecked && !checked ? 'CU' : !this.combinedEmailPhonePrechecked && checked ? 'UC' : this.combinedEmailPhonePrechecked && checked ? 'CC' : 'UU';
+              statusPreChecked = this.combinedEmailPhonePrechecked && !checked ? 'CU' : !this.combinedEmailPhonePrechecked && checked ? 'UC' : this.combinedEmailPhonePrechecked && checked ? 'CC' : 'UU';
               break;
           }
-          this.valuesForEmailPhone[id]['punsStatus'] = statusPrechecked;
+          this.valuesForEmailPhone[id]['punsStatus'] = statusPreChecked;
           this._onChange(hiddenFieldName, hiddenFieldStatus);
           this._onChange(`${hiddenFieldName}_VALUE`, `NC_HIDDEN_${hiddenFieldStatus}`);
         });
@@ -783,7 +874,7 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       key: "renderCheckbox",
       value: function renderCheckbox(preText, checked) {
         const checkboxId = 'EMAIL_PHONE_CHECKBOX';
-        return html(_t6 || (_t6 = _`
+        return html(_t4 || (_t4 = _2`
       <span part="container">
         <div
           class="${0}--form-item cds--checkbox-wrapper"
@@ -815,9 +906,9 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       kind: "method",
       key: "combinedPreTextTemplate",
       value: function combinedPreTextTemplate() {
-        var _this$country3, _this$state, _content$state, _content$country;
+        var _this$country3, _this$state, _content$state, _content$country, _this$values, _this$doubleOptInCoun, _this$noticeOnly;
         if (!this.ncData) {
-          return html(_t7 || (_t7 = _``));
+          return html(_t5 || (_t5 = _2``));
         }
         const content = this.ncData;
         const country = ((_this$country3 = this.country) === null || _this$country3 === void 0 ? void 0 : _this$country3.toLowerCase()) || '';
@@ -852,17 +943,40 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
         if (countryContent) {
           preText = !this.emailValid ? content.annualDefaultText : this.isAnnualPeriodExpired ? countryContent.combinedConsent : countryContent.annualText;
         }
+        const hasEmail = Boolean((_this$values = this.values) === null || _this$values === void 0 ? void 0 : _this$values.EMAIL);
+        const inDoubleOptIn = (_this$doubleOptInCoun = this.doubleOptInCountries) === null || _this$doubleOptInCoun === void 0 ? void 0 : _this$doubleOptInCoun.includes(country);
+        const inNoticeOnly = (_this$noticeOnly = this.noticeOnly) === null || _this$noticeOnly === void 0 ? void 0 : _this$noticeOnly.includes(country);
+        if (this.isOriginalTextChanged) {
+          this._onNoticeTextChange('noticeTextChange', preText);
+          this.isOriginalTextChanged = false;
+        }
+        if (this.showCustomNotice) {
+          var _this$customNoticeTex;
+          if (this.customNoticeTextValue && (_this$customNoticeTex = this.customNoticeTextValue.text) !== null && _this$customNoticeTex !== void 0 && _this$customNoticeTex.trim()) {
+            preText = processCustomText(this.customNoticeTextValue);
+          } else {
+            preText = content.thirdPartyCombinedConsent;
+          }
+        }
+        // Call only if changed
+
+        // 4. Add double opt-in text if applicable
+        if (hasEmail && inDoubleOptIn) {
+          var _content$mkDoubleOptI;
+          const text = content === null || content === void 0 || (_content$mkDoubleOptI = content.mkDoubleOptInText) === null || _content$mkDoubleOptI === void 0 ? void 0 : _content$mkDoubleOptI.trim();
+          if (text) {
+            preText += ` <span part="double-opt-in-text">${text}</span>`;
+          }
+        }
 
-        // 4. permission/suppression logic
-        if (!(this.noticeOnly || []).includes(country)) {
-          let isPermission = false;
-          isPermission = this.values.EMAIL;
-          const checked = isPermission;
+        // 5. permission/suppression logic
+        if (!inNoticeOnly) {
+          const checked = hasEmail;
           if (this.showCheckBox) {
             return this.renderCheckbox(preText, checked);
           }
         }
-        return html(_t8 || (_t8 = _`${0}`), unsafeHTML(preText));
+        return html(_t6 || (_t6 = _2`${0}`), unsafeHTML(preText));
       }
     }, {
       kind: "method",
@@ -902,19 +1016,20 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       value: function countryBasedLegalNotice() {
         var _this$ncData5;
         const countryCode = this.country.toLowerCase();
+        this.isOriginalTextChanged = true;
         const mandatoryCheckboxes = (_this$ncData5 = this.ncData) === null || _this$ncData5 === void 0 || (_this$ncData5 = _this$ncData5.mandatoryCheckbox) === null || _this$ncData5 === void 0 ? void 0 : _this$ncData5[countryCode];
         if (!mandatoryCheckboxes) {
           return [];
         }
         return Object.entries(mandatoryCheckboxes).map(([key, checkbox]) => {
           const legalTextName = key.replace(/([A-Z]+)/g, '-$1').toLowerCase();
-          const errorTemplate = !this.hideErrorMessage && this.preventFormSubmission ? html(_t9 || (_t9 = _`<span
+          const errorTemplate = !this.hideErrorMessage && this.preventFormSubmission ? html(_t7 || (_t7 = _2`<span
               class="nc-error"
               part="error"
               style="color:#da1e28;font-size:.75rem">
               ${0}
             </span>`), checkbox.error) : null;
-          return html(_t10 || (_t10 = _`
+          return html(_t8 || (_t8 = _2`
         <span>
           <div
             class="${0}--form-item bx--checkbox-wrapper"
@@ -945,6 +1060,34 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
       `), prefix, legalTextName, legalTextName, prefix, checkbox.mrs_field, checkbox.mrs_field, this.checkBoxLegalChange, checkbox.mrs_field, prefix, prefix, checkbox.mrs_field, prefix, checkbox.text, errorTemplate);
         });
       }
+    }, {
+      kind: "method",
+      key: "postTextTemplate",
+      value: function postTextTemplate() {
+        if (this.ncData) {
+          const OtherPreferences = this.ncData.trialPrivacyText;
+          let postText = this.ncData.postText;
+          if (postText) {
+            postText = '<p part="ncPostText">' + postText + '</p>';
+          }
+          if (!this.termsConditionLink.strings && this.termsConditionLink) {
+            const originalValue = OtherPreferences;
+            const matchedValue = originalValue.match(/<tc>.*<\/tc>/g);
+            if (matchedValue) {
+              const anrTagHtml = matchedValue[0].replace(/<tc>|<\/tc>/g, '');
+              const link = `<a href='${this.termsConditionLink}' target='_blank' class='ibm-tooltip' part="tooltip-link">${anrTagHtml}</a>`;
+              const reg = new RegExp('<tc>' + anrTagHtml + '</tc>', 'g');
+              postText = postText + originalValue.replace(reg, link).replace(/<p>/g, '<p part="nc-trial-text" id="nc-trial-text">');
+            }
+          }
+          if (postText !== '') {
+            postText = "<div part='ncPostTextContainer' id='ncPostTextContainer'>" + postText + '</div>';
+          }
+          return html(_t9 || (_t9 = _2`${0}`), unsafeHTML(postText));
+        } else {
+          return html(_t10 || (_t10 = _2``));
+        }
+      }
     }, {
       kind: "method",
       key: "renderCombinedEmailPhoneSection",
@@ -968,7 +1111,7 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           }
           return ((_this$valuesForEmailP2 = this.valuesForEmailPhone[key]) === null || _this$valuesForEmailP2 === void 0 ? void 0 : _this$valuesForEmailP2.punsStatus) || (checked ? 'CC' : 'UU');
         };
-        const createHiddenInput = (id, value) => html(_t11 || (_t11 = _`
+        const createHiddenInput = (id, value) => html(_t11 || (_t11 = _2`
       <input type="hidden" id=${0} name=${0} value=${0} />
     `), id, id, value);
         const hiddenInputs = Object.keys(this.checkboxes).map(key => {
@@ -990,7 +1133,7 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           }
           return createHiddenInput(hiddenBoxId, hiddenValue);
         });
-        return html(_t12 || (_t12 = _`
+        return html(_t12 || (_t12 = _2`
       <section class="${0}--nc" part="section">
         <p part="ncHeading" id="ncHeading" class="${0}--nc__pre-text">
           ${0} ${0}
@@ -1004,19 +1147,30 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
     `), prefix, c4dPrefix, this.countryBasedLegalNotice(), this.combinedPreTextTemplate(), hiddenInputs, prefix, prefix, this.postTextTemplate(), createHiddenInput('preventFormSubmission', String(this.preventFormSubmission)));
       }
     }, {
-      kind: "field",
-      key: "pwsFieldsMap",
-      value() {
-        return new Map([['NC_HIDDEN_EMAIL', 'permission_email'], ['NC_HIDDEN_PHONE', 'permission_phone'], ['preventFormSubmission', 'preventFormSubmission'], ['Q_CHINA_PIPL', 'Q_CHINA_PIPL'], ['Q_COUNTRY_TRANSFER', 'Q_COUNTRY_TRANSFER'], ['NC_HIDDEN_EMAIL_VALUE', 'NC_HIDDEN_EMAIL'], ['NC_HIDDEN_PHONE_VALUE', 'NC_HIDDEN_PHONE'], ['EMAIL_CU', 'EMAIL_CU'], ['EMAIL_CC', 'EMAIL_CC'], ['EMAIL_UC', 'EMAIL_UC'], ['EMAIL_UU', 'EMAIL_UU'], ['PHONE_CU', 'PHONE_CU'], ['PHONE_CC', 'PHONE_CC'], ['PHONE_UC', 'PHONE_UC'], ['PHONE_UU', 'PHONE_UU'], ['EMAIL_NOTICE_ONLY', 'EMAIL_NOTICE_ONLY'], ['PHONE_NOTICE_ONLY', 'PHONE_NOTICE_ONLY'], ['NC_HIDDEN_PHONE_NONE', 'NC_HIDDEN_PHONE_NONE']]);
+      kind: "method",
+      key: "_onChange",
+      value: function _onChange(field, value) {
+        var _this$pwsFieldsMap$ge, _this$pwsFieldsMap, _pwsValueMap;
+        const mappedField = (_this$pwsFieldsMap$ge = (_this$pwsFieldsMap = this.pwsFieldsMap) === null || _this$pwsFieldsMap === void 0 ? void 0 : _this$pwsFieldsMap.get(field)) !== null && _this$pwsFieldsMap$ge !== void 0 ? _this$pwsFieldsMap$ge : field;
+        const mappedValue = (_pwsValueMap = pwsValueMap === null || pwsValueMap === void 0 ? void 0 : pwsValueMap(value)) !== null && _pwsValueMap !== void 0 ? _pwsValueMap : value;
+        this.dispatchCustomEvent(`${c4dPrefix}-notice-choice-change`, mappedField, mappedValue);
+      }
+    }, {
+      kind: "method",
+      key: "_onNoticeTextChange",
+      value: function _onNoticeTextChange(field, value) {
+        this.dispatchCustomEvent(`${c4dPrefix}-notice-choice-text-change`, field, value);
+      }
+    }, {
+      kind: "method",
+      key: "_onEmailStatusChanged",
+      value: function _onEmailStatusChanged(field, value) {
+        this.dispatchCustomEvent(`${c4dPrefix}-notice-choice-email-status-changed`, field, value);
       }
     }, {
       kind: "method",
       key: "dispatchCustomEvent",
-      value:
-      /**
-       * Dispatch field change event to parent form
-       */
-      function dispatchCustomEvent(eventName, field, value) {
+      value: function dispatchCustomEvent(eventName, field, value) {
         try {
           const eventDetail = {
             bubbles: true,
@@ -1030,27 +1184,12 @@ let NoticeChoice = _decorate([customElement(`c4d-notice-choice`)], function (_in
           console.error(`[${eventName}] dispatch failed:`, error);
         }
       }
-    }, {
-      kind: "method",
-      key: "_onChange",
-      value: function _onChange(field, value) {
-        var _this$pwsFieldsMap$ge, _this$pwsFieldsMap, _pwsValueMap;
-        const mappedField = (_this$pwsFieldsMap$ge = (_this$pwsFieldsMap = this.pwsFieldsMap) === null || _this$pwsFieldsMap === void 0 ? void 0 : _this$pwsFieldsMap.get(field)) !== null && _this$pwsFieldsMap$ge !== void 0 ? _this$pwsFieldsMap$ge : field;
-        const mappedValue = (_pwsValueMap = pwsValueMap === null || pwsValueMap === void 0 ? void 0 : pwsValueMap(value)) !== null && _pwsValueMap !== void 0 ? _pwsValueMap : value;
-        this.dispatchCustomEvent(`${c4dPrefix}-notice-choice-change`, mappedField, mappedValue);
-      }
-    }, {
-      kind: "method",
-      key: "_onEmailStatusChanged",
-      value: function _onEmailStatusChanged(field, value) {
-        this.dispatchCustomEvent(`${c4dPrefix}-notice-choice-email-status-changed`, field, value);
-      }
     }, {
       kind: "method",
       key: "render",
       value: function render() {
         if (this.isLoading) {
-          return html(_t13 || (_t13 = _`<div part="skeleton-notice-choice">
+          return html(_t13 || (_t13 = _2`<div part="skeleton-notice-choice">
         <cds-skeleton-text
           linecount="3"
           width="100%"