diy-template-components 2.0.56 → 2.0.58

package/build/index.es.js

@@ -9,7 +9,7 @@ function ___$insertStyle(css) {
     return css;
 }
 
-import React, { createContext, useContext, forwardRef, useRef, useEffect, useState, useMemo, useLayoutEffect, Suspense, memo, lazy, Fragment } from 'react';
+import React, { createContext, useContext as useContext$1, forwardRef, useRef, useEffect, useState, useMemo, useLayoutEffect, Suspense, memo, lazy, Fragment } from 'react';
 import Slider from 'react-slick';
 import axios from 'axios';
 import moment from 'moment';
@@ -469,7 +469,7 @@ function useLinkBuilder(data) {
     isEdit,
     basePath,
     isMasterTemplate
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   if (isEdit || !data.isLink) {
     return null;
   }
@@ -507,7 +507,7 @@ const Button = /*#__PURE__*/forwardRef(function Button({
 }, ref) {
   const {
     isEdit
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const link = useLinkBuilder(data);
   const classes = buttonStyles({
     fluid,
@@ -1072,7 +1072,7 @@ function OptionList({
   const {
     isPreview,
     countryCode
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   function checkIsActiveTab(slug = '') {
     if (typeof window !== 'undefined') {
       const pathname = window.location.pathname;
@@ -1236,7 +1236,7 @@ const NextImageRenderer = ({
     isCustomWebsite,
     pageData,
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
 
   // return empty div if src is empty string or empty object or null
   if (!src || typeof src === 'object' && Object.keys(src).length === 0) {
@@ -1312,7 +1312,7 @@ function DesktopHeader({
   } = header;
   const {
     isCustomWebsite
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const logoUrl = useLinkBuilder({
     isLink: true,
     link: '/'
@@ -1393,7 +1393,7 @@ function MobileHeader({
   const {
     isCustomWebsite,
     countryCode
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const {
     isFixed = true
   } = header;
@@ -1561,7 +1561,7 @@ function Header({
   const {
     isMobile,
     isTutorWebsite
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const filterHiddenNavs = () => {
     return data?.navs?.filter(dt => !dt.isHiddenNav);
   };
@@ -1795,7 +1795,7 @@ function Footer({
   const theme = useTheme();
   const {
     isCustomWebsite
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$9({
     isCustomWebsite
   });
@@ -2783,7 +2783,7 @@ function Carousel({
   const sliderRef = useRef();
   const {
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useCarouselStyles({
     isMobile,
     buttonContainerClass,
@@ -2861,7 +2861,7 @@ function Section$4({
     isMobile,
     isCustomWebsite,
     countryCode
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$8({
     isCustomWebsite,
     isMobile,
@@ -2918,7 +2918,7 @@ function BannerCarouselRight({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$8({
     containerWidth,
     isMobile
@@ -3115,7 +3115,7 @@ function List({
       containerWidth
     },
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$7({
     containerWidth,
     isMobile
@@ -3380,7 +3380,7 @@ const Section$3 = ({
     isMobile,
     isCustomWebsite,
     countryCode
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const hasContent = Boolean(nodeData.cardHeading.metadata.value || nodeData.title.metadata.valu || nodeData.description.metadata.value);
   const mobileImageSrc = isMobile && nodeData?.mobileImage?.metadata?.value;
   const desktopImageSrc = nodeData?.image?.metadata?.value;
@@ -3619,7 +3619,7 @@ function Section$2({
     isMobile,
     isCustomWebsite,
     countryCode
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$5({
     isCustomWebsite,
     isMobile,
@@ -3676,7 +3676,7 @@ function BannerCarouselLeft({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$5({
     containerWidth
   });
@@ -3975,7 +3975,7 @@ function SubscribeToNewsletter({
     isEdit,
     isLandingPages,
     extraProps
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [nodeData] = sectionData.components;
   const classes = useSectionStyles$4({
     containerWidth,
@@ -4279,7 +4279,7 @@ function Section$1({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const carouselList = nodeData?.cardCarousel?.components;
   const cardsCount = carouselList?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -4749,7 +4749,7 @@ function VideoTestimonial({
     countryCode,
     currencySymbol,
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useVideoTestimonialStyles({
     containerWidth,
     isMobile
@@ -4973,7 +4973,7 @@ function Video({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [videoData] = sectionData.components;
   const cardsCount = videoData?.videoCarousel?.components?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -5179,7 +5179,7 @@ function Info({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const theme = useTheme();
   const slidesToShow = isMobile ? 1 : 4;
   const [nodeData] = sectionData.components;
@@ -5336,7 +5336,7 @@ const TextSection = ({
       containerWidth
     },
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$2({
     containerWidth,
     isMobile
@@ -5519,7 +5519,7 @@ function PhotoGallery({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [nodeData] = sectionData.components;
   const carouselList = nodeData?.cardCarousel?.components;
   const cardsCount = carouselList?.length;
@@ -5713,7 +5713,7 @@ const FAQListing = ({
       containerWidth
     },
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useFaqListStyles({
     selectedIndex,
     containerWidth,
@@ -5896,7 +5896,7 @@ const TextGrid = ({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [nodeData] = sectionData.components;
   const cardsCount = nodeData?.contentList?.components?.length;
   const slidesToShow = isMobile ? 1 : 2;
@@ -6289,7 +6289,7 @@ function CourseCard({
   const classes = useCourseStyles();
   const {
     isEdit
-  } = useContext(PageContext);
+  } = useContext$1(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);
@@ -6354,7 +6354,7 @@ function courses({
     isEdit,
     countryCode,
     currencySymbol
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [cardList, setCardList] = useState(null);
   const [errored, setErrored] = useState(false);
   const [fallBackImages, setFallbackImages] = useState([]);
@@ -6754,7 +6754,7 @@ function TeamCard({
     layout: {
       containerWidth
     }
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const [teamData] = sectionData.components;
   const cardsCount = teamData?.teamCarousel?.components?.length;
   const slidesToShow = isMobile ? 1 : 4;
@@ -6993,7 +6993,7 @@ function FormEnquiry({
     isEdit,
     isLandingPages,
     extraProps
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useSectionStyles$1({
     containerWidth,
     isMobile
@@ -7454,7 +7454,7 @@ function Contact({
     isEdit,
     isLandingPages,
     extraProps
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   let [btnDisabled, setBtnDisabled] = useState(false);
   const [isSubmitted, setIsSubmitted] = useState(false);
   const [nodeData] = sectionData.components;
@@ -8113,7 +8113,7 @@ function CoursePromotionPage$1({
     countryCode,
     currencySymbol,
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useWebinarPromotionPage({
     containerWidth,
     isMobile,
@@ -8448,7 +8448,7 @@ const SingleVideoSlide = props => {
     },
     isMobile,
     isEdit
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const renderer = ({
     days,
     hours,
@@ -8705,7 +8705,7 @@ function CoursePromotionPage({
     countryCode,
     currencySymbol,
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useCoursePromotionPage({
     containerWidth,
     isMobile
@@ -8732,7 +8732,7 @@ var index$5 = /*#__PURE__*/Object.freeze({
   'default': CoursePromotionPage
 });
 
-const useFormPageStyles$1 = createUseStyles(theme => ({
+const useFormPageStyles = createUseStyles(theme => ({
   formPageSection: {
     padding: ({
       isMobile
@@ -8897,8 +8897,8 @@ const FormPage = ({
     baseURLs,
     isMobile,
     countryCode
-  } = useContext(PageContext);
-  const classes = useFormPageStyles$1({
+  } = useContext$1(PageContext);
+  const classes = useFormPageStyles({
     isMobile
   });
   const handleSubmit = async e => {
@@ -9188,7 +9188,7 @@ function Tiles({
     },
     isPreview,
     isEdit
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useTilesStyles({
     isMobile
   });
@@ -9937,7 +9937,7 @@ function ABOUT_INSTITUTE({
       containerWidth
     },
     isMobile
-  } = useContext(PageContext);
+  } = useContext$1(PageContext);
   const classes = useAboutInstituteStyles({
     containerWidth,
     isMobile
@@ -10089,13 +10089,56 @@ var index$1 = /*#__PURE__*/Object.freeze({
   'default': ABOUT_INSTITUTE
 });
 
+const useTimerCallPageStyles = createUseStyles(theme => ({
+  timerAndCallSection: {
+    padding: ({
+      isMobile
+    } = {}) => isMobile ? '24px' : '80px 120px',
+    background: theme?.colors?.white,
+    '&, & *, & *:before, & *:after': {
+      fontFamily: theme?.typography?.fontFamily,
+      boxSizing: 'border-box'
+    }
+  },
+  timerAndCallContainer: {
+    padding: '72px',
+    background: theme?.colors?.background3,
+    borderRadius: '8px',
+    boxShadow: '0px 4px 10px rgba(0, 0, 0, 0.16)'
+  },
+  timerAndCallBox: {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: '42px'
+  },
+  // SMALL SCREEN
+  '@media screen and (max-width: 767px)': {
+    timerAndCallSection: {
+      padding: '24px'
+    },
+    timerAndCallContainer: {
+      padding: '16px'
+    },
+    timerAndCallBox: {
+      gap: '32px'
+    }
+  }
+}));
+
 const TimerAndCall = ({
   sectionData,
   extraProps = {}
 }) => {
-  console.log('sid sectionData', sectionData, extraProps);
+  const {
+    _id,
+    baseURLs,
+    isMobile,
+    countryCode,
+    pageData
+  } = useContext(PageContext);
   const [nodeData] = sectionData?.components;
-  const classes = useFormPageStyles({
+  console.log('sid sectionData', sectionData, extraProps, pageData, PageContext);
+  const classes = useTimerCallPageStyles({
     isMobile
   });
   return /*#__PURE__*/React.createElement("section", {