@gem-sdk/components 2.4.4 → 2.4.6
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.
|
@@ -32,7 +32,7 @@ const ProductPrice = (props)=>{
|
|
|
32
32
|
bundleItem?.quantity
|
|
33
33
|
]);
|
|
34
34
|
const bundleDiscount = React.useMemo(()=>{
|
|
35
|
-
const value =
|
|
35
|
+
const value = Number(bundleItem?.discountValue);
|
|
36
36
|
if (bundleItem?.discountType === 'percentage') {
|
|
37
37
|
return price * quantityProduct * value / 100;
|
|
38
38
|
}
|
|
@@ -53,9 +53,7 @@ const HTML5Embed = (props)=>{
|
|
|
53
53
|
${initPreloadPoster()}
|
|
54
54
|
<video
|
|
55
55
|
id="${videoId}"
|
|
56
|
-
class="${core.cls(' gp-w-full', props.className, props.isVideoComponent && !props.lazy ? '' : 'lazy'
|
|
57
|
-
'gp-object-cover': props.autoplay
|
|
58
|
-
})}"
|
|
56
|
+
class="${core.cls(' gp-w-full', props.className, props.isVideoComponent && !props.lazy ? '' : 'lazy')}"
|
|
59
57
|
style="${props.style}"
|
|
60
58
|
${props.controls ? 'controls' : undefined}
|
|
61
59
|
${props.loop ? 'loop' : undefined}
|
|
@@ -71,32 +69,32 @@ const HTML5Embed = (props)=>{
|
|
|
71
69
|
${core.RenderIf(props.src.endsWith('.mp4'), `<source data-src="${props.src}" src="${srcUnLazyVideo}" type="video/mp4"></source>`)}
|
|
72
70
|
</video>
|
|
73
71
|
<div
|
|
74
|
-
|
|
75
|
-
|
|
72
|
+
style="${props.style}"
|
|
73
|
+
class="${core.cls('gp-absolute gp-top-0 gp-left-0 gp-w-full gp-thumbnail-video', {
|
|
76
74
|
'gp-hidden': !props.thumbnail || props.autoplay
|
|
77
75
|
})}"
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
76
|
+
>
|
|
77
|
+
<img
|
|
78
|
+
id="video-thumbnail"
|
|
79
|
+
src="${props.thumbnail ?? ''}"
|
|
80
|
+
class="gp-w-full gp-h-full gp-object-cover"
|
|
81
|
+
alt="Video Thumbnail"
|
|
82
|
+
></img>
|
|
83
|
+
<button
|
|
84
|
+
type="button"
|
|
85
|
+
class="${core.cls('gp-absolute gp-left-1/2 gp-top-1/2 gp-flex gp-aspect-[56/32] gp-w-14 -gp-translate-x-1/2 -gp-translate-y-1/2 gp-items-center gp-justify-center gp-rounded gp-bg-black/80 gp-transition-colors hover:gp-bg-[#ef0800]')}"
|
|
86
|
+
aria-label="Play"
|
|
87
|
+
>
|
|
88
|
+
<svg class="gp-w-5 gp-text-white" viewBox="0 0 24 24">
|
|
89
|
+
<path
|
|
90
|
+
fill="currentColor"
|
|
91
|
+
d="M5 5.274c0-1.707 1.826-2.792 3.325-1.977l12.362 6.726c1.566.853 1.566 3.101 0 3.953L8.325 20.702C6.826 21.518 5 20.432 5 18.726V5.274Z"
|
|
92
|
+
/>
|
|
93
|
+
</svg>
|
|
94
|
+
</button>
|
|
95
|
+
</div>
|
|
96
|
+
</gp-lite-html5-embed>
|
|
97
|
+
${core.RenderIf(core.isLocalEnv, `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="{{ 'gp-lite-html5-embed.js' | asset_url }}" defer="defer"></script>`, `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="${core.baseAssetURL}/assets-v2/gp-lite-html5-embed.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
100
98
|
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.8.3/dist/lazyload.min.js"></script>
|
|
101
99
|
<script>
|
|
102
100
|
if(lazyLoadInstance){lazyLoadInstance.update()}else{var lazyLoadInstance = new LazyLoad()}
|
|
@@ -28,7 +28,7 @@ const ProductPrice = (props)=>{
|
|
|
28
28
|
bundleItem?.quantity
|
|
29
29
|
]);
|
|
30
30
|
const bundleDiscount = useMemo(()=>{
|
|
31
|
-
const value =
|
|
31
|
+
const value = Number(bundleItem?.discountValue);
|
|
32
32
|
if (bundleItem?.discountType === 'percentage') {
|
|
33
33
|
return price * quantityProduct * value / 100;
|
|
34
34
|
}
|
|
@@ -49,9 +49,7 @@ const HTML5Embed = (props)=>{
|
|
|
49
49
|
${initPreloadPoster()}
|
|
50
50
|
<video
|
|
51
51
|
id="${videoId}"
|
|
52
|
-
class="${cls(' gp-w-full', props.className, props.isVideoComponent && !props.lazy ? '' : 'lazy'
|
|
53
|
-
'gp-object-cover': props.autoplay
|
|
54
|
-
})}"
|
|
52
|
+
class="${cls(' gp-w-full', props.className, props.isVideoComponent && !props.lazy ? '' : 'lazy')}"
|
|
55
53
|
style="${props.style}"
|
|
56
54
|
${props.controls ? 'controls' : undefined}
|
|
57
55
|
${props.loop ? 'loop' : undefined}
|
|
@@ -67,32 +65,32 @@ const HTML5Embed = (props)=>{
|
|
|
67
65
|
${RenderIf(props.src.endsWith('.mp4'), `<source data-src="${props.src}" src="${srcUnLazyVideo}" type="video/mp4"></source>`)}
|
|
68
66
|
</video>
|
|
69
67
|
<div
|
|
70
|
-
|
|
71
|
-
|
|
68
|
+
style="${props.style}"
|
|
69
|
+
class="${cls('gp-absolute gp-top-0 gp-left-0 gp-w-full gp-thumbnail-video', {
|
|
72
70
|
'gp-hidden': !props.thumbnail || props.autoplay
|
|
73
71
|
})}"
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
72
|
+
>
|
|
73
|
+
<img
|
|
74
|
+
id="video-thumbnail"
|
|
75
|
+
src="${props.thumbnail ?? ''}"
|
|
76
|
+
class="gp-w-full gp-h-full gp-object-cover"
|
|
77
|
+
alt="Video Thumbnail"
|
|
78
|
+
></img>
|
|
79
|
+
<button
|
|
80
|
+
type="button"
|
|
81
|
+
class="${cls('gp-absolute gp-left-1/2 gp-top-1/2 gp-flex gp-aspect-[56/32] gp-w-14 -gp-translate-x-1/2 -gp-translate-y-1/2 gp-items-center gp-justify-center gp-rounded gp-bg-black/80 gp-transition-colors hover:gp-bg-[#ef0800]')}"
|
|
82
|
+
aria-label="Play"
|
|
83
|
+
>
|
|
84
|
+
<svg class="gp-w-5 gp-text-white" viewBox="0 0 24 24">
|
|
85
|
+
<path
|
|
86
|
+
fill="currentColor"
|
|
87
|
+
d="M5 5.274c0-1.707 1.826-2.792 3.325-1.977l12.362 6.726c1.566.853 1.566 3.101 0 3.953L8.325 20.702C6.826 21.518 5 20.432 5 18.726V5.274Z"
|
|
88
|
+
/>
|
|
89
|
+
</svg>
|
|
90
|
+
</button>
|
|
91
|
+
</div>
|
|
92
|
+
</gp-lite-html5-embed>
|
|
93
|
+
${RenderIf(isLocalEnv, `<script ${getSettingPreloadData('class="gps-link" delay', 'src')}="{{ 'gp-lite-html5-embed.js' | asset_url }}" defer="defer"></script>`, `<script ${getSettingPreloadData('class="gps-link" delay', 'src')}="${baseAssetURL}/assets-v2/gp-lite-html5-embed.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
96
94
|
<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.8.3/dist/lazyload.min.js"></script>
|
|
97
95
|
<script>
|
|
98
96
|
if(lazyLoadInstance){lazyLoadInstance.update()}else{var lazyLoadInstance = new LazyLoad()}
|