diy-template-components 2.0.15 → 2.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/build/index.js CHANGED
@@ -378,10 +378,9 @@ const buttonStyles = createUseStyles(theme => ({
378
378
  color: ({
379
379
  disabled
380
380
  } = {}) => disabled ? colorMixer(theme?.palette?.background?.default, 0.5).color : theme?.colors?.CtaTextColor,
381
- background: theme?.colors?.ctaColor,
382
- opacity: ({
381
+ background: ({
383
382
  disabled
384
- } = {}) => disabled ? 0.5 : 1,
383
+ } = {}) => disabled ? colorMixer(theme?.palette?.primary.main, 0.5).color : theme?.colors?.ctaColor,
385
384
  border: 'none',
386
385
  textDecoration: 'none',
387
386
  cursor: ({
@@ -405,10 +404,9 @@ const buttonStyles = createUseStyles(theme => ({
405
404
  color: ({
406
405
  disabled
407
406
  } = {}) => disabled ? colorMixer(theme.palette.primary.main, 0.5).color : theme?.colors?.CtaTextColor,
408
- background: theme?.colors?.ctaColor,
409
- opacity: ({
407
+ background: ({
410
408
  disabled
411
- } = {}) => disabled ? 0.5 : 1,
409
+ } = {}) => disabled ? colorMixer(theme?.palette?.parimar?.default, 0.5).color : theme?.colors?.ctaColor,
412
410
  border: ({
413
411
  disabled
414
412
  } = {}) => disabled ? `1px solid ${colorMixer(theme.palette.primary.main, 0.5).color}` : `1px solid ${theme?.colors?.ctaColor}`,
@@ -1099,7 +1097,6 @@ function OptionList({
1099
1097
  const downloadAppText = countryCode === 'KR' ? '앱다운로드' : 'Download App';
1100
1098
  const renderDownloadAppButton = () => {
1101
1099
  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, apkURL && /*#__PURE__*/React__default["default"].createElement("a", {
1102
- download: true,
1103
1100
  href: headerData?.apkURL,
1104
1101
  target: "_blank",
1105
1102
  className: classes.socialBtnItems,
@@ -1433,7 +1430,7 @@ function MobileHeader({
1433
1430
  onClick: () => {
1434
1431
  let url = getAppDownloadLink(apkURL, iosDownloadLink);
1435
1432
  window.open(url, '_blank');
1436
- if (!header?.iosUrl && typeof onDownloadAppTriggered == 'function') {
1433
+ if (url === apkURL && typeof onDownloadAppTriggered == 'function') {
1437
1434
  onDownloadAppTriggered(header?.isAndroidDelisted, header?.apkURL);
1438
1435
  }
1439
1436
  }
@@ -1468,7 +1465,7 @@ function MobileHeader({
1468
1465
  onClick: () => {
1469
1466
  let url = getAppDownloadLink(apkURL, iosDownloadLink);
1470
1467
  window.open(url, '_blank');
1471
- if (!header?.iosUrl && typeof onDownloadAppTriggered == 'function') {
1468
+ if (url === apkURL && typeof onDownloadAppTriggered == 'function') {
1472
1469
  onDownloadAppTriggered(header?.isAndroidDelisted, header?.apkURL);
1473
1470
  }
1474
1471
  }
@@ -1609,7 +1606,6 @@ const useSectionStyles$9 = createUseStyles(theme => ({
1609
1606
 
1610
1607
  // '& img': { maxHeight: '55px' }
1611
1608
  },
1612
-
1613
1609
  upperContainerItem1Img: {
1614
1610
  maxHeight: '55px',
1615
1611
  paddingBottom: '84px',
@@ -2036,7 +2032,6 @@ const mobilePadding = {
2036
2032
  // 24px
2037
2033
  medium: baseFactor * 6 // 48px
2038
2034
  };
2039
-
2040
2035
  const padding = {
2041
2036
  minute: baseFactor * 2,
2042
2037
  // 16px
@@ -2502,7 +2497,6 @@ const useSectionStyles$8 = createUseStyles(theme => ({
2502
2497
  // }
2503
2498
  // }
2504
2499
  },
2505
-
2506
2500
  sectionContainer: {
2507
2501
  margin: '0 auto',
2508
2502
  maxWidth: ({
@@ -3072,7 +3066,6 @@ const useSectionStyles$7 = createUseStyles(theme => ({
3072
3066
  // padding: '0'
3073
3067
  }
3074
3068
  },
3075
-
3076
3069
  '&:nth-child(2n+1)': {
3077
3070
  marginRight: '0',
3078
3071
  '& $contentText': {
@@ -3082,7 +3075,6 @@ const useSectionStyles$7 = createUseStyles(theme => ({
3082
3075
  }
3083
3076
  }
3084
3077
  },
3085
-
3086
3078
  contentNumber: {
3087
3079
  width: '100%',
3088
3080
  padding: '24px',
@@ -3475,7 +3467,6 @@ const useSectionStyles$5 = createUseStyles(theme => {
3475
3467
  // }
3476
3468
  // }
3477
3469
  },
3478
-
3479
3470
  sectionContainer: {
3480
3471
  margin: '0 auto',
3481
3472
  maxWidth: ({
@@ -3489,7 +3480,6 @@ const useSectionStyles$5 = createUseStyles(theme => {
3489
3480
 
3490
3481
  // padding: `${theme?.spacing?.padding?.regular}px ${theme?.spacing?.padding?.medium}px 0px ${theme?.spacing?.padding?.medium}px`
3491
3482
  },
3492
-
3493
3483
  imageContainerDiv: {
3494
3484
  width: '50%',
3495
3485
  position: 'relative'
@@ -3561,7 +3551,6 @@ const useSectionStyles$5 = createUseStyles(theme => {
3561
3551
  width: '100%'
3562
3552
  // padding: `${theme?.spacing?.padding?.medium}px ${theme?.spacing?.padding?.regular}px`
3563
3553
  },
3564
-
3565
3554
  imageContainer: {
3566
3555
  height: 'unset !important',
3567
3556
  '& img': {
@@ -4568,7 +4557,6 @@ const useVideoTestimonialStyles = createUseStyles(theme => {
4568
4557
  fontFamily: theme?.typography?.fontFamily
4569
4558
  // boxSizing: 'border-box'
4570
4559
  },
4571
-
4572
4560
  '& h2,& h3,& p': {
4573
4561
  marginTop: '0'
4574
4562
  }
@@ -4593,7 +4581,6 @@ const useVideoTestimonialStyles = createUseStyles(theme => {
4593
4581
  wordBreak: 'break-word'
4594
4582
  // marginBottom: '8px'
4595
4583
  },
4596
-
4597
4584
  videoTestimonialTitle: {
4598
4585
  fontSize: theme.typography.fontSize.h2,
4599
4586
  // lineHeight: '71px',
@@ -5034,7 +5021,6 @@ const useSectionStyles$3 = createUseStyles(theme => ({
5034
5021
  // }
5035
5022
  // }
5036
5023
  },
5037
-
5038
5024
  sectionContainer: {
5039
5025
  margin: '0 auto',
5040
5026
  maxWidth: ({
@@ -5392,7 +5378,6 @@ const usePhotoGalleryStyles = createUseStyles(theme => {
5392
5378
  // }
5393
5379
  // }
5394
5380
  },
5395
-
5396
5381
  sectionContainer: {
5397
5382
  margin: '0 auto',
5398
5383
  maxWidth: ({
@@ -5423,7 +5408,6 @@ const usePhotoGalleryStyles = createUseStyles(theme => {
5423
5408
  position: 'relative',
5424
5409
  paddingBottom: '59.83%' // keeping aspect ratio 585x350
5425
5410
  },
5426
-
5427
5411
  contentRow: {
5428
5412
  display: 'grid',
5429
5413
  gridTemplateColumns: ({
@@ -5970,7 +5954,6 @@ const useCourseStyles = createUseStyles(theme => {
5970
5954
  // }
5971
5955
  // }
5972
5956
  },
5973
-
5974
5957
  sectionContainer: {
5975
5958
  margin: '0 auto',
5976
5959
  maxWidth: ({
@@ -6003,7 +5986,6 @@ const useCourseStyles = createUseStyles(theme => {
6003
5986
  // textAlign: 'center',
6004
5987
  // wordBreak: 'break-word'
6005
5988
  },
6006
-
6007
5989
  slickContainer: {
6008
5990
  marginRight: '-20px'
6009
5991
  },
@@ -6051,7 +6033,6 @@ const useCourseStyles = createUseStyles(theme => {
6051
6033
  justifyContent: 'space-between'
6052
6034
  //alignItems: 'center',
6053
6035
  },
6054
-
6055
6036
  courseCardTags: {
6056
6037
  display: 'flex',
6057
6038
  justifyContent: 'flex-start',
@@ -6082,7 +6063,6 @@ const useCourseStyles = createUseStyles(theme => {
6082
6063
  // whiteSpace: 'nowrap',
6083
6064
  // textOverflow: 'ellipsis'
6084
6065
  },
6085
-
6086
6066
  courseCardDiscount: {
6087
6067
  display: 'flex',
6088
6068
  justifyContent: 'flex-start',
@@ -6189,7 +6169,6 @@ const useCourseStyles = createUseStyles(theme => {
6189
6169
  // whiteSpace: 'nowrap',
6190
6170
  // textOverflow: 'ellipsis'
6191
6171
  },
6192
-
6193
6172
  singleCard: {
6194
6173
  margin: '6px 2px'
6195
6174
  // width: 'calc(100% - 12px)'
@@ -6565,7 +6544,6 @@ const useTeamStyles = createUseStyles(theme => {
6565
6544
  margin: '20px 0 0'
6566
6545
  // overflowWrap: 'break-word'
6567
6546
  },
6568
-
6569
6547
  teamDetailsHeading: {
6570
6548
  fontSize: theme.typography.fontSize.h6,
6571
6549
  fontWeight: theme.typography.fontWeight.bold,
@@ -6609,7 +6587,6 @@ const useTeamStyles = createUseStyles(theme => {
6609
6587
  // margin: '15px 0 0',
6610
6588
  // paddingBottom: '0'
6611
6589
  },
6612
-
6613
6590
  teamDetailsHeading: {
6614
6591
  fontSize: '16px',
6615
6592
  lineHeight: '24px',
@@ -6742,7 +6719,6 @@ const useSectionStyles$1 = createUseStyles(theme => ({
6742
6719
  // }
6743
6720
  // }
6744
6721
  },
6745
-
6746
6722
  formContainer: {
6747
6723
  margin: '0 auto',
6748
6724
  maxWidth: ({
@@ -6779,14 +6755,12 @@ const useSectionStyles$1 = createUseStyles(theme => ({
6779
6755
  display: 'flex'
6780
6756
  // alignItems: 'flex-start',
6781
6757
  },
6782
-
6783
6758
  leftContainerForm: {
6784
6759
  width: '65%',
6785
6760
  display: 'flex',
6786
6761
  flexDirection: 'column'
6787
6762
  // justifyContent: 'space-between'
6788
6763
  },
6789
-
6790
6764
  subtitle: {
6791
6765
  // margin: '0 0 40px 0',
6792
6766
  fontSize: theme.typography.fontSize.h5,
@@ -6854,7 +6828,6 @@ const useSectionStyles$1 = createUseStyles(theme => ({
6854
6828
  width: '100%'
6855
6829
  // padding: '0 16ox'
6856
6830
  },
6857
-
6858
6831
  rightContainer: {
6859
6832
  width: '100%',
6860
6833
  padding: '0'
@@ -7162,7 +7135,6 @@ const useSectionStyles = createUseStyles(theme => ({
7162
7135
  // }
7163
7136
  // }
7164
7137
  },
7165
-
7166
7138
  contactContainer: {
7167
7139
  width: '100%',
7168
7140
  margin: '0 auto',
@@ -7201,7 +7173,6 @@ const useSectionStyles = createUseStyles(theme => ({
7201
7173
  // justifyContent: 'space-between',
7202
7174
  // flex: 1
7203
7175
  },
7204
-
7205
7176
  subtitle: {
7206
7177
  // margin: '0 0 auto 0',
7207
7178
  fontSize: theme.typography.fontSize.h6,
@@ -7358,7 +7329,6 @@ function Contact({
7358
7329
  extraProps
7359
7330
  } = React.useContext(PageContext);
7360
7331
  let [btnDisabled, setBtnDisabled] = React.useState(false);
7361
- const [isSubmitted, setIsSubmitted] = React.useState(false);
7362
7332
  const [nodeData] = sectionData.components;
7363
7333
  const classes = useSectionStyles({
7364
7334
  containerWidth,
@@ -7391,15 +7361,14 @@ function Contact({
7391
7361
  if (!(isPreview || isEdit)) postApiCall(baseURLs, data);
7392
7362
  setBtnDisabled(true);
7393
7363
  setInputVal(formInitialValue);
7394
- setIsSubmitted(true);
7395
7364
  };
7396
7365
  React.useEffect(() => {
7397
- if (validData?.nameValid && validData?.emailValid && validData?.phoneValid && validData?.messageValid && inputVal?.email && inputVal?.name && inputVal?.phone && inputVal?.message) {
7366
+ if (validData?.nameValid && validData?.emailValid && validData?.phoneValid && validData?.messageValid) {
7398
7367
  setBtnDisabled(false);
7399
7368
  } else {
7400
7369
  setBtnDisabled(true);
7401
7370
  }
7402
- }, [validData, inputVal]);
7371
+ }, [validData]);
7403
7372
  const checkValidity = (regexField, fieldname, fieldValidity) => {
7404
7373
  if (validations?.[regexField]?.length) {
7405
7374
  let regex = new RegExp(validations[regexField]);
@@ -7542,7 +7511,7 @@ function Contact({
7542
7511
  className: classes.btnContainer
7543
7512
  }, /*#__PURE__*/React__default["default"].createElement(Button, {
7544
7513
  ref: nodeData?.cta?.refSetter,
7545
- data: isSubmitted ? {
7514
+ data: btnDisabled && validData?.messageValid && validData?.emailValid && validData?.nameValid && validData?.phoneValid ? {
7546
7515
  value: 'Submitted'
7547
7516
  } : {
7548
7517
  value: nodeData.cta.metadata.value
@@ -7643,7 +7612,6 @@ const useWebinarPromotionPage = createUseStyles(theme => {
7643
7612
  marginTop: '5%'
7644
7613
  // padding: '0px 5% 0px 5%'
7645
7614
  },
7646
-
7647
7615
  iframe: {
7648
7616
  position: 'absolute',
7649
7617
  width: '100%',
@@ -7991,7 +7959,6 @@ const SingleVideoSlide$1 = props => {
7991
7959
  value: data.isPaid ? buyNowText : registerNowText
7992
7960
  // isExternal: 1
7993
7961
  },
7994
-
7995
7962
  onClick: webinarCtaClick,
7996
7963
  type: 'primary',
7997
7964
  size: 'medium',
@@ -8060,7 +8027,6 @@ const useCoursePromotionPage = createUseStyles(theme => {
8060
8027
  // }
8061
8028
  // }
8062
8029
  },
8063
-
8064
8030
  sectionContainer: {
8065
8031
  margin: '0 auto',
8066
8032
  maxWidth: ({
@@ -8178,7 +8144,6 @@ const useCoursePromotionPage = createUseStyles(theme => {
8178
8144
  // paddingBottom: '10px',
8179
8145
  // paddingTop: '10px'
8180
8146
  },
8181
-
8182
8147
  bannerContainer: {
8183
8148
  width: '100%',
8184
8149
  background: theme?.colors?.bannerColor,
@@ -8193,7 +8158,6 @@ const useCoursePromotionPage = createUseStyles(theme => {
8193
8158
  clipPath: 'polygon(0 0, 100% 0, 100% calc(100% - 10px), 0 calc(100% - 10px), 15px calc(50% - 10px/2))'
8194
8159
  // marginBottom: '16px'
8195
8160
  },
8196
-
8197
8161
  bannerContainerText: {
8198
8162
  transform: 'rotate(180deg)'
8199
8163
  },
@@ -8306,7 +8270,6 @@ const useCoursePromotionPage = createUseStyles(theme => {
8306
8270
  height: 'max-content'
8307
8271
  // paddingRight: '10px'
8308
8272
  },
8309
-
8310
8273
  videoDetails: {
8311
8274
  width: '100%'
8312
8275
  },
@@ -8565,7 +8528,6 @@ const SingleVideoSlide = props => {
8565
8528
  value: buyNowText
8566
8529
  // isExternal: 1
8567
8530
  },
8568
-
8569
8531
  onClick: courseBuyNow,
8570
8532
  type: 'primary',
8571
8533
  size: 'medium',
@@ -8670,7 +8632,6 @@ const useFormPageStyles = createUseStyles(theme => ({
8670
8632
  // border: '1px solid #D8E0F0',
8671
8633
  // borderRadius: '16px'
8672
8634
  },
8673
-
8674
8635
  inputFieldLabel: {
8675
8636
  color: theme?.colors?.lightblack,
8676
8637
  fontSize: theme.typography.fontSize.body,
@@ -8983,7 +8944,6 @@ const FormPage = ({
8983
8944
  value: countryCode === 'KR' ? '제출하기' : 'SUBMIT'
8984
8945
  // isExternal: 1
8985
8946
  },
8986
-
8987
8947
  type: 'primary',
8988
8948
  size: 'medium',
8989
8949
  target: null,
@@ -9166,7 +9126,6 @@ const useEmailStyles = createUseStyles(theme => ({
9166
9126
  height: '48px'
9167
9127
  /* margin: 18px 0px; */
9168
9128
  },
9169
-
9170
9129
  'p-young-guru-title': {
9171
9130
  fontFamily: theme?.typography?.fontFamily,
9172
9131
  fontStyle: 'normal',
@@ -9194,7 +9153,6 @@ const useEmailStyles = createUseStyles(theme => ({
9194
9153
  textAlign: 'center'
9195
9154
  /* padding:35px 0 40px */
9196
9155
  },
9197
-
9198
9156
  'two-columns .column': {
9199
9157
  width: '100%',
9200
9158
  maxWidth: '275px',