diy-template-components 1.0.0 → 1.0.2

package/build/index.js

@@ -2,20 +2,20 @@
 
 
 
-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 });
 
-var React$1 = require('react');
+var React = require('react');
 var Slider = require('react-slick');
 var axios = require('axios');
 var moment = require('moment');
@@ -26,7 +26,7 @@ var reactJss = require('react-jss');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var Slider__default = /*#__PURE__*/_interopDefaultLegacy(Slider);
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
@@ -49,7 +49,7 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
-const PageContext = /*#__PURE__*/React$1.createContext({});
+const PageContext = /*#__PURE__*/React.createContext({});
 
 const context = /*#__PURE__*/React__default["default"].createContext({});
 const theming = reactJss.createTheming(context);
@@ -478,7 +478,7 @@ function useLinkBuilder(data) {
     isEdit,
     basePath,
     isMasterTemplate
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   if (isEdit || !data.isLink) {
     return null;
   }
@@ -503,7 +503,7 @@ function useLinkBuilder(data) {
   return `//${basePath}?templateId=${templateId}&pageId=${pageId}${isMasterTemplate ? '&mld=true' : ''}`;
 }
 
-const Button = /*#__PURE__*/React$1.forwardRef(function Button({
+const Button = /*#__PURE__*/React.forwardRef(function Button({
   fluid,
   disabled,
   data,
@@ -516,7 +516,7 @@ const Button = /*#__PURE__*/React$1.forwardRef(function Button({
 }, ref) {
   const {
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const link = useLinkBuilder(data);
   const classes = buttonStyles({
     fluid,
@@ -856,17 +856,17 @@ const Icon = ({
   onClick
 }) => {
   /** */
-  const isMounted = React$1.useRef(false);
-  React$1.useEffect(() => {
+  const isMounted = React.useRef(false);
+  React.useEffect(() => {
     isMounted.current = true;
     return () => isMounted.current = false;
   }, []);
   /** */
 
-  const rootRef = React$1.useRef( /** @type {HTMLElement} */null);
+  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$1.useRef(name);
-  const [svgState, setSvgState] = React$1.useState(defaultSvgState);
+  const currentName = React.useRef(name);
+  const [svgState, setSvgState] = React.useState(defaultSvgState);
   const styles = useStyles$1({
     width,
     height,
@@ -875,8 +875,8 @@ const Icon = ({
     opacity,
     hoverColor
   });
-  const _className = React$1.useMemo(() => `${styles.root} ${className || ''}`, [className]);
-  React$1.useEffect(() => {
+  const _className = React.useMemo(() => `${styles.root} ${className || ''}`, [className]);
+  React.useEffect(() => {
     // reset
     currentName.current = name;
     setSvgState(defaultSvgState);
@@ -1044,7 +1044,7 @@ function OptionList({
   isTutorWebsite,
   isLandingPages
 }) {
-  React$1.useContext(PageContext);
+  React.useContext(PageContext);
   const tabsDataModifier = () => {
     return optionsData?.map(dt => {
       return {
@@ -1155,7 +1155,7 @@ const NextImageRenderer = ({
     isCustomWebsite,
     pageData,
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   try {
     let {
       refSetter,
@@ -1220,7 +1220,7 @@ function DesktopHeader({
   } = header;
   const {
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const logoUrl = useLinkBuilder({
     isLink: true,
     link: '/'
@@ -1299,7 +1299,7 @@ function MobileHeader({
 }) {
   const {
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const {
     isFixed = true
   } = header;
@@ -1312,9 +1312,9 @@ function MobileHeader({
     isFixed,
     isCustomWebsite
   });
-  const [sideMenu, openSideMenu] = React$1.useState(false);
-  const navEl = React$1.useRef(null);
-  React$1.useLayoutEffect(() => {
+  const [sideMenu, openSideMenu] = React.useState(false);
+  const navEl = React.useRef(null);
+  React.useLayoutEffect(() => {
     const body = navEl?.current?.ownerDocument?.body;
     if (sideMenu) {
       body?.setAttribute('style', 'overflow: hidden;');
@@ -1479,7 +1479,7 @@ function Header({
   const {
     isMobile,
     isTutorWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const filterHiddenNavs = () => {
     return data?.navs?.filter(dt => !dt.isHiddenNav);
   };
@@ -1709,7 +1709,7 @@ function Footer({
   const theme = useTheme();
   const {
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$9({
     isCustomWebsite
   });
@@ -2075,31 +2075,31 @@ function ArimaMadurai() {
 }
 
 const TYPE_TO_COMPONENT_MAP$1 = {
-  BANNER_CAROUSEL_RIGHT: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$l; })),
-  GRID_CARD: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$k; })),
-  BANNER_CAROUSEL_CENTER: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$j; })),
-  BANNER_CAROUSEL_LEFT: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$i; })),
-  FORM_SUBSCRIBE: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$h; })),
-  TEXT_TESTIMONIAL: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$g; })),
-  VIDEO_TESTIMONIAL: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$f; })),
-  VIDEO: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$e; })),
-  INFO: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$d; })),
-  TEXT: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$c; })),
-  IMAGE_GALLERY: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$b; })),
-  FAQ_LISTING: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$a; })),
-  COURSE_CAROUSEL: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$8; })),
-  TEAM_CARD: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$7; })),
-  TEXT_GRID: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$9; })),
-  CONTACT: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$6; })),
-  FORM_ENQUIRY: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$5; })),
-  WEBINAR_LANDING_PAGE: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$4; })),
-  COURSE_LANDING_PAGE: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$3; })),
-  FORM_LANDING_PAGE: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$2; })),
-  TILES_SECTION: /*#__PURE__*/React$1.lazy(() => Promise.resolve().then(function () { return index$1; })),
-  EMAIL_DRIP_MARKET: /*#__PURE__*/React$1.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$1.memo(({
+const MemoisedSection$1 = /*#__PURE__*/React.memo(({
   sectionData,
   extraProps,
   sectionIndex
@@ -2116,7 +2116,7 @@ function SectionRenderer$1({
   sectionIndex,
   extraProps
 }) {
-  return /*#__PURE__*/React__default["default"].createElement(React$1.Suspense, {
+  return /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
     fallback: null /*GIF maybe*/
   }, /*#__PURE__*/React__default["default"].createElement(MemoisedSection$1, {
     sectionData: sectionData,
@@ -2172,7 +2172,7 @@ function PageRenderer$1({
   currencySymbol
 }) {
   const navList = header?.navs;
-  const context = React$1.useMemo(() => ({
+  const context = React.useMemo(() => ({
     isMobile,
     isLandingPages,
     layout,
@@ -2193,8 +2193,8 @@ function PageRenderer$1({
     countryCode,
     currencySymbol
   }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id, countryCode, currencySymbol]);
-  const theme = React$1.useMemo(() => getTheme(color, font, context.isMobile), [color, font, context.isMobile]);
-  const Wrapper = SectionWrapper || React$1.Fragment;
+  const theme = React.useMemo(() => getTheme(color, font, context.isMobile), [color, font, context.isMobile]);
+  const Wrapper = SectionWrapper || React.Fragment;
   return /*#__PURE__*/React__default["default"].createElement(ThemeProvider, {
     theme: theme
   }, /*#__PURE__*/React__default["default"].createElement(PageContext.Provider, {
@@ -2509,16 +2509,16 @@ function Carousel({
   inverted
 }) {
   importSlickStyles();
-  const sliderRef = React$1.useRef();
+  const sliderRef = React.useRef();
   const {
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useCarouselStyles({
     isMobile,
     buttonContainerClass,
     inverted
   });
-  const [currentDot, setCurrentDot] = React$1.useState(0);
+  const [currentDot, setCurrentDot] = React.useState(0);
   const sliderSettings = {
     dots: isMobile,
     infinite: true,
@@ -2537,7 +2537,7 @@ function Carousel({
       return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("ul", null, dots.map((item, i) => {
         if (currentDot - leftCount <= i && currentDot + rightCount >= i) return /*#__PURE__*/React__default["default"].createElement("li", {
           key: i
-        }, item.props.children);else return /*#__PURE__*/React__default["default"].createElement(React$1.Fragment, {
+        }, item.props.children);else return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
           key: i
         });
       })));
@@ -2585,7 +2585,7 @@ function Section$4({
     },
     isMobile,
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$8({
     isCustomWebsite,
     isMobile
@@ -2641,7 +2641,7 @@ function BannerCarouselRight({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$8({
     containerWidth,
     isMobile
@@ -2649,7 +2649,7 @@ function BannerCarouselRight({
   const [{
     bannerCarousel
   }] = sectionData.components;
-  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React$1.Fragment;
+  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React.Fragment;
   const wrapperProps = bannerCarousel.components.length > 1 ? {
     buttonContainerClass: classes.absoluteButtonsBannerRight,
     inverted: false
@@ -2850,7 +2850,7 @@ function List({
       containerWidth
     },
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$7({
     containerWidth,
     isMobile
@@ -3068,7 +3068,7 @@ const Section$3 = ({
     },
     isMobile,
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$6({
     imageUrl: nodeData.image.metadata.value,
     containerWidth,
@@ -3128,7 +3128,7 @@ function BannerCarouselCenter({
   const [{
     bannerCarousel
   }] = sectionData.components;
-  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React$1.Fragment;
+  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React.Fragment;
   const wrapperProps = bannerCarousel.components.length > 1 ? {
     buttonContainerClass: classes.absoluteButtons,
     inverted: true
@@ -3290,7 +3290,7 @@ function Section$2({
     },
     isMobile,
     isCustomWebsite
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$5({
     isCustomWebsite,
     isMobile
@@ -3346,14 +3346,14 @@ function BannerCarouselLeft({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$5({
     containerWidth
   });
   const [{
     bannerCarousel
   }] = sectionData.components;
-  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React$1.Fragment;
+  const Wrapper = bannerCarousel.components.length > 1 ? Carousel : React.Fragment;
   return /*#__PURE__*/React__default["default"].createElement("section", {
     className: classes.section
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -3642,16 +3642,16 @@ function SubscribeToNewsletter({
     validations,
     isPreview,
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const [nodeData] = sectionData.components;
   const classes = useSectionStyles$4({
     containerWidth,
     isMobile
   });
   let formInitialValue = nodeData?.inputField?.metadata?.value;
-  const [inputVal, setInputVal] = React$1.useState(formInitialValue);
-  let [isValid, setIsValid] = React$1.useState(true);
-  let [btnDisabled, setBtnDisabled] = React$1.useState(false);
+  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,
@@ -3677,7 +3677,7 @@ function SubscribeToNewsletter({
       }
     }
   };
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     if (!isValid) {
       setBtnDisabled(true);
     } else {
@@ -3949,7 +3949,7 @@ function Section$1({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const carouselList = nodeData?.cardCarousel?.components;
   const cardsCount = carouselList?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -3969,7 +3969,7 @@ function Section$1({
   /*#__PURE__*/
   // kept an extra element as slick mutates this element and gives it 100% width
   // and so, we can't use margins here on the top level element
-  React__default["default"].createElement(React$1.Fragment, {
+  React__default["default"].createElement(React.Fragment, {
     key: idx
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.singleCard
@@ -4109,8 +4109,8 @@ function Loader({
   const classes = useStyles({
     theme
   });
-  const [loaderText, setLoaderText] = React$1.useState('');
-  React$1.useEffect(() => {
+  const [loaderText, setLoaderText] = React.useState('');
+  React.useEffect(() => {
     if (texts && texts.length) {
       let textID = '';
       for (let i = 0; i < texts.length; i++) {
@@ -4189,8 +4189,8 @@ function VideoPlayer(props) {
     videoUrl,
     imageUrl
   } = props;
-  const [isEnabled, setIsEnableed] = React$1.useState(!imageUrl);
-  const [isLoaded, setIsLoaded] = React$1.useState(!imageUrl);
+  const [isEnabled, setIsEnableed] = React.useState(!imageUrl);
+  const [isLoaded, setIsLoaded] = React.useState(!imageUrl);
   const classes = useVideoStyles$1({
     isLoaded,
     imageUrl: imageUrl
@@ -4405,13 +4405,13 @@ function VideoTestimonial({
     countryCode,
     currencySymbol,
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useVideoTestimonialStyles({
     containerWidth,
     isMobile
   });
   const [videoData] = sectionData.components;
-  const Wrapper = videoData.videoCarousel.components.length > 1 ? Carousel : React$1.Fragment;
+  const Wrapper = videoData.videoCarousel.components.length > 1 ? Carousel : React.Fragment;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoTestimonialSuperContainer
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -4630,7 +4630,7 @@ function Video({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const [videoData] = sectionData.components;
   const cardsCount = videoData?.videoCarousel?.components?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -4830,7 +4830,7 @@ function Info({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const theme = useTheme();
   const slidesToShow = isMobile ? 1 : 4;
   const [nodeData] = sectionData.components;
@@ -4851,7 +4851,7 @@ function Info({
   const carouselContent = carouselList.map((dt, ind) =>
   /*#__PURE__*/
   // Need to keep this Fragment otherwise Slick mutates the top level div
-  React__default["default"].createElement(React$1.Fragment, {
+  React__default["default"].createElement(React.Fragment, {
     key: ind
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.card
@@ -4978,7 +4978,7 @@ const TextSection = ({
       containerWidth
     },
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$2({
     containerWidth,
     isMobile
@@ -5127,7 +5127,7 @@ function PhotoGallery({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const [nodeData] = sectionData.components;
   const carouselList = nodeData?.cardCarousel?.components;
   const cardsCount = carouselList?.length;
@@ -5149,7 +5149,7 @@ function PhotoGallery({
     arrows: false
   };
   const carouselContent = carouselList?.map((el, idx) => {
-    return /*#__PURE__*/React__default["default"].createElement(React$1.Fragment, {
+    return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
       key: idx
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: classes.singleCard
@@ -5279,13 +5279,13 @@ const useFaqListStyles = createUseStyles(theme => ({
 const FAQListing = ({
   sectionData
 }) => {
-  const [selectedIndex, setSelectedIndex] = React$1.useState(0);
+  const [selectedIndex, setSelectedIndex] = React.useState(0);
   const {
     layout: {
       containerWidth
     },
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useFaqListStyles({
     selectedIndex,
     containerWidth,
@@ -5467,7 +5467,7 @@ const TextGrid = ({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const [nodeData] = sectionData.components;
   const cardsCount = nodeData?.contentList?.components?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -5482,7 +5482,7 @@ const TextGrid = ({
     infinite: false,
     slidesToShow: isMobile ? 1.1 : 2
   };
-  const carouselContent = nodeData?.contentList?.components?.map((item, index) => /*#__PURE__*/React__default["default"].createElement(React$1.Fragment, {
+  const carouselContent = nodeData?.contentList?.components?.map((item, index) => /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
     key: index
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.node
@@ -5860,7 +5860,7 @@ function CourseCard({
   const classes = useCourseStyles();
   const {
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const discount = parseInt((card?.price - card?.finalPrice) / card?.price * 100).toFixed(2);
   const defaultCardImg = 'https://cp-assets-public.s3.ap-south-1.amazonaws.com/cams/cards-icon/default_course.png';
   const price = formatCurrency(countryCode, card?.price, currencySymbol);
@@ -5925,11 +5925,11 @@ function courses({
     isEdit,
     countryCode,
     currencySymbol
-  } = React$1.useContext(PageContext);
-  const [cardList, setCardList] = React$1.useState(null);
-  const [errored, setErrored] = React$1.useState(false);
-  const [fallBackImages, setFallbackImages] = React$1.useState([]);
-  const [showShimmer, setShowShimmer] = React$1.useState(true);
+  } = React.useContext(PageContext);
+  const [cardList, setCardList] = React.useState(null);
+  const [errored, setErrored] = React.useState(false);
+  const [fallBackImages, setFallbackImages] = React.useState([]);
+  const [showShimmer, setShowShimmer] = React.useState(true);
   const classes = useCourseStyles({
     containerWidth,
     isMobile
@@ -5967,7 +5967,7 @@ function courses({
       });
     }
   };
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     const placeholders = nodeData?.cardCarousel?.metadata?.placeholders;
     // For Master template Preview: Show placeholder images. If placeholder doesn't come from backend, show shimmer.
     if (isMasterTemplate) {
@@ -6019,7 +6019,7 @@ function courses({
     countryCode: countryCode,
     currencySymbol: currencySymbol
   })) : fallBackImages?.map((dt, ind) => {
-    return /*#__PURE__*/React__default["default"].createElement(React$1.Fragment, {
+    return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
       key: ind
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       style: {
@@ -6237,7 +6237,7 @@ function TeamCard({
     layout: {
       containerWidth
     }
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const [teamData] = sectionData.components;
   const cardsCount = teamData?.teamCarousel?.components?.length;
   const slidesToShow = isMobile ? 1 : 4;
@@ -6460,28 +6460,28 @@ function FormEnquiry({
     validations,
     isPreview,
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useSectionStyles$1({
     containerWidth,
     isMobile
   });
   const [nodeData] = sectionData.components;
   const theme = useTheme();
-  let [btnDisabled, setBtnDisabled] = React$1.useState(false);
+  let [btnDisabled, setBtnDisabled] = React.useState(false);
   let formInitialValue = {
     name: nodeData?.nameField?.metadata?.value,
     phone: nodeData?.phoneField?.metadata?.value,
     email: nodeData?.emailField?.metadata?.value,
     message: nodeData?.messageField?.metadata?.value
   };
-  const [inputVal, setInputVal] = React$1.useState(formInitialValue);
-  const [validData, setValidData] = React$1.useState({
+  const [inputVal, setInputVal] = React.useState(formInitialValue);
+  const [validData, setValidData] = React.useState({
     nameValid: 1,
     emailValid: 1,
     phoneValid: 1,
     messageValid: 1
   });
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     if (validData?.nameValid && validData?.emailValid && validData?.phoneValid && validData?.messageValid) {
       setBtnDisabled(false);
     } else {
@@ -6897,8 +6897,8 @@ function Contact({
     validations,
     isPreview,
     isEdit
-  } = React$1.useContext(PageContext);
-  let [btnDisabled, setBtnDisabled] = React$1.useState(false);
+  } = React.useContext(PageContext);
+  let [btnDisabled, setBtnDisabled] = React.useState(false);
   const [nodeData] = sectionData.components;
   const classes = useSectionStyles({
     containerWidth,
@@ -6910,8 +6910,8 @@ function Contact({
     email: nodeData?.emailField?.metadata?.value,
     message: nodeData?.messageField?.metadata?.value
   };
-  const [inputVal, setInputVal] = React$1.useState(formInitialValue);
-  const [validData, setValidData] = React$1.useState({
+  const [inputVal, setInputVal] = React.useState(formInitialValue);
+  const [validData, setValidData] = React.useState({
     nameValid: 1,
     emailValid: 1,
     phoneValid: 1,
@@ -6927,7 +6927,7 @@ function Contact({
     setBtnDisabled(true);
     setInputVal(formInitialValue);
   };
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     if (validData?.nameValid && validData?.emailValid && validData?.phoneValid && validData?.messageValid) {
       setBtnDisabled(false);
     } else {
@@ -7333,9 +7333,9 @@ const useWebinarPromotionPage = createUseStyles(theme => {
 });
 
 const SingleVideoSlide$1 = props => {
-  const [isReadMore, setIsReadMore] = React$1.useState(false);
+  const [isReadMore, setIsReadMore] = React.useState(false);
   const theme = useTheme();
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     // remaining days epoch
     // current date epoch
     // subtract remaining days from current day epoch
@@ -7359,13 +7359,13 @@ const SingleVideoSlide$1 = props => {
   }) => {
     if (days === 0 && hours < 24) {
       if (countryCode === 'KR') {
-        return /*#__PURE__*/React.createElement("span", null, hours, " \uC2DC\uAC04 ", minutes, " \uBD84 ", seconds, "\uCD08");
+        return /*#__PURE__*/React__default["default"].createElement("span", null, hours, " \uC2DC\uAC04 ", minutes, " \uBD84 ", seconds, "\uCD08");
       }
-      return /*#__PURE__*/React.createElement("span", null, hours, "h ", minutes, "m ", seconds, "s");
+      return /*#__PURE__*/React__default["default"].createElement("span", null, hours, "h ", minutes, "m ", seconds, "s");
     } else {
       let given = moment__default["default"](props.data.offerPriceEndDate);
       let current = moment__default["default"]().startOf('day');
-      return /*#__PURE__*/React.createElement("span", null, Math.floor(moment__default["default"].duration(given.diff(current)).asDays()), ' ', countryCode === 'KR' ? '일' : 'day(s)');
+      return /*#__PURE__*/React__default["default"].createElement("span", null, Math.floor(moment__default["default"].duration(given.diff(current)).asDays()), ' ', countryCode === 'KR' ? '일' : 'day(s)');
     }
   };
   const checkIfOfferIsValid = () => moment__default["default"]().diff(moment__default["default"](props.data.offerPriceEndDate)) < 0;
@@ -7413,20 +7413,20 @@ const SingleVideoSlide$1 = props => {
   const limitedPeriodOfferText = countryCode === 'KR' ? '기간 한정 딜이므로 서두르세요!' : 'Hurry up! Offer for limited period only';
   const renderOfferEndsInText = () => {
     if (countryCode === 'KR') {
-      return /*#__PURE__*/React.createElement("p", {
+      return /*#__PURE__*/React__default["default"].createElement("p", {
         className: classes.offerText
-      }, /*#__PURE__*/React.createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: classes.courseDetailTime
-      }, /*#__PURE__*/React.createElement(Countdown__default["default"], {
+      }, /*#__PURE__*/React__default["default"].createElement(Countdown__default["default"], {
         renderer: renderer,
         date: data.offerPriceEndDate
       })), ' ', "\uD6C4\xA0\uC2E0\uCCAD\xA0\uB9C8\uAC10\xA0\uC608\uC815");
     } else {
-      return /*#__PURE__*/React.createElement("p", {
+      return /*#__PURE__*/React__default["default"].createElement("p", {
         className: classes.offerText
-      }, "Offer Ends in", ' ', /*#__PURE__*/React.createElement("span", {
+      }, "Offer Ends in", ' ', /*#__PURE__*/React__default["default"].createElement("span", {
         className: classes.courseDetailTime
-      }, /*#__PURE__*/React.createElement(Countdown__default["default"], {
+      }, /*#__PURE__*/React__default["default"].createElement(Countdown__default["default"], {
         renderer: renderer,
         date: data.offerPriceEndDate
       })));
@@ -7446,52 +7446,52 @@ const SingleVideoSlide$1 = props => {
   if (countryCode === 'KR') {
     moment__default["default"].updateLocale('ko', koreanLocale__default["default"]);
   }
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoCarouselContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.webinarCarousel
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.iframeSuperContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoDetails
-  }, data?.isPaid !== 0 && (checkIfOfferIsValid() || data.offerPriceValidFor > 0) && /*#__PURE__*/React.createElement("div", null, data.offerPriceValidFor > conversions && (data.discount && data.offerPriceEndDate ? checkIfOfferIsValid() : true) ? /*#__PURE__*/React.createElement("div", {
+  }, data?.isPaid !== 0 && (checkIfOfferIsValid() || data.offerPriceValidFor > 0) && /*#__PURE__*/React__default["default"].createElement("div", null, data.offerPriceValidFor > conversions && (data.discount && data.offerPriceEndDate ? checkIfOfferIsValid() : true) ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.bannerContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.bannerContainerText
-  }, renderHurryUpBannerText())) : checkIfOfferIsValid() && data.offerPriceValidFor !== null ? data.offerPriceValidFor - conversions > 0 : /*#__PURE__*/React.createElement("div", {
+  }, renderHurryUpBannerText())) : checkIfOfferIsValid() && data.offerPriceValidFor !== null ? data.offerPriceValidFor - conversions > 0 : /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.bannerContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.bannerContainerText
-  }, limitedPeriodOfferText))), /*#__PURE__*/React.createElement("h3", {
+  }, limitedPeriodOfferText))), /*#__PURE__*/React__default["default"].createElement("h3", {
     ref: data?.videoTextHeading?.refSetter,
     className: classes.videoDetailsHeading,
     dangerouslySetInnerHTML: {
       __html: data.title
     }
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.courseDetailsTags
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.courseDetailTag
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: classes.iconBackground
-  }, /*#__PURE__*/React.createElement(Icon, {
+  }, /*#__PURE__*/React__default["default"].createElement(Icon, {
     name: 'Calendar',
     color: theme.palette.primary.main
-  })), /*#__PURE__*/React.createElement("div", null, moment__default["default"](data.startDate).locale(momentLocale).format('Do MMM YY') + ' ', moment__default["default"](data.startTime).locale(momentLocale).format('h:mm A'), /*#__PURE__*/React.createElement("span", null, " - "), moment__default["default"](data.endTime).locale(momentLocale).format('h:mm A'))), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React__default["default"].createElement("div", null, moment__default["default"](data.startDate).locale(momentLocale).format('Do MMM YY') + ' ', moment__default["default"](data.startTime).locale(momentLocale).format('h:mm A'), /*#__PURE__*/React__default["default"].createElement("span", null, " - "), moment__default["default"](data.endTime).locale(momentLocale).format('h:mm A'))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.courseDetailTag
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: classes.iconBackground
-  }, /*#__PURE__*/React.createElement(Icon, {
+  }, /*#__PURE__*/React__default["default"].createElement(Icon, {
     color: theme.palette.primary.main,
     width: "20px",
     name: `${data.webinarLocation === 'Location' ? 'Location' : 'Video'}`
-  })), /*#__PURE__*/React.createElement("div", null, data.webinarLocation === 'Location' ? data.webinarLink : data.webinarLocation))), /*#__PURE__*/React.createElement("p", {
+  })), /*#__PURE__*/React__default["default"].createElement("div", null, data.webinarLocation === 'Location' ? data.webinarLink : data.webinarLocation))), /*#__PURE__*/React__default["default"].createElement("p", {
     ref: data?.videoTextContent?.refSetter,
     className: classes.courseDetailContent,
     dangerouslySetInnerHTML: {
       __html: isReadMore ? data.description : data.description.substring(0, 250)
     }
-  }), /*#__PURE__*/React.createElement("p", {
+  }), /*#__PURE__*/React__default["default"].createElement("p", {
     onClick: () => {
       setIsReadMore(true);
     },
@@ -7500,36 +7500,36 @@ const SingleVideoSlide$1 = props => {
     dangerouslySetInnerHTML: {
       __html: data.description.length > 250 && !isReadMore ? handleReadMoreText() : null
     }
-  }))), /*#__PURE__*/React.createElement("div", {
+  }))), /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.courseViewContainer
-  }, data.isPaid !== 0 && checkIfOfferIsValid() && (data.offerPriceValidFor !== null ? data.offerPriceValidFor - conversions > 0 : true) && renderOfferEndsInText(), /*#__PURE__*/React.createElement("div", {
+  }, data.isPaid !== 0 && checkIfOfferIsValid() && (data.offerPriceValidFor !== null ? data.offerPriceValidFor - conversions > 0 : true) && renderOfferEndsInText(), /*#__PURE__*/React__default["default"].createElement("div", {
     ref: data?.videoFrame?.refSetter,
     className: classes.iframeContainer
-  }, /*#__PURE__*/React.createElement(VideoPlayer, {
+  }, /*#__PURE__*/React__default["default"].createElement(VideoPlayer, {
     onlyThumbnail: true,
     imageUrl: data.thumbnail,
     videoUrl: data.thumbnail,
     sectionIndex: props?.sectionIndex
-  })), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       display: data.isPaid ? 'flex' : 'block'
     },
     className: classes.bottomContainer
-  }, data.isPaid !== 0 ? /*#__PURE__*/React.createElement("div", {
+  }, data.isPaid !== 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.priceContainer
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.offerPrice
-  }, effectivePrice), checkForShowDiscount() && (data.offerPriceEndDate ? checkIfOfferIsValid() : true) && /*#__PURE__*/React.createElement("p", {
+  }, effectivePrice), checkForShowDiscount() && (data.offerPriceEndDate ? checkIfOfferIsValid() : true) && /*#__PURE__*/React__default["default"].createElement("p", {
     style: {
       fontSize: '20px'
     }
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: classes.originalPrice
-  }, finalPrice), ' ', /*#__PURE__*/React.createElement("span", {
+  }, finalPrice), ' ', /*#__PURE__*/React__default["default"].createElement("span", {
     className: classes.offerDiscount
-  }, `${data && discount(data)}%`))) : null, /*#__PURE__*/React.createElement("div", {
+  }, `${data && discount(data)}%`))) : null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.webinarButtonContainer
-  }, /*#__PURE__*/React.createElement(Button, {
+  }, /*#__PURE__*/React__default["default"].createElement(Button, {
     style: {
       width: data.isPaid ? '100%' : '100%',
       fontSize: 'large'
@@ -7561,7 +7561,7 @@ function CoursePromotionPage$1({
     countryCode,
     currencySymbol,
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useWebinarPromotionPage({
     containerWidth,
     isMobile
@@ -7881,7 +7881,7 @@ var calendar = "data:image/svg+xml,%3Csvg%20width%3D%2236%22%20height%3D%2236%22
 var arrowRight = "data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1%2013L7%207L1%201%22%20stroke%3D%22%237D8592%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E";
 
 const SingleVideoSlide = props => {
-  const [isReadMore, setIsReadMore] = React$1.useState(false);
+  const [isReadMore, setIsReadMore] = React.useState(false);
   const theme = useTheme();
   const {
     layout: {
@@ -7889,7 +7889,7 @@ const SingleVideoSlide = props => {
     },
     isMobile,
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const renderer = ({
     days,
     hours,
@@ -7982,6 +7982,13 @@ const SingleVideoSlide = props => {
       return 'Read More';
     }
   };
+  const handleCourseCertificateText = () => {
+    if (countryCode === 'KR') {
+      return '수료증 발급';
+    } else {
+      return 'Course Certificate';
+    }
+  };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.videoCarouselContainer
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -8034,7 +8041,7 @@ const SingleVideoSlide = props => {
   }, /*#__PURE__*/React__default["default"].createElement(Icon, {
     name: 'Certificate',
     color: theme.palette.primary.main
-  })), /*#__PURE__*/React__default["default"].createElement("div", null, data?.courseOverviewData?.metaData?.isCertificateEnabled ? 'Course Cerficate' : null)) : null, data?.courseOverviewData?.resourseDataText.heading ? /*#__PURE__*/React__default["default"].createElement("div", {
+  })), /*#__PURE__*/React__default["default"].createElement("div", null, data?.courseOverviewData?.metaData?.isCertificateEnabled ? handleCourseCertificateText() : null)) : null, data?.courseOverviewData?.resourseDataText.heading ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: classes.courseDetailTag
   }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: classes.iconBackground
@@ -8135,7 +8142,7 @@ function CoursePromotionPage({
     countryCode,
     currencySymbol,
     isMobile
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useCoursePromotionPage({
     containerWidth,
     isMobile
@@ -8320,15 +8327,15 @@ const FormPage = ({
   sectionData,
   extraProps = {}
 }) => {
-  const [formData, setFormData] = React$1.useState({});
-  const [formSubmitted, setformSubmitted] = React$1.useState(false);
+  const [formData, setFormData] = React.useState({});
+  const [formSubmitted, setformSubmitted] = React.useState(false);
   const metadata = sectionData?.components?.[0]?.metadata || formPageMock;
   const {
     _id,
     baseURLs,
     isMobile,
     countryCode
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useFormPageStyles({
     isMobile
   });
@@ -8357,7 +8364,7 @@ const FormPage = ({
     setFormData({});
     setformSubmitted(!formSubmitted);
   };
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     //add all questions to formData
     let formData = {};
     metadata.questions.forEach(question => {
@@ -8610,7 +8617,7 @@ function Tiles({
     },
     isPreview,
     isEdit
-  } = React$1.useContext(PageContext);
+  } = React.useContext(PageContext);
   const classes = useTilesStyles({
     isMobile
   });
@@ -8626,7 +8633,7 @@ function Tiles({
     }
   };
   const TileDiv = tilesList?.map((tile, i) => {
-    return /*#__PURE__*/React__default["default"].createElement(React$1.Fragment, {
+    return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
       key: i
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: classes.tileDiv,
@@ -9091,7 +9098,7 @@ function EmailDripMarket({
   sectionData,
   extraProps = {}
 }) {
-  const isInitialMount = React$1.useRef(true);
+  const isInitialMount = React.useRef(true);
   const convertToHtml = sectionData => {
     const html = ReactDOMServer__default["default"].renderToStaticMarkup( /*#__PURE__*/React__default["default"].createElement(Section, {
       nodeData: sectionData,
@@ -9101,7 +9108,7 @@ function EmailDripMarket({
     }));
     return html;
   };
-  React$1.useEffect(() => {
+  React.useEffect(() => {
     if (isInitialMount.current) {
       isInitialMount.current = false;
     } else {
@@ -9110,7 +9117,7 @@ function EmailDripMarket({
   }, [extraProps?.convertedHtml]);
 
   // const mockData = sectionData?.sections[0];
-  const emailRef = React$1.useRef(null);
+  const emailRef = React.useRef(null);
   return /*#__PURE__*/React__default["default"].createElement("section", {
     style: {
       width: '95%',
@@ -9158,7 +9165,7 @@ const TYPE_TO_COMPONENT_MAP = {
   EMAIL_DRIP_MARKET: EmailDripMarket
 };
 const getCompToRender = type => TYPE_TO_COMPONENT_MAP[type] || (() => null);
-const MemoisedSection = /*#__PURE__*/React$1.memo(({
+const MemoisedSection = /*#__PURE__*/React.memo(({
   sectionData,
   extraProps,
   isCustomWebsite,
@@ -9221,7 +9228,7 @@ function PageRenderer({
   hideLogin
 }) {
   const navList = header?.navs;
-  const context = React$1.useMemo(() => ({
+  const context = React.useMemo(() => ({
     isMobile,
     isLandingPages,
     layout,
@@ -9242,8 +9249,8 @@ function PageRenderer({
     countryCode,
     currencySymbol
   }), [isMobile, isLandingPages, layout, baseURLs, hashToken, isPreview, isEdit, templateId, navList, isMasterTemplate, basePath, validations, isTutorWebsite, extraProps, hideLogin, _id, countryCode, currencySymbol]);
-  const theme = React$1.useMemo(() => getTheme(color, font, context.isMobile), [color, font, context.isMobile]);
-  const Wrapper = SectionWrapper || React$1.Fragment;
+  const theme = React.useMemo(() => getTheme(color, font, context.isMobile), [color, font, context.isMobile]);
+  const Wrapper = SectionWrapper || React.Fragment;
   return /*#__PURE__*/React__default["default"].createElement(ThemeProvider, {
     theme: theme
   }, /*#__PURE__*/React__default["default"].createElement(PageContext.Provider, {