diy-template-components 0.2.4 → 0.2.6

package/build/index.js

@@ -2,15 +2,15 @@
 
 
 
-function ___$insertStyle(css) {
-    if (!css || !window) {
-        return;
-    }
-    const style = document.createElement('style');
-    style.setAttribute('type', 'text/css');
-    style.innerHTML = css;
-    document.head.appendChild(style);
-    return css;
+function ___$insertStyle(css) {
+    if (!css || typeof window === 'undefined') {
+        return;
+    }
+    const style = document.createElement('style');
+    style.setAttribute('type', 'text/css');
+    style.innerHTML = css;
+    document.head.appendChild(style);
+    return css;
 }
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -20,6 +20,7 @@ var Slider = require('react-slick');
 var axios = require('axios');
 var moment = require('moment');
 var Countdown = require('react-countdown');
+var ReactDOMServer = require('react-dom/server');
 var reactJss = require('react-jss');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -29,22 +30,20 @@ var Slider__default = /*#__PURE__*/_interopDefaultLegacy(Slider);
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
 var Countdown__default = /*#__PURE__*/_interopDefaultLegacy(Countdown);
+var ReactDOMServer__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOMServer);
 
 function _extends() {
-  _extends = Object.assign || function (target) {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
-
       for (var key in source) {
         if (Object.prototype.hasOwnProperty.call(source, key)) {
           target[key] = source[key];
         }
       }
     }
-
     return target;
   };
-
   return _extends.apply(this, arguments);
 }
 
@@ -300,21 +299,17 @@ const alpha = {
   seventyPercent: 0.7,
   eightyPercent: 0.8
 };
-
 const getRGBFromHex = hex => {
   const r = parseInt(hex.slice(1, 3), 16);
   const g = parseInt(hex.slice(3, 5), 16);
   const b = parseInt(hex.slice(5, 7), 16);
   return [r, g, b];
 };
-
 const hexToRgbA = (hex, alpha = null) => {
   const values = getRGBFromHex(hex);
-
   if (alpha !== null) {
     values.push(alpha);
   }
-
   return `rgba(${values.join(',')})`;
 };
 const colorMixer = (hex1, weightage = 1, hex2 = colors.white) => {
@@ -454,29 +449,24 @@ function useLinkBuilder(data) {
     basePath,
     isMasterTemplate
   } = React.useContext(PageContext);
-
   if (isEdit || !data.isLink) {
     return null;
   }
-
   if (data?.isExistingLink === false) {
     return data.link;
   }
-
   if (data?.isExternal) {
     return data.link;
   }
-
   if (!isPreview) {
     const link = data.link === '/' ? '' : '/' + data.link;
     return basePath ? `//${basePath}${link}` : null;
-  } // courses in preview: special case
-
+  }
 
+  // courses in preview: special case
   if (data.link === 'courses') {
     return `//${basePath}/courses`;
   }
-
   const {
     pageId
   } = navList.find(el => el.slug === data?.link) || {};
@@ -652,14 +642,12 @@ var calendar$1 = "data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2218%
 var video = "data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2219%22%20viewBox%3D%220%200%2018%2019%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.8625%205.1275C15.555%204.9625%2014.91%204.79%2014.0325%205.405L12.93%206.185C12.8475%203.8525%2011.835%202.9375%209.375%202.9375H4.875C2.31%202.9375%201.3125%203.935%201.3125%206.5V12.5C1.3125%2014.225%202.25%2016.0625%204.875%2016.0625H9.375C11.835%2016.0625%2012.8475%2015.1475%2012.93%2012.815L14.0325%2013.595C14.4975%2013.925%2014.9025%2014.03%2015.225%2014.03C15.5025%2014.03%2015.72%2013.9475%2015.8625%2013.8725C16.17%2013.715%2016.6875%2013.2875%2016.6875%2012.215V6.785C16.6875%205.7125%2016.17%205.285%2015.8625%205.1275ZM8.25%209.035C7.4775%209.035%206.84%208.405%206.84%207.625C6.84%206.845%207.4775%206.215%208.25%206.215C9.0225%206.215%209.66%206.845%209.66%207.625C9.66%208.405%209.0225%209.035%208.25%209.035Z%22%20fill%3D%22%23589DF5%22%2F%3E%3C%2Fsvg%3E";
 
 /** @returns {import('./types').IconData} */
-
 const getConfiguredIcon1 = url => ({
   url,
   svgChildrenConfigs: []
 });
-/** @returns {import('./types').IconData} */
-
 
