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