+/** @returns {import('./types').IconData} */
 const getConfiguredIcon2 = (url, stroke, fill) => ({
   url,
   svgChildrenConfigs: [{
@@ -668,7 +656,6 @@ const getConfiguredIcon2 = (url, stroke, fill) => ({
     fill
   }]
 });
-
 const icons = {
   'Live class': getConfiguredIcon2(liveTv, false, true),
   'Recorded videos': getConfiguredIcon2(liveTv2, false, true),
@@ -701,41 +688,51 @@ const icons = {
   'Video Play': getConfiguredIcon2(videoPlay, false, true),
   Quote: getConfiguredIcon2(quote, false, true),
   // Stock
+
   'Stock Growth': getConfiguredIcon2(stockGrowth, false, true),
   Money: getConfiguredIcon2(money, false, true),
   Split: getConfiguredIcon2(split, false, true),
   Chart: getConfiguredIcon2(chart, false, true),
   // Personality Development
+
   Leaders: getConfiguredIcon2(leaders, false, true),
   Women: getConfiguredIcon2(women, false, true),
   Program: getConfiguredIcon2(program, false, true),
   // Photography
+
   'Video Editing': getConfiguredIcon2(videoEditing, false, true),
   Editing: getConfiguredIcon2(editing, false, true),
   Camera: getConfiguredIcon2(camera, false, true),
   Sessions: getConfiguredIcon2(sessions, false, true),
   // Computer
+
   'Regular Batches': getConfiguredIcon2(regularBatches, false, true),
   'Alternate Batches': getConfiguredIcon2(alternateBatches, false, true),
   'Weekend Batches': getConfiguredIcon2(weekendBatches, false, true),
   // Life Coach
+
   Girl: getConfiguredIcon2(girl, false, true),
   Smile: getConfiguredIcon2(smile, false, true),
   Relationships: getConfiguredIcon2(relationships, false, true),
   // Music
+
   Vocal: getConfiguredIcon2(vocal, false, true),
   Instrument: getConfiguredIcon2(instrument, false, true),
   Music: getConfiguredIcon2(music, false, true),
   // Fitness
+
   Workout: getConfiguredIcon2(workout, false, true),
   Barbell: getConfiguredIcon2(barbell, false, true),
   Trainer: getConfiguredIcon2(trainer, false, true),
   Report: getConfiguredIcon2(report, false, true),
   // Govt Exam
+
   'Govt Exam': getConfiguredIcon2(govtExam, false, true),
   // IIT JEE
+
   College: getConfiguredIcon2(college, false, true),
   // Others
+
   Teachers: getConfiguredIcon2(teachers, false, true),
   Learning: getConfiguredIcon2(learning, false, true),
   Success: getConfiguredIcon2(success, false, true),
@@ -747,12 +744,9 @@ const icons = {
   Video: getConfiguredIcon2(video, false, true)
 };
 
-const someMethod1 = (
-/** @type {import('./types').IconData["svgChildrenConfigs"]} */
-svgChildrenConfigs, color, hoverColor) => {
+const someMethod1 = ( /** @type {import('./types').IconData["svgChildrenConfigs"]} */svgChildrenConfigs, color, hoverColor) => {
   /** @type {{ [k:string]:React.CSSProperties; }} */
   const obj = {};
-
   for (const svgChildConfig of svgChildrenConfigs) {
     if (color) obj['& ' + svgChildConfig.selector] = {
       fill: svgChildConfig.fill ? color : undefined,
@@ -763,10 +757,8 @@ svgChildrenConfigs, color, hoverColor) => {
       stroke: svgChildConfig.stroke ? hoverColor : undefined
     };
   }
-
   return obj;
 };
-
 const useStyles$1 = reactJss.createUseStyles({
   '@keyframes slideRight': {
     to: {
@@ -810,8 +802,8 @@ const defaultSvgState = {
   childrenConfigs: [],
   attributes: defaultAttributes
 };
-/** @type {import('./props.type').IconProps} */
 
+/** @type {import('./props.type').IconProps} */
 const iconDefaultProps = {
   name: undefined,
   width: 'auto',
@@ -821,8 +813,8 @@ const iconDefaultProps = {
   opacity: undefined,
   className: undefined
 };
-/** @type {import("react").FC<import('./props.type').IconProps>} */
 
+/** @type {import("react").FC<import('./props.type').IconProps>} */
 const Icon = ({
   name,
   width,
@@ -841,10 +833,8 @@ const Icon = ({
   }, []);
   /** */
 
-  const rootRef = React.useRef(
-  /** @type {HTMLElement} */
-  null); // this ref is used to cancel the fetch promise success callback in case name prop changed
-
+  const rootRef = React.useRef( /** @type {HTMLElement} */null);
+  // this ref is used to cancel the fetch promise success callback in case name prop changed
   const currentName = React.useRef(name);
   const [svgState, setSvgState] = React.useState(defaultSvgState);
   const styles = useStyles$1({
@@ -855,46 +845,41 @@ const Icon = ({
     opacity,
     hoverColor
   });
-
   const _className = React.useMemo(() => `${styles.root} ${className || ''}`, [className]);
-
   React.useEffect(() => {
     // reset
     currentName.current = name;
     setSvgState(defaultSvgState);
     const icon = icons[name];
-
     if (icon) {
       /**
        * retrieve from cache
        * @type {Promise<string>}
        */
       let svgProm = Icon.getCachedSvgPromise(name);
-
       if (!svgProm) {
         svgProm = fetch(icon.url).then(r => r.text()).catch(() => {
           // unset in cache
           Icon.setCachedSvgPromise(name, undefined);
           return null;
-        }); //save in cache
-
+        });
+        //save in cache
         Icon.setCachedSvgPromise(name, svgProm);
       }
-
       svgProm.then(svg => {
         if (svg && isMounted.current && name === currentName.current) {
           const div = document.createElement('div');
-          div.innerHTML = svg; // set the new attributes
+          div.innerHTML = svg;
 
+          // set the new attributes
           const newAttributes = {};
-
           for (const ob of div.firstElementChild.attributes) {
             const camelCased = ob.name.replace(/(-|:)([a-z])/g, g => g[1].toUpperCase());
             newAttributes[camelCased] = ob.value;
-          } // setting the state in last.
-          // Set state calls are called immediately inside asynchronous operations, timeouts, and intervals.
-
+          }
 
+          // setting the state in last.
+          // Set state calls are called immediately inside asynchronous operations, timeouts, and intervals.
           setSvgState({
             innerHtml: div.firstElementChild.innerHTML,
             childrenConfigs: icon.svgChildrenConfigs,
@@ -914,14 +899,11 @@ const Icon = ({
     onClick: onClick
   }));
 };
-
 Icon.defaultProps = iconDefaultProps;
-/** static properties for caching */
 
+/** static properties for caching */
 Icon.cacheStore = {};
-
 Icon.getCachedSvgPromise = name => Icon.cacheStore[name];
-
 Icon.setCachedSvgPromise = (name, prom) => Icon.cacheStore[name] = prom;
 
 const useDropdownStyles = createUseStyles(theme => ({
@@ -1033,7 +1015,6 @@ function OptionList({
   isLandingPages
 }) {
   React.useContext(PageContext);
-
   const tabsDataModifier = () => {
     return optionsData?.map(dt => {
       return {
@@ -1045,7 +1026,6 @@ function OptionList({
       };
     });
   };
-
   const tabData = tabsDataModifier();
   const classes = useSectionStyles$a();
   return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -1134,31 +1114,24 @@ function DesktopHeader({
   const classes = useSectionStyles$a({
     isFixed
   });
-
   const optionDataFn = () => {
     let optionsArr = navData;
     let optionsData = [];
-
     if (optionsArr?.length > 5) {
       optionsData = optionsArr?.slice(0, 4);
     } else {
       optionsData = optionsArr;
     }
-
     return optionsData;
   };
-
   const moreContentFn = () => {
     let optionsArr = navData;
     let moreContent = [];
-
     if (optionsArr?.length > 5) {
       moreContent = optionsArr?.slice(4);
     }
-
     return moreContent;
   };
-
   return /*#__PURE__*/React__default["default"].createElement("nav", {
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -1216,7 +1189,6 @@ function MobileHeader({
   const navEl = React.useRef(null);
   React.useLayoutEffect(() => {
     const body = navEl?.current?.ownerDocument?.body;
-
     if (sideMenu) {
       body?.setAttribute('style', 'overflow: hidden;');
     } else {
@@ -1226,7 +1198,6 @@ function MobileHeader({
   let iosUrl = null;
   let androidUrl = null;
   let downloadLink = null;
-
   if (isTutorWebsite) {
     if (header?.iosUrl) {
       iosUrl = /*#__PURE__*/React__default["default"].createElement(Button, {
@@ -1249,7 +1220,6 @@ function MobileHeader({
         }
       });
     }
-
     if (header?.androidURL) {
       androidUrl = /*#__PURE__*/React__default["default"].createElement(Button, {
         data: {
@@ -1270,7 +1240,6 @@ function MobileHeader({
         }
       });
     }
-
     if (iosUrl && androidUrl) {
       downloadLink = /*#__PURE__*/React__default["default"].createElement("div", null, iosUrl, androidUrl);
     } else if (header?.iosUrl) {
@@ -1320,7 +1289,6 @@ function MobileHeader({
       downloadLink = null;
     }
   }
-
   return /*#__PURE__*/React__default["default"].createElement("nav", {
     ref: navEl,
     className: classes.section
@@ -1377,11 +1345,9 @@ function Header({
     isMobile,
     isTutorWebsite
   } = React.useContext(PageContext);
-
   const filterHiddenNavs = () => {
     return data?.navs?.filter(dt => !dt.isHiddenNav);
   };
-
   return isMobile ? /*#__PURE__*/React__default["default"].createElement(MobileHeader, {
     navData: filterHiddenNavs(),
     header: data,
@@ -1737,7 +1703,6 @@ const rustTheme = {
   light: colors.lightRust,
   lightest: colors.lightestRust
 };
-
 const generateThemePalette = themeColors => ({
   primary: themeColors,
   background: {
@@ -1760,7 +1725,6 @@ const generateThemePalette = themeColors => ({
     tertiary: colors.blueGrey
   }
 });
-
 const bluePalette = generateThemePalette(blueTheme);
 const redPalette = generateThemePalette(redTheme);
 const orangePalette = generateThemePalette(orangeTheme);
@@ -1801,9 +1765,7 @@ const fontComponents = {
   'Merriweather Sans': MerriweatherSans,
   'Arima Madurai': ArimaMadurai
 };
-
 const getFontComponent = font => fontComponents[font] || (() => null);
-
 function FontSeeder({
   fontFamily
 }) {
@@ -1813,37 +1775,30 @@ function FontSeeder({
 const useRubikFont = reactJss.createUseStyles({
   '@import': `url('https://fonts.googleapis.com/css2?family=Lato&family=Rubik:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap')`
 });
-
 function Rubik() {
   // to import "Rubik" font css
   useRubikFont();
   return null;
 }
-
 const useIbmPlexSansFont = reactJss.createUseStyles({
   '@import': 'url(https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap)'
 });
-
 function IbmPlexSans() {
   // to import "Ibm Plex Sans" font css
   useIbmPlexSansFont();
   return null;
 }
-
 const useMerriweatherSansFont = reactJss.createUseStyles({
   '@import': 'url(https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap)'
 });
-
 function MerriweatherSans() {
   // to import "Merriweather Sans" font css
   useMerriweatherSansFont();
   return null;
 }
-
 const useArimaMaduraiFont = reactJss.createUseStyles({
   '@import': 'url(https://fonts.googleapis.com/css2?family=Arima+Madurai:wght@400;500;700&display=swap)'
 });
-
 function ArimaMadurai() {
   // to import "Arima Madurai" font css
   useArimaMaduraiFont();
@@ -1851,35 +1806,35 @@ function ArimaMadurai() {
 }
 
 const TYPE_TO_COMPONENT_MAP$1 = {
-  BANNER_CAROUSEL_RIGHT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$k; })),
-  GRID_CARD: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$j; })),
-  BANNER_CAROUSEL_CENTER: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$i; })),
-  BANNER_CAROUSEL_LEFT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$h; })),
-  FORM_SUBSCRIBE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$g; })),
-  TEXT_TESTIMONIAL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$f; })),
-  VIDEO_TESTIMONIAL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$e; })),
-  VIDEO: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$d; })),
-  INFO: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$c; })),
-  TEXT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$b; })),
-  IMAGE_GALLERY: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$a; })),
-  FAQ_LISTING: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$9; })),
-  COURSE_CAROUSEL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$7; })),
-  TEAM_CARD: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$6; })),
-  TEXT_GRID: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$8; })),
-  CONTACT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$5; })),
-  FORM_ENQUIRY: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$4; })),
-  WEBINAR_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$3; })),
-  COURSE_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$2; })),
-  FORM_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$1; })),
-  TILES_SECTION: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index; }))
+  BANNER_CAROUSEL_RIGHT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$l; })),
+  GRID_CARD: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$k; })),
+  BANNER_CAROUSEL_CENTER: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$j; })),
+  BANNER_CAROUSEL_LEFT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$i; })),
+  FORM_SUBSCRIBE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$h; })),
+  TEXT_TESTIMONIAL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$g; })),
+  VIDEO_TESTIMONIAL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$f; })),
+  VIDEO: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$e; })),
+  INFO: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$d; })),
+  TEXT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$c; })),
+  IMAGE_GALLERY: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$b; })),
+  FAQ_LISTING: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$a; })),
+  COURSE_CAROUSEL: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$8; })),
+  TEAM_CARD: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$7; })),
+  TEXT_GRID: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$9; })),
+  CONTACT: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$6; })),
+  FORM_ENQUIRY: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$5; })),
+  WEBINAR_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$4; })),
+  COURSE_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$3; })),
+  FORM_LANDING_PAGE: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$2; })),
+  TILES_SECTION: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index$1; })),
+  EMAIL_DRIP_MARKET: /*#__PURE__*/React.lazy(() => Promise.resolve().then(function () { return index; }))
 };
-
 const getCompToRender$1 = type => TYPE_TO_COMPONENT_MAP$1[type] || (() => null);
-
 const MemoisedSection$1 = /*#__PURE__*/React.memo(({
   sectionData,
   extraProps
 }) => {
+  console.log('templatesectiondata', sectionData);
   const SectionComp = getCompToRender$1(sectionData.type);
   return /*#__PURE__*/React__default["default"].createElement(SectionComp, {
     sectionData: sectionData,
@@ -1891,9 +1846,7 @@ function SectionRenderer$1({
   extraProps
 }) {
   return /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
-    fallback: null
-    /*GIF maybe*/
-
+    fallback: null /*GIF maybe*/
   }, /*#__PURE__*/React__default["default"].createElement(MemoisedSection$1, {
     sectionData: sectionData,
     extraProps: extraProps
@@ -2177,23 +2130,18 @@ const getArrowRotationAngle = props => {
   switch (true) {
     case props.left:
       return 180;
-
     case props.up:
       return 270;
-
     case props.down:
       return 90;
-
     case props.right:
     default:
       return 0;
   }
 };
-
 const sizeHandler = ({
   size
 }) => size === 'small' ? '32px' : '48px';
-
 const useArrowButtonStyles = createUseStyles(theme => ({
   arrowButtonContainer: {
     cursor: 'pointer',
@@ -2233,7 +2181,6 @@ function dotsToShow(i, n) {
   const leftToShow = i < elementsToShow / 2;
   const rightToShow = n - i - 1 < elementsToShow / 2;
   let leftCount, rightCount;
-
   if (leftToShow) {
     leftCount = i;
     rightCount = elementsToShow - i - 1;
@@ -2244,13 +2191,11 @@ function dotsToShow(i, n) {
     leftCount = 2;
     rightCount = 2;
   }
-
   return {
     leftCount,
     rightCount
   };
 }
-
 function Carousel({
   settings,
   children,
@@ -2304,15 +2249,12 @@ function Carousel({
     ...settings,
     className: settings?.className ? settings?.className + ' ' + classes.sliderClass : classes.sliderClass
   };
-
   const nextClick = () => {
     sliderRef.current.slickNext();
   };
-
   const previousClick = () => {
     sliderRef.current.slickPrev();
   };
-
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Slider__default["default"], _extends({
     ref: sliderRef
   }, sliderSettings), children), hideArrow || isMobile ? null : /*#__PURE__*/React__default["default"].createElement("div", {
@@ -2328,7 +2270,7 @@ function Carousel({
   })));
 }
 
-function Section$3({
+function Section$4({
   nodeData
 }) {
   const classes = useSectionStyles$8();
@@ -2377,7 +2319,6 @@ function Section$3({
     src: nodeData.image.metadata.value
   })));
 }
-
 function BannerCarouselRight({
   sectionData
 }) {
@@ -2401,15 +2342,13 @@ function BannerCarouselRight({
     className: classes.bannerCarouselRightSection
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.sectionContainer
-  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, wrapperProps, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$3, {
+  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, wrapperProps, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$4, {
     nodeData: node,
-    key: idx
-    /* or some other unique property */
-
+    key: idx /* or some other unique property */
   })))));
 }
 
-var index$k = /*#__PURE__*/Object.freeze({
+var index$l = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': BannerCarouselRight
 });
@@ -2612,11 +2551,9 @@ function List({
     containerWidth
   });
   const [nodeData] = sectionData.components;
-
   const getNumber = val => {
     return val.toString().length == 1 ? '0' + val : val;
   };
-
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -2661,7 +2598,7 @@ function List({
   }))));
 }
 
-var index$j = /*#__PURE__*/Object.freeze({
+var index$k = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': List
 });
@@ -2760,7 +2697,7 @@ const useSectionStyles$6 = createUseStyles(theme => ({
   }
 }));
 
-const Section$2 = ({
+const Section$3 = ({
   nodeData
 }) => {
   const {
@@ -2808,7 +2745,6 @@ const Section$2 = ({
     size: isMobile ? 'small' : 'medium'
   })))));
 };
-
 function BannerCarouselCenter({
   sectionData
 }) {
@@ -2823,15 +2759,13 @@ function BannerCarouselCenter({
   } : {};
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.bannerCarouselCenterSection
-  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, wrapperProps, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$2, {
+  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, wrapperProps, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$3, {
     nodeData: node,
-    key: idx
-    /* or some other unique property */
-
+    key: idx /* or some other unique property */
   }))));
 }
 
-var index$i = /*#__PURE__*/Object.freeze({
+var index$j = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': BannerCarouselCenter
 });
@@ -2943,7 +2877,7 @@ const useSectionStyles$5 = createUseStyles(theme => {
   };
 });
 
-function Section$1({
+function Section$2({
   nodeData
 }) {
   const classes = useSectionStyles$5();
@@ -2994,7 +2928,6 @@ function Section$1({
     size: isMobile ? 'small' : 'medium'
   })));
 }
-
 function BannerCarouselLeft({
   sectionData
 }) {
@@ -3014,15 +2947,13 @@ function BannerCarouselLeft({
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.sectionContainer
-  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, null, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$1, {
+  }, /*#__PURE__*/React__default["default"].createElement(Wrapper, null, bannerCarousel.components.map((node, idx) => /*#__PURE__*/React__default["default"].createElement(Section$2, {
     nodeData: node,
-    key: idx
-    /* or some other unique property */
-
+    key: idx /* or some other unique property */
   })))));
 }
 
-var index$h = /*#__PURE__*/Object.freeze({
+var index$i = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': BannerCarouselLeft
 });
@@ -3173,7 +3104,6 @@ async function postApiCall(baseURLs, data) {
         },
         data
       });
-
       if (res) {
         return res.data;
       }
@@ -3198,7 +3128,6 @@ async function postApiCallForm(baseURLs, data, extraProps) {
         if (extraProps && extraProps.formSubmitSuccess) {
           extraProps.formSubmitSuccess();
         }
-
         return res.data;
       });
     } catch (err) {
@@ -3311,7 +3240,6 @@ function SubscribeToNewsletter({
   const [inputVal, setInputVal] = React.useState(formInitialValue);
   let [isValid, setIsValid] = React.useState(true);
   let [btnDisabled, setBtnDisabled] = React.useState(false);
-
   const handleSubmit = () => {
     let data = {
       sectionId: sectionData.sectionId,
@@ -3327,11 +3255,9 @@ function SubscribeToNewsletter({
     setBtnDisabled(true);
     setInputVal(formInitialValue);
   };
-
   const checkValidity = () => {
     if (validations?.[nodeData?.inputField?.metadata?.validationType]?.length) {
       let regex = new RegExp(validations[nodeData?.inputField?.metadata?.validationType]);
-
       if (regex?.test(inputVal)) {
         setIsValid(true);
       } else {
@@ -3339,7 +3265,6 @@ function SubscribeToNewsletter({
       }
     }
   };
-
   React.useEffect(() => {
     if (!isValid) {
       setBtnDisabled(true);
@@ -3417,7 +3342,7 @@ function SubscribeToNewsletter({
   })))))));
 }
 
-var index$g = /*#__PURE__*/Object.freeze({
+var index$h = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': SubscribeToNewsletter
 });
@@ -3584,7 +3509,7 @@ function QuotesComponent() {
   }));
 }
 
-function Section({
+function Section$1({
   nodeData
 }) {
   const {
@@ -3667,19 +3592,18 @@ function Section({
     className: classes.contentRow
   }, carouselContent))));
 }
-
 function Testimonials({
   sectionData
 }) {
   const classes = useTestimonialStyles();
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.testimonialContainer
-  }, /*#__PURE__*/React__default["default"].createElement(Section, {
+  }, /*#__PURE__*/React__default["default"].createElement(Section$1, {
     nodeData: sectionData.components[0]
   }));
 }
 
-var index$f = /*#__PURE__*/Object.freeze({
+var index$g = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': Testimonials
 });
@@ -3732,7 +3656,6 @@ const loaderStyle = theme => ({
 });
 
 const useStyles = reactJss.createUseStyles(loaderStyle);
-
 function Loader({
   texts
 }) {
@@ -3744,13 +3667,11 @@ function Loader({
   React.useEffect(() => {
     if (texts && texts.length) {
       let textID = '';
-
       for (let i = 0; i < texts.length; i++) {
         textID = setTimeout(() => {
           setLoaderText(texts[i]);
         }, 2000 * i);
       }
-
       return () => {
         clearTimeout(textID);
       };
@@ -3818,18 +3739,15 @@ function VideoPlayer(props) {
     imageUrl: imageUrl
   });
   const theme = useTheme();
-
   function getId(url) {
     var regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
     var match = url?.match(regExp);
-
     if (match?.[2].length == 11) {
       return 'https://www.youtube.com/embed/' + match[2];
     } else {
       return url;
     }
   }
-
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, !isLoaded && /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.imgContainer
   }, isEnabled ? /*#__PURE__*/React__default["default"].createElement(Loader, null) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, props.onlyThumbnail ? null : /*#__PURE__*/React__default["default"].createElement(Icon, {
@@ -4058,7 +3976,7 @@ function VideoTestimonial({
   }))))));
 }
 
-var index$e = /*#__PURE__*/Object.freeze({
+var index$f = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': VideoTestimonial
 });
@@ -4286,7 +4204,7 @@ function Video({
   }, carouselContent))));
 }
 
-var index$d = /*#__PURE__*/Object.freeze({
+var index$e = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': Video
 });
@@ -4512,7 +4430,7 @@ function Info({
   }, carouselContent))));
 }
 
-var index$c = /*#__PURE__*/Object.freeze({
+var index$d = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': Info
 });
@@ -4631,7 +4549,7 @@ const TextSection = ({
   })))));
 };
 
-var index$b = /*#__PURE__*/Object.freeze({
+var index$c = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': TextSection
 });
@@ -4672,8 +4590,8 @@ const usePhotoGalleryStyles = createUseStyles(theme => {
       width: 'calc(100% - 2px)',
       position: 'relative',
       paddingBottom: '59.83%' // keeping aspect ratio 585x350
-
     },
+
     contentRow: {
       display: 'grid',
       gridTemplateColumns: ({
@@ -4788,7 +4706,7 @@ function PhotoGallery({
   }, carouselContent))));
 }
 
-var index$a = /*#__PURE__*/Object.freeze({
+var index$b = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': PhotoGallery
 });
@@ -4932,7 +4850,6 @@ const FAQListing = ({
     isSelected: selectedIndex === index
   })))));
 };
-
 const Accordion = ({
   item,
   isSelected,
@@ -4966,7 +4883,7 @@ const Accordion = ({
   })));
 };
 
-var index$9 = /*#__PURE__*/Object.freeze({
+var index$a = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': FAQListing
 });
@@ -5131,7 +5048,7 @@ const TextGrid = ({
   }, carouselContent))));
 };
 
-var index$8 = /*#__PURE__*/Object.freeze({
+var index$9 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': TextGrid
 });
@@ -5217,9 +5134,10 @@ const useCourseStyles = createUseStyles(theme => {
       flexGrow: 1,
       display: 'flex',
       flexDirection: 'column',
-      justifyContent: 'space-between' //alignItems: 'center',
-
+      justifyContent: 'space-between'
+      //alignItems: 'center',
     },
+
     courseCardTags: {
       display: 'flex',
       justifyContent: 'flex-start',
@@ -5245,11 +5163,12 @@ const useCourseStyles = createUseStyles(theme => {
       wordBreak: 'break-word',
       padding: '12px 0px',
       textAlign: 'left',
-      display: 'inline-block' // overflow: 'hidden',
+      display: 'inline-block'
+      // overflow: 'hidden',
       // whiteSpace: 'nowrap',
       // textOverflow: 'ellipsis'
-
     },
+
     courseCardDiscount: {
       display: 'flex',
       justifyContent: 'flex-start',
@@ -5331,7 +5250,8 @@ const useCourseStyles = createUseStyles(theme => {
       }
     },
     '@media (max-width: 768px)': {
-      coursesContainer: {//background: theme?.palette?.background?.primary
+      coursesContainer: {
+        //background: theme?.palette?.background?.primary
       },
       coursesCardAndText: {
         padding: '70px 30px'
@@ -5363,7 +5283,6 @@ async function getCourseList(baseURLs, hashToken) {
   if (!hashToken) {
     throw 'Missing hash token';
   }
-
   const res = await axios__default["default"]({
     method: 'get',
     baseURL: baseURLs?.API_COURSE_URL,
@@ -5375,7 +5294,6 @@ async function getCourseList(baseURLs, hashToken) {
       requiredFilters: '[10]'
     }
   });
-
   if (res) {
     return res.data;
   }
@@ -5387,7 +5305,6 @@ function getShortenedSubstring(name, length, allowDots = true) {
   if (name) {
     return name.length < length ? name : `${name.substr(0, length)}${allowDots && '...'}`;
   }
-
   return '';
 }
 
@@ -5467,13 +5384,11 @@ function courses({
     containerWidth
   });
   const [nodeData] = sectionData?.components;
-
   const handleApiCall = () => {
     if (baseURLs) {
       getCourseList(baseURLs, hashToken).then(response => {
         const placeholders = nodeData?.cardCarousel?.metadata?.placeholders;
         const coursesData = response?.data?.coursesData;
-
         if (coursesData && coursesData.length) {
           setCardList(response?.data?.coursesData);
           setShowShimmer(false);
@@ -5484,12 +5399,12 @@ function courses({
               setShowShimmer(false);
               setFallbackImages(placeholders);
             }
-          } // For User Website & Draft Preview: If no data found, hide section.
+          }
+          // For User Website & Draft Preview: If no data found, hide section.
           else setErrored(true);
         }
       }).catch(err => {
         const errMsg = err?.response?.data?.data?.message;
-
         if (errMsg === 'NOT_FOUND') {
           if (nodeData?.cardCarousel?.metadata?.placeholders?.length && isEdit) {
             setShowShimmer(false);
@@ -5501,16 +5416,16 @@ function courses({
       });
     }
   };
-
   React.useEffect(() => {
-    const placeholders = nodeData?.cardCarousel?.metadata?.placeholders; // For Master template Preview: Show placeholder images. If placeholder doesn't come from backend, show shimmer.
-
+    const placeholders = nodeData?.cardCarousel?.metadata?.placeholders;
+    // For Master template Preview: Show placeholder images. If placeholder doesn't come from backend, show shimmer.
     if (isMasterTemplate) {
       if (placeholders && placeholders.length) {
         setShowShimmer(false);
         setFallbackImages(placeholders);
       }
-    } // other
+    }
+    // other
     else {
       handleApiCall();
     }
@@ -5575,7 +5490,6 @@ function courses({
     });
   })))));
 }
-
 function SimpleCardsContainer({
   children,
   classes
@@ -5585,7 +5499,7 @@ function SimpleCardsContainer({
   }, children);
 }
 
-var index$7 = /*#__PURE__*/Object.freeze({
+var index$8 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': courses
 });
@@ -5808,7 +5722,7 @@ function TeamCard({
   }, " ", carouselContent)));
 }
 
-var index$6 = /*#__PURE__*/Object.freeze({
+var index$7 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': TeamCard
 });
@@ -5991,7 +5905,6 @@ function FormEnquiry({
       setBtnDisabled(true);
     }
   }, [validData]);
-
   const handleSubmit = () => {
     let data = {
       sectionId: sectionData?._id || null,
@@ -6002,23 +5915,22 @@ function FormEnquiry({
     setBtnDisabled(true);
     setInputVal(formInitialValue);
   };
-
   const checkValidity = (regexField, fieldname, fieldValidity) => {
     if (validations?.[regexField]?.length) {
       let regex = new RegExp(validations[regexField]);
-
       if (regex?.test(inputVal[fieldname])) {
-        setValidData({ ...validData,
+        setValidData({
+          ...validData,
           [fieldValidity]: 1
         });
       } else {
-        setValidData({ ...validData,
+        setValidData({
+          ...validData,
           [fieldValidity]: 0
         });
       }
     }
   };
-
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -6098,7 +6010,8 @@ function FormEnquiry({
     isValid: validData.nameValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         name: e.target.value
       });
     },
@@ -6106,7 +6019,8 @@ function FormEnquiry({
       checkValidity(nodeData?.nameField?.metadata?.validationType, 'name', 'nameValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         nameValid: 1
       });
     }
@@ -6118,7 +6032,8 @@ function FormEnquiry({
     isValid: validData.phoneValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         phone: e.target.value
       });
     },
@@ -6126,7 +6041,8 @@ function FormEnquiry({
       checkValidity(nodeData?.phoneField?.metadata?.validationType, 'phone', 'phoneValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         phoneValid: 1
       });
     }
@@ -6138,7 +6054,8 @@ function FormEnquiry({
     isValid: validData.emailValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         email: e.target.value
       });
     },
@@ -6146,7 +6063,8 @@ function FormEnquiry({
       checkValidity(nodeData?.emailField?.metadata?.validationType, 'email', 'emailValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         emailValid: 1
       });
     }
@@ -6158,7 +6076,8 @@ function FormEnquiry({
     isValid: validData.messageValid,
     inputType: 'textarea',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         message: e.target.value
       });
     },
@@ -6166,7 +6085,8 @@ function FormEnquiry({
       checkValidity(nodeData?.messageField?.metadata?.validationType, 'message', 'messageValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         messageValid: 1
       });
     }
@@ -6184,7 +6104,7 @@ function FormEnquiry({
   }))))));
 }
 
-var index$5 = /*#__PURE__*/Object.freeze({
+var index$6 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': FormEnquiry
 });
@@ -6397,7 +6317,6 @@ function Contact({
     phoneValid: 1,
     messageValid: 1
   });
-
   const handleSubmit = () => {
     const data = {
       sectionId: sectionData?._id || null,
@@ -6408,7 +6327,6 @@ function Contact({
     setBtnDisabled(true);
     setInputVal(formInitialValue);
   };
-
   React.useEffect(() => {
     if (validData?.nameValid && validData?.emailValid && validData?.phoneValid && validData?.messageValid) {
       setBtnDisabled(false);
@@ -6416,23 +6334,22 @@ function Contact({
       setBtnDisabled(true);
     }
   }, [validData]);
-
   const checkValidity = (regexField, fieldname, fieldValidity) => {
     if (validations?.[regexField]?.length) {
       let regex = new RegExp(validations[regexField]);
-
       if (regex?.test(inputVal[fieldname])) {
-        setValidData({ ...validData,
+        setValidData({
+          ...validData,
           [fieldValidity]: 1
         });
       } else {
-        setValidData({ ...validData,
+        setValidData({
+          ...validData,
           [fieldValidity]: 0
         });
       }
     }
   };
-
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -6474,7 +6391,8 @@ function Contact({
     isValid: validData.nameValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         name: e.target.value
       });
     },
@@ -6482,7 +6400,8 @@ function Contact({
       checkValidity(nodeData?.nameField?.metadata?.validationType, 'name', 'nameValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         nameValid: 1
       });
     }
@@ -6494,7 +6413,8 @@ function Contact({
     isValid: validData.phoneValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         phone: e.target.value
       });
     },
@@ -6502,7 +6422,8 @@ function Contact({
       checkValidity(nodeData?.phoneField?.metadata?.validationType, 'phone', 'phoneValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         phoneValid: 1
       });
     }
@@ -6514,7 +6435,8 @@ function Contact({
     isValid: validData.emailValid,
     inputType: 'input',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         email: e.target.value
       });
     },
@@ -6522,7 +6444,8 @@ function Contact({
       checkValidity(nodeData?.emailField?.metadata?.validationType, 'email', 'emailValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         emailValid: 1
       });
     }
@@ -6534,7 +6457,8 @@ function Contact({
     isValid: validData.messageValid,
     inputType: 'textarea',
     onChange: e => {
-      setInputVal({ ...inputVal,
+      setInputVal({
+        ...inputVal,
         message: e.target.value
       });
     },
@@ -6542,7 +6466,8 @@ function Contact({
       checkValidity(nodeData?.messageField?.metadata?.validationType, 'message', 'messageValid');
     },
     onFocus: () => {
-      setValidData({ ...validData,
+      setValidData({
+        ...validData,
         messageValid: 1
       });
     }
@@ -6560,7 +6485,7 @@ function Contact({
   }))))));
 }
 
-var index$4 = /*#__PURE__*/Object.freeze({
+var index$5 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': Contact
 });
@@ -6803,7 +6728,8 @@ const useWebinarPromotionPage = createUseStyles(theme => {
 const SingleVideoSlide$1 = props => {
   const [isReadMore, setIsReadMore] = React.useState(false);
   const theme = useTheme();
-  React.useEffect(() => {// remaining days epoch
+  React.useEffect(() => {
+    // remaining days epoch
     // current date epoch
     // subtract remaining days from current day epoch
     // moment the result - and see if there are days
@@ -6815,7 +6741,6 @@ const SingleVideoSlide$1 = props => {
     webinarCtaClick,
     conversions = 0
   } = props;
-
   const renderer = ({
     days,
     hours,
@@ -6831,9 +6756,7 @@ const SingleVideoSlide$1 = props => {
       return /*#__PURE__*/React__default["default"].createElement("span", null, Math.floor(moment__default["default"].duration(given.diff(current)).asDays()), " day(s)");
     }
   };
-
   const checkIfOfferIsValid = () => moment__default["default"]().diff(moment__default["default"](props.data.offerPriceEndDate)) < 0;
-
   const checkForShowDiscount = () => {
     if (props.data.endDate === null || checkIfOfferIsValid()) {
       if (data.discount > 0 && data.offerPriceValidFor === 0) {
@@ -6845,19 +6768,16 @@ const SingleVideoSlide$1 = props => {
       if (data.offerPriceValidFor <= conversions) {
         return false;
       }
-
       if (data.offerPriceValidFor - conversions < 0) {
         return false;
       } else {
         return true;
       }
     }
-
     if (data.discount > 0) {
       return true;
     }
   };
-
   const discount = ({
     price,
     discount
@@ -6865,7 +6785,6 @@ const SingleVideoSlide$1 = props => {
     console.log('discountxx', props.data.price, props.data.discount);
     return (discount / price * 100).toFixed(2);
   };
-
   const classes = useWebinarPromotionPage();
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoCarouselContainer
@@ -6961,9 +6880,10 @@ const SingleVideoSlide$1 = props => {
     data: {
       // link: 'headerData?.loginCtaLink',
       // isLink: 1,
-      value: data.isPaid ? 'BUY NOW' : 'REGISTER NOW' // isExternal: 1
-
+      value: data.isPaid ? 'BUY NOW' : 'REGISTER NOW'
+      // isExternal: 1
     },
+
     onClick: webinarCtaClick,
     type: 'primary',
     size: 'medium',
@@ -6997,7 +6917,7 @@ function CoursePromotionPage$1({
   }))));
 }
 
-var index$3 = /*#__PURE__*/Object.freeze({
+var index$4 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': CoursePromotionPage$1
 });
@@ -7297,14 +7217,14 @@ const SingleVideoSlide = props => {
     isEdit
   } = React.useContext(PageContext);
   console.log(isEdit, 'isEdit');
-  React.useEffect(() => {// remaining days epoch
+  React.useEffect(() => {
+    // remaining days epoch
     // current date epoch
     // subtract remaining days from current day epoch
     // moment the result - and see if there are days
     // days is present show days
     // else start reverse timer
   }, []);
-
   const renderer = ({
     days,
     hours,
@@ -7320,7 +7240,6 @@ const SingleVideoSlide = props => {
       return /*#__PURE__*/React__default["default"].createElement("span", null, Math.floor(moment__default["default"].duration(given.diff(current)).asDays()), " day(s)");
     }
   };
-
   const {
     data,
     courseBuyNow,
@@ -7329,9 +7248,7 @@ const SingleVideoSlide = props => {
   } = props;
   const showCourseInstallmentData = data?.courseOverviewData;
   const InstalmentData = isEdit ? data?.courseOverviewData?.installments?.formData?.installments[0].installmentAmount : data?.courseOverviewData?.installments?.formData?.installmentInfo?.installments[0].installmentPrice;
-
   const checkIfOfferIsValid = () => moment__default["default"]().diff(moment__default["default"](props?.data?.endDate || 0)) < 0;
-
   const checkForShowDiscount = () => {
     if (props.data.endDate === null || checkIfOfferIsValid()) {
       if (data.discount > 0 && data.offerPriceValidFor === 0) {
@@ -7343,28 +7260,23 @@ const SingleVideoSlide = props => {
       if (data.offerPriceValidFor <= conversions) {
         return false;
       }
-
       if (data.offerPriceValidFor - conversions < 0) {
         return false;
       } else {
         return true;
       }
     }
-
     if (data.discount > 0) {
       return true;
     }
   };
-
   const classes = useCoursePromotionPage();
-
   const discount = ({
     price,
     discount
   }) => {
     return (discount / price * 100).toFixed(2);
   };
-
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoCarouselContainer
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -7478,15 +7390,16 @@ const SingleVideoSlide = props => {
     data: {
       // link: 'headerData?.loginCtaLink',
       // isLink: 1,
-      value: 'BUY NOW' // isExternal: 1
-
+      value: 'BUY NOW'
+      // isExternal: 1
     },
+
     onClick: courseBuyNow,
     type: 'primary',
     size: 'medium',
     target: null,
-    rel: null // styling={isMobile ? { margin: '0 40px' } : {}}
-
+    rel: null
+    // styling={isMobile ? { margin: '0 40px' } : {}}
   })))), showCourseInstallmentData && InstalmentData && /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.payInstallmentContainer,
     onClick: showCourseInstallment
@@ -7533,7 +7446,7 @@ function CoursePromotionPage({
   }))));
 }
 
-var index$2 = /*#__PURE__*/Object.freeze({
+var index$3 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': CoursePromotionPage
 });
@@ -7691,18 +7604,15 @@ const FormPage = ({
     _id,
     baseURLs
   } = React.useContext(PageContext);
-
   const handleSubmit = async e => {
     e.preventDefault();
     let formResponse = [];
-
     for (const [key, value] of Object.entries(formData)) {
       if (value.questionType === 'MC') {
         if (value.solutionArray.length > 1) {
           value.solutionArray.shift();
         }
       }
-
       formResponse.push({
         questionId: key,
         questionName: value.questionName,
@@ -7710,7 +7620,6 @@ const FormPage = ({
         solutionArray: value.solutionArray
       });
     }
-
     const data = {
       sectionId: sectionData?.components?.[0]?._id || null,
       landingPageId: _id || null,
@@ -7720,7 +7629,6 @@ const FormPage = ({
     setFormData({});
     setformSubmitted(!formSubmitted);
   };
-
   React.useEffect(() => {
     //add all questions to formData
     let formData = {};
@@ -7733,23 +7641,26 @@ const FormPage = ({
     });
     setFormData(formData);
   }, [metadata, formSubmitted]);
-
   const handleOnClick = (e, item, option) => {
     // if the checkbox is checked
     if (!e.target.checked) {
       // if the checkbox is checked and the solution array is empty
       if (!formData[item._id]?.solutionArray?.length) {
-        setFormData({ ...formData,
+        setFormData({
+          ...formData,
           [item._id]: {
             questionName: item.text,
             solutionArray: [option.value],
             questionType: 'MC'
           }
         });
-      } // if the checkbox is checked and the solution array is not empty and the value is already in the array remove it
+      }
+      // if the checkbox is checked and the solution array is not empty and the value is already in the array remove it
       else if (formData[item._id]?.solutionArray?.includes(option.value)) {
         // if only one value is in the array remove it
-        setFormData({ ...formData,
+
+        setFormData({
+          ...formData,
           [item._id]: {
             questionName: item.text,
             solutionArray: formData[item._id]?.solutionArray?.filter(item => item !== option.value),
@@ -7757,20 +7668,24 @@ const FormPage = ({
           }
         });
       }
-    } // if the checkbox is unchecked
+    }
+    // if the checkbox is unchecked
     else {
       // if the checkbox is unchecked and the solution array is empty
       if (typeof formData[item._id]?.solutionArray?.length === 'undefined') {
-        setFormData({ ...formData,
+        setFormData({
+          ...formData,
           [item._id]: {
             questionName: item.text,
             solutionArray: [option.value],
             questionType: 'MC'
           }
         });
-      } // if the checkbox is unchecked and the solution array is not empty and the value is not in the array add it
+      }
+      // if the checkbox is unchecked and the solution array is not empty and the value is not in the array add it
       else if (!formData[item._id]?.solutionArray?.includes(option.value)) {
-        setFormData({ ...formData,
+        setFormData({
+          ...formData,
           [item._id]: {
             questionName: item.text,
             solutionArray: [...formData[item._id]?.solutionArray, option.value],
@@ -7780,7 +7695,6 @@ const FormPage = ({
       }
     }
   };
-
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.formPageSection
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -7807,7 +7721,8 @@ const FormPage = ({
     placeholder: "Short answer",
     name: item._id,
     onChange: e => {
-      setFormData({ ...formData,
+      setFormData({
+        ...formData,
         [item._id]: {
           index,
           questionName: item.text,
@@ -7847,11 +7762,13 @@ const FormPage = ({
     name: "text",
     required: item.isRequired,
     value: option.value,
-    checked: formData[item._id]?.solutionArray?.[0] === option.value // name={option.value}
+    checked: formData[item._id]?.solutionArray?.[0] === option.value
+    // name={option.value}
     // id={option.value}
     ,
     onClick: e => {
-      setFormData({ ...formData,
+      setFormData({
+        ...formData,
         [item._id]: {
           questionName: item.text,
           solutionArray: [option.value],
@@ -7867,9 +7784,10 @@ const FormPage = ({
     data: {
       // link: 'headerData?.loginCtaLink',
       // isLink: 1,
-      value: 'SUBMIT' // isExternal: 1
-
+      value: 'SUBMIT'
+      // isExternal: 1
     },
+
     type: 'primary',
     size: 'medium',
     target: null,
@@ -7877,7 +7795,7 @@ const FormPage = ({
   })))));
 };
 
-var index$1 = /*#__PURE__*/Object.freeze({
+var index$2 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': FormPage
 });
@@ -7963,7 +7881,6 @@ function Tiles({
   const nodeData = sectionData.components;
   console.log(nodeData);
   const tilesList = nodeData[0]?.tilesList.components;
-
   const handleClick = value => {
     if (!isEdit && value) {
       if (value.indexOf('http://') == 0 || value.indexOf('https://') == 0) {
@@ -7973,7 +7890,6 @@ function Tiles({
       }
     }
   };
-
   const TileDiv = tilesList?.map((tile, i) => {
     return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
       key: i
@@ -8010,11 +7926,437 @@ function Tiles({
   }, TileDiv)));
 }
 
-var index = /*#__PURE__*/Object.freeze({
+var index$1 = /*#__PURE__*/Object.freeze({
   __proto__: null,
   'default': Tiles
 });
 
+const useEmailStyles = createUseStyles(theme => ({
+  wrapper: {
+    fontFamily: theme?.typography?.fontFamily,
+    width: '100%',
+    tableLayout: 'fixed',
+    backgroundColor: '#cccccc'
+  },
+  email_description_para: {
+    '& p': {
+      margin: '0 0 0 !important'
+    }
+  },
+  main: {
+    backgroundColor: '#ffffff',
+    width: '100%',
+    maxWidth: '600px',
+    borderSpacing: '0'
+  },
+  logoimg: {
+    width: '28px',
+    height: '28px'
+    /* margin: 18px 0px; */
+  },
+
+  'p-young-guru-title': {
+    fontFamily: theme?.typography?.fontFamily,
+    fontStyle: 'normal',
+    fontWeight: '500',
+    fontSize: '24px',
+    lineHeight: '31px',
+    color: '#ffffff',
+    marginTop: '18px'
+  },
+  'p-young-guru-sub-title': {
+    fontFamily: theme?.typography?.fontFamily,
+    fontStyle: 'normal',
+    fontWeight: '400',
+    fontSize: '16px',
+    lineHeight: '21px',
+    color: '#dbd9d9',
+    marginBottom: '18px'
+  },
+  p: {
+    padding: '0',
+    margin: '0 !important'
+  },
+  'two-columns': {
+    fontSize: '0',
+    textAlign: 'center'
+    /* padding:35px 0 40px */
+  },
+
+  'two-columns .column': {
+    width: '100%',
+    maxWidth: '275px',
+    display: 'inline-block',
+    verticalAlign: 'top'
+  },
+  'title-lead': {
+    fontFamily: theme?.typography?.fontFamily,
+    fontStyle: 'normal',
+    fontWeight: '500',
+    fontSize: '20px',
+    lineHeight: '26px',
+    color: '#030a21',
+    marginBottom: '5px',
+    textAlign: 'left'
+  }
+
+  //   @media screen and (max-width: 600px) {
+  //   }
+}));
+
+function Section({
+  nodeData,
+  emailRef,
+  customHtmlData
+}) {
+  console.log('customHtmlData', customHtmlData);
+  const header = nodeData?.components[0];
+  const body = nodeData?.components[1];
+  const landing = nodeData?.components[2];
+  const footer = nodeData?.components[3];
+  const classes = useEmailStyles();
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("center", {
+    className: classes.wrapper,
+    ref: emailRef
+  }, /*#__PURE__*/React__default["default"].createElement("table", {
+    className: classes.main,
+    style: {
+      width: '100%'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tbody", null, customHtmlData?.isCustomHtml ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classes.email_description_para,
+    dangerouslySetInnerHTML: {
+      __html: `${customHtmlData?.html ? customHtmlData?.html : ''}`
+      // __html: '<div>sdnfksdnflksdnfklsndk</div>'
+    }
+  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, header?.isActive ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      textAlign: 'center',
+      background: '#ffffff',
+      paddingTop: '16px',
+      width: '100%'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
+    style: {
+      display: 'inline-block'
+    }
+  }, header?.components[0]?.metadata?.image?.length ? /*#__PURE__*/React__default["default"].createElement("img", {
+    src: header?.components[0]?.metadata?.image,
+    alt: "",
+    className: classes.logoimg
+  }) : /*#__PURE__*/React__default["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      fontStyle: 'italic',
+      minHeight: '30px'
+    }
+  }, "Your logo")))))), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, header?.components[1]?.metadata?.image?.length ? /*#__PURE__*/React__default["default"].createElement("img", {
+    src: header?.components[1]?.metadata?.image
+    // width={600}
+    ,
+    alt: "",
+    style: {
+      maxWidth: '600px',
+      width: '100%',
+      marginBottom: '-4px'
+    }
+  }) : /*#__PURE__*/React__default["default"].createElement("div", {
+    style: {
+      maxWidth: '600px',
+      width: '100%',
+      marginBottom: '-4px',
+      minHeight: '250px',
+      background: '#F4F9FD',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      fontStyle: 'italic'
+    }
+  }, "Cover Image")))) : null, body && body?.isActive ? /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      textAlign: 'center',
+      width: '100%',
+      backgroundColor: '#ffffff'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '700',
+      fontSize: '24.2487px',
+      lineHeight: '29px',
+      textAlign: 'center',
+      color: '#00ade7',
+      marginTop: '24px'
+    },
+    ref: body?.components[0]?.refSetter
+  }, body?.components[0]?.metadata?.text), /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '500',
+      fontSize: '18.1865px',
+      lineHeight: '22px',
+      textAlign: 'center',
+      color: '#0a1629',
+      marginTop: '8px',
+      marginBottom: '15px'
+    },
+    ref: body?.components[1]?.refSetter
+  }, body?.components[1]?.metadata?.text), /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      maxWidth: '435px',
+      margin: 'auto',
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '400',
+      fontSize: '16.1658px',
+      lineHeight: '22px',
+      color: '#3c4852',
+      textAlign: 'left'
+    },
+    dangerouslySetInnerHTML: {
+      __html: body?.components[2]?.metadata?.text
+    },
+    className: classes.email_description_para,
+    ref: body?.components[2]?.refSetter
+  })))))) : null, landing?.isActive ? /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      width: '100%',
+      padding: '12px'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      width: '100%',
+      background: '#f4f9fd',
+      borderRadius: '16px',
+      padding: '32px',
+      textAlign: 'center'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, landing?.components[0]?.metadata?.image?.length ? /*#__PURE__*/React__default["default"].createElement("img", {
+    src: landing?.components[0]?.metadata?.image,
+    alt: "",
+    style: {
+      width: '100%'
+    }
+  }) : /*#__PURE__*/React__default["default"].createElement("div", {
+    style: {
+      background: '#D9D9D9F0',
+      width: '100%',
+      minHeight: '250px',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      fontStyle: 'italic'
+    }
+  }, "Thumbnail Image"), /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '500',
+      fontSize: '18.1865px',
+      lineHeight: '22px',
+      color: '#0a1629',
+      marginTop: '16px',
+      marginBottom: '16px',
+      textAlign: 'left'
+    },
+    ref: landing?.components[1]?.refSetter
+  }, landing?.components[1]?.metadata?.text), /*#__PURE__*/React__default["default"].createElement("a", {
+    href: landing?.components[3]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      background: '#009ae0',
+      borderRadius: '7.18333px',
+      color: 'white',
+      textDecoration: 'none',
+      padding: '12px 0px',
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '600',
+      fontSize: '20.55px',
+      lineHeight: '32px',
+      textTransform: 'uppercase',
+      color: '#fafafa'
+    },
+    ref: landing?.components[2]?.refSetter
+  }, landing?.components[2]?.metadata?.text)))))))))) : null, footer?.isActive ? /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      width: '100%',
+      background: '#e3f0ff',
+      textAlign: 'center'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '700',
+      fontSize: '18px',
+      lineHeight: '29px',
+      textAlign: 'center',
+      color: '#0a1629',
+      marginTop: '32px'
+    }
+  }, "Connect with us on:"), /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      width: '100%',
+      marginTop: '8px',
+      marginBottom: '16px'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tbody", null, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("a", {
+    href: footer?.components[0]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: footer?.components[0]?.metadata?.text ? footer?.components[0]?.metadata?.iconUrlColor : footer?.components[0]?.metadata?.iconUrl,
+    alt: "",
+    style: {
+      width: '36px',
+      height: '36px'
+    },
+    ref: footer?.components[0]?.refSetter
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
+    href: footer?.components[1]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: footer?.components[1]?.metadata?.text ? footer?.components[1]?.metadata?.iconUrlColor : footer?.components[1]?.metadata?.iconUrl,
+    alt: "",
+    style: {
+      width: '36px',
+      height: '36px',
+      margin: '0px 12px'
+    },
+    ref: footer?.components[1]?.refSetter
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
+    href: footer?.components[2]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: footer?.components[2]?.metadata?.text ? footer?.components[2]?.metadata?.iconUrlColor : footer?.components[2]?.metadata?.iconUrl,
+    alt: "",
+    style: {
+      width: '36px',
+      height: '36px'
+    },
+    ref: footer?.components[2]?.refSetter
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
+    href: footer?.components[3]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: footer?.components[3]?.metadata?.text ? footer?.components[3]?.metadata?.iconUrlColor : footer?.components[3]?.metadata?.iconUrl,
+    alt: "",
+    style: {
+      width: '36px',
+      height: '36px',
+      margin: '0px 12px'
+    },
+    ref: footer?.components[3]?.refSetter
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
+    href: footer?.components[4]?.metadata?.text,
+    target: "_blank",
+    style: {
+      textDecoration: 'none'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: footer?.components[4]?.metadata?.text ? footer?.components[4]?.metadata?.iconUrlColor : footer?.components[4]?.metadata?.iconUrl,
+    alt: "",
+    style: {
+      width: '36px',
+      height: '36px'
+    },
+    ref: footer?.components[4]?.refSetter
+  })), /*#__PURE__*/React__default["default"].createElement("table", {
+    style: {
+      width: '100%',
+      marginTop: '13px'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", null, /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '400',
+      fontSize: '14.1451px',
+      lineHeight: '21px',
+      textAlign: 'center',
+      color: '#7d8592'
+    }
+  }, "For any concerns, mail us at", ' ' + footer?.components[5]?.metadata?.text), /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '400',
+      fontSize: '14.1451px',
+      lineHeight: '24px',
+      textAlign: 'center',
+      color: '#7d8592'
+    }
+  }, "Copyright \xA9 2022 |", ' ' + footer?.components[5]?.metadata?.text), /*#__PURE__*/React__default["default"].createElement("p", {
+    style: {
+      // fontFamily: 'Roboto',
+      fontStyle: 'normal',
+      fontWeight: '400',
+      fontSize: '14.1451px',
+      lineHeight: '24px',
+      textAlign: 'center',
+      color: '#7d8592',
+      marginBottom: '22px'
+    }
+  }, "All rights reserved.")))))))))))))) : null)))));
+}
+function EmailDripMarket({
+  sectionData,
+  extraProps = {}
+}) {
+  console.log('extrapropstemplate', extraProps);
+  const isInitialMount = React.useRef(true);
+  const convertToHtml = sectionData => {
+    const html = ReactDOMServer__default["default"].renderToStaticMarkup( /*#__PURE__*/React__default["default"].createElement(Section, {
+      nodeData: sectionData
+    }));
+    return html;
+  };
+  React.useEffect(() => {
+    if (isInitialMount.current) {
+      isInitialMount.current = false;
+    } else {
+      extraProps?.callbackHtml(convertToHtml(sectionData));
+    }
+  }, [extraProps?.convertedHtml]);
+
+  // const mockData = sectionData?.sections[0];
+  const emailRef = React.useRef(null);
+  return /*#__PURE__*/React__default["default"].createElement("section", {
+    style: {
+      width: '95%'
+    }
+  }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Section, {
+    sectionRef: emailRef,
+    customHtmlData: extraProps?.customHtmlData,
+    nodeData: sectionData
+  })));
+}
+
+var index = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  'default': EmailDripMarket
+});
+
 const TYPE_TO_COMPONENT_MAP = {
   BANNER_CAROUSEL_RIGHT: BannerCarouselRight,
   GRID_CARD: List,
@@ -8036,15 +8378,15 @@ const TYPE_TO_COMPONENT_MAP = {
   WEBINAR_LANDING_PAGE: CoursePromotionPage$1,
   COURSE_LANDING_PAGE: CoursePromotionPage,
   FORM_LANDING_PAGE: FormPage,
-  TILES_SECTION: Tiles
+  TILES_SECTION: Tiles,
+  EMAIL_DRIP_MARKET: EmailDripMarket
 };
-
 const getCompToRender = type => TYPE_TO_COMPONENT_MAP[type] || (() => null);
-
 const MemoisedSection = /*#__PURE__*/React.memo(({
   sectionData,
   extraProps
 }) => {
+  console.log('templatesectiondata', sectionData);
   const SectionComp = getCompToRender(sectionData.type);
   return /*#__PURE__*/React__default["default"].createElement(SectionComp, {
     sectionData: sectionData,
@@ -8152,11 +8494,9 @@ const componentParser = compObj => {
     });
     return component;
   }
-
   if (Array.isArray(compObj.components)) {
     compObj.components = compObj.components.map(componentParser);
   }
-
   return compObj;
 };
 const inverseComponentParser = compObj => {
@@ -8181,7 +8521,6 @@ const inverseComponentParser = compObj => {
     if (compObj.components) {
       compObj.components = compObj.components.map(inverseComponentParser);
     }
-
     return compObj;
   }
 };