@gem-sdk/components 17.0.0-staging.10 → 17.0.0-staging.12
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/dist/cjs/product/components/product-button/common/helpers.js +1 -1
- package/dist/cjs/product/components/product-images-v3/components/feature-gallery/FeatureImageWithGallery.liquid.js +18 -17
- package/dist/esm/product/components/product-button/common/helpers.js +1 -1
- package/dist/esm/product/components/product-images-v3/components/feature-gallery/FeatureImageWithGallery.liquid.js +19 -18
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var constants=require("./constants.js");const LIQUID_EXPRESSION_REGEX=/^\s*\{\{[\s\S]*\}\}\s*$/,appendLiquidEscapeFilter=e=>e.replace(/\s*\}\}\s*$/,"
|
|
1
|
+
"use strict";var constants=require("./constants.js");const LIQUID_EXPRESSION_REGEX=/^\s*\{\{[\s\S]*\}\}\s*$/,appendLiquidEscapeFilter=e=>e.replace(/\s*\}\}\s*$/,"| escape | replace: '"', '\"' }}"),escapeSingleQuoteForAttr=e=>{if(null==e)return e;let t=e.toString();return LIQUID_EXPRESSION_REGEX.test(t)?appendLiquidEscapeFilter(t):t.replaceAll("'","'").replaceAll("’","'")},checkIconVisibility=e=>e?.enableIcon===!0,getRenderRegularPriceSettings=e=>({lineThrough:!1,typo:removeColorFromTypo(e?.priceTypo)}),getRenderComparePriceSettings=e=>({lineThrough:!0,typo:removeColorFromTypo(e?.compareAtPriceTypo),opacityPrice:e?.opacityPrice}),getGPProductButtonState=({styles:e,setting:t,successMessage:r,errorMessage:o})=>({styles:{errorTypo:e?.errorTypo,successTypo:e?.successTypo},setting:{errorType:t?.errorType,actionEffect:t?.actionEffect,enableMessage:t?.enableMessage,label:escapeSingleQuoteForAttr(t?.label),errorMessage:escapeSingleQuoteForAttr(o??t?.errorMessage),successMessage:escapeSingleQuoteForAttr(r??t?.successMessage),outOfStockLabel:escapeSingleQuoteForAttr(t?.outOfStockLabel),customURL:{link:escapeSingleQuoteForAttr(t?.customURL?.link),target:t?.customURL?.target}},variantID:"{{variant.id}}",disabled:"{{variant.available}}",totalVariant:"{{total_combinations}}"}),renderSeparator=e=>{let t=e??"horizontal-line";return({dot:constants.SEPARATOR.DOT,"vertical-line":constants.SEPARATOR.VERTICAL_LINE,"horizontal-line":constants.SEPARATOR.HORIZONTAL_LINE})[t]??constants.SEPARATOR.HORIZONTAL_LINE},removeColorFromTypo=e=>(e?.attrs&&e?.attrs.color&&delete e.attrs.color,e);exports.checkIconVisibility=checkIconVisibility,exports.getGPProductButtonState=getGPProductButtonState,exports.getRenderComparePriceSettings=getRenderComparePriceSettings,exports.getRenderRegularPriceSettings=getRenderRegularPriceSettings,exports.renderSeparator=renderSeparator;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),common=require("../../common/common.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),HTML5Embed_liquid=require("../../../../../video/components/HTML5Embed.liquid.js"),Modal3d_liquid=require("../../../../../image/components/Modal3d.liquid.js"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),Video_liquid=require("../../../../../image/components/Video.liquid.js"),_function=require("../../../../helpers/function.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),system=require("@gem-sdk/system"),Carousel_liquid=require("../../../../../carousel-v3/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel-v3/components/item/CarouselItem.liquid.js");const FeatureImageWithGallery=({builderPropUID:e,children:t,enableLazyLoadImage:i,...a})=>{let{featuredImageCarouselClasses:s,galleryItemClasses:r,featuredCarouselItemClasses:d}=getProductImagesClassName.getProductImagesClassName({...a,builderProps:{uid:e}}),{featuredImageCarouselStyle:u,featureImageStyle:o,featureImageCarouselOnlyOneImageStyle:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),common=require("../../common/common.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),HTML5Embed_liquid=require("../../../../../video/components/HTML5Embed.liquid.js"),Modal3d_liquid=require("../../../../../image/components/Modal3d.liquid.js"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),Video_liquid=require("../../../../../image/components/Video.liquid.js"),_function=require("../../../../helpers/function.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),system=require("@gem-sdk/system"),Carousel_liquid=require("../../../../../carousel-v3/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel-v3/components/item/CarouselItem.liquid.js");const FeatureImageWithGallery=({builderPropUID:e,children:t,enableLazyLoadImage:i,...a})=>{let{featuredImageCarouselClasses:s,galleryItemClasses:r,featuredCarouselItemClasses:d}=getProductImagesClassName.getProductImagesClassName({...a,builderProps:{uid:e}}),{featuredImageCarouselStyle:u,featureImageStyle:o,featureImageCarouselOnlyOneImageStyle:m,featureImageOnlyOneImageStyle:l,featureImageCarouselItemStyle:g}=getProductImagesStyles.getProductImagesStyles(a),{featuredImageCarouselSettingAttrs:c}=getProductImagesAttr.getProductImagesAttr(a),n=common.getAspectRatio(a.ftShape),p=()=>`
|
|
2
2
|
{% case featureMedia.media_type %}
|
|
3
3
|
{% when 'image' %}
|
|
4
4
|
${I()}
|
|
@@ -11,15 +11,15 @@
|
|
|
11
11
|
{% when 'model' %}
|
|
12
12
|
${f()}
|
|
13
13
|
{% else %}
|
|
14
|
-
${
|
|
14
|
+
${q()}
|
|
15
15
|
{% endcase %}
|
|
16
16
|
`,f=()=>Modal3d_liquid.default({src:system.LiquidIf("featureMedia.sources.first.url contains '.glb'","{{ featureMedia.sources.first.url }}","{{featureMedia.sources.last.url}}"),alt:"{{featureMedia.preview_image.alt}}",poster:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%"},aspectRatio:n}),y=()=>Video_liquid.default({src:"{{mediaSourceVideo}}",alt:"{{featureMedia.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"},aspectRatio:n}),h=()=>{let e=system.createStyle({...productFeaturedImage.getVideoHeight({ftLayout:a?.ftLayout,ftShape:a?.ftShape}),...core.makeStyleResponsive("objf",a?.ftLayout)}),t=system.createStyle({...productFeaturedImage.getVideoHeight({ftLayout:a?.ftLayout,ftShape:a?.ftShape})});return HTML5Embed_liquid.default({src:"{{mediaSourceVideo}}",title:"{{featureMedia.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",isCheckLoaded:!0,wrapperStyles:t,poster:{altText:"{{featureMedia.alt | escape}}"},style:{width:"100%","max-height":"100%",...e},className:"gp-invisible"})},I=()=>core.template`
|
|
17
|
-
${
|
|
17
|
+
${_(core.cls("gp-w-full gp-transition-opacity",{"group-hover:gp-opacity-0":"other"==a.hoverEffect},"{{shouldHidden}}"))}
|
|
18
18
|
${system.If(a?.hoverEffect!=="none",`<div class="${core.cls("zoom-element !gp-max-w-none",productFeaturedImage.getZoomImageClass())}">
|
|
19
|
-
${
|
|
19
|
+
${_("image-zoom",!0)}
|
|
20
20
|
</div>`," ")}
|
|
21
21
|
${system.If(a?.hoverEffect=="zoom"&&a?.zoomType=="glasses",`<div class="${core.cls("zoom-lens-element",productFeaturedImage.getZoomLenClass())}" style="opacity: 0; background-image: url('{{ featureMedia.src | img_url: "1024x1024"}}')"></div>`," ")}
|
|
22
|
-
`,
|
|
22
|
+
`,_=(e,t)=>core.template`
|
|
23
23
|
{% assign src = featureMedia.src %}
|
|
24
24
|
${system.If(t&&"other"==a.hoverEffect,`{% assign media_length = product.media | size %}
|
|
25
25
|
{% assign other_image_index = ${a.otherImage} | plus: 0 %}
|
|
@@ -29,8 +29,8 @@
|
|
|
29
29
|
{% assign otherImage = product.media[other_image_index] %}
|
|
30
30
|
${system.LiquidIf("otherImage.media_type != 'image'","{% assign src = otherImage.preview_image.src %}","{% assign src = otherImage.src %}")}
|
|
31
31
|
`)}
|
|
32
|
-
${NextImage_liquid.default({srcIsLiquidCode:!0,src:system.LiquidIf("src != null",common.getSrcImage("src"),"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif"),id:system.LiquidIf("featureMedia != null","{{featureMedia.id}}"),width:"{{featureMedia.width}}",height:"{{featureMedia.height}}",alt:"{{featureMedia.alt | escape}}",srcset:`${common.getSrcImage("src")}`,baseSrc:"{{src | image_url}}",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:a?.ftLayout,aspectRatio:n,qualityType:a?.qualityType,qualityPercent:a?.qualityPercent},priority:a?.preload,className:`gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none ${e??""}`,enableLazyLoadImage:i})}`,
|
|
33
|
-
${NextImage_liquid.default({srcIsLiquidCode:!0,src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",alt:"No Image",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:a?.ftLayout,aspectRatio:n,qualityType:a?.qualityType,qualityPercent:a?.qualityPercent},priority:a?.preload,className:"gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none",enableLazyLoadImage:i})}`,
|
|
32
|
+
${NextImage_liquid.default({srcIsLiquidCode:!0,src:system.LiquidIf("src != null",common.getSrcImage("src"),"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif"),id:system.LiquidIf("featureMedia != null","{{featureMedia.id}}"),width:"{{featureMedia.width}}",height:"{{featureMedia.height}}",alt:"{{featureMedia.alt | escape}}",srcset:`${common.getSrcImage("src")}`,baseSrc:"{{src | image_url}}",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:a?.ftLayout,aspectRatio:n,qualityType:a?.qualityType,qualityPercent:a?.qualityPercent},priority:a?.preload,className:`gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none ${e??""}`,enableLazyLoadImage:i})}`,q=()=>core.template`
|
|
33
|
+
${NextImage_liquid.default({srcIsLiquidCode:!0,src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",alt:"No Image",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:a?.ftLayout,aspectRatio:n,qualityType:a?.qualityType,qualityPercent:a?.qualityPercent},priority:a?.preload,className:"gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none",enableLazyLoadImage:i})}`,M=common.getPaddingBottomByShapeSetting(a.ftShape),b=t=>`
|
|
34
34
|
${system.Liquid(`{% assign productImageWidth = 0 %}
|
|
35
35
|
{% case featureMedia.media_type %}
|
|
36
36
|
{% when 'image' %}
|
|
@@ -41,21 +41,22 @@
|
|
|
41
41
|
${CarouselItem_liquid.default({id:"{{section.id}}-{{imageID}}",contentType:"productImage",className:`${r(`gp-ft-image-item !gp-min-w-full !gp-max-w-full ${t??""}`)}`,parentId:`ft-${e}-{{section.id}}-{{product.id}}`,style:g,customStyle:{width:"{{productImageWidth}}px"},children:`
|
|
42
42
|
<div
|
|
43
43
|
class="gp-w-full gp-relative ${system.LiquidIf("featureMedia == null or featureMedia.media_type == 'image'","{{ 'gp-h-0' }}","{{ 'gp-h-full !gp-pb-0' }}")}"
|
|
44
|
-
style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",
|
|
44
|
+
style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",M))} ${system.LiquidIf("featureMedia.media_type == 'video' or featureMedia.media_type == 'external_video'","{{ 'display: flex; align-items: center; justify-content: center' }}")}"
|
|
45
45
|
>
|
|
46
46
|
${p()}
|
|
47
47
|
</div>
|
|
48
|
-
`})}`,v=productFeaturedImage.checkRenderFeaturedCarousel(a)
|
|
48
|
+
`})}`,v=productFeaturedImage.checkRenderFeaturedCarousel(a),w="gp-featured-image-wrapper",$=system.LiquidIf("product.media.size > 0",`{% assign largestRatio = 0 %}
|
|
49
49
|
${system.LiquidFor("featureMedia in product.media",`
|
|
50
|
-
{% assign height = featureMedia.height | times: 1.0 %}
|
|
51
|
-
|
|
50
|
+
${system.LiquidIf("featureMedia.media_type == 'video' and featureMedia.preview_image",`{% assign height = featureMedia.preview_image.height | times: 1.0 %}
|
|
51
|
+
{% assign width = featureMedia.preview_image.width | times: 1.0 %}`,`{% assign height = featureMedia.height | times: 1.0 %}
|
|
52
|
+
{% assign width = featureMedia.width | times: 1.0 %}`)}
|
|
52
53
|
{% assign ratio = height | divided_by: width %}
|
|
53
54
|
${system.LiquidIf("ratio > largestRatio","{% assign largestRatio = ratio %}")}
|
|
54
55
|
`)}
|
|
55
56
|
${system.LiquidFor("featureMedia in product.media",`${system.LiquidIf("featureMedia.media_type == 'image'",`${system.LiquidFor("image in product.images",system.LiquidIf("image.src == featureMedia.src","{% assign imageID = image.id %}{% break %}"))}`,"{% assign imageID = '' %}")}
|
|
56
|
-
${
|
|
57
|
+
${b()}`)}
|
|
57
58
|
`,NextImage_liquid.default({src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",id:"noImageError",width:"480",height:"480",alt:"no image",priority:a?.preload,setting:{layout:a?.ftLayout,aspectRatio:n,qualityType:a?.qualityType,qualityPercent:a?.qualityPercent},style:{height:"100%"},className:"gp-w-full featured-image-only !gp-rounded-none",customLazyload:!0,enableLazyLoadImage:i})),L=()=>`
|
|
58
|
-
${Carousel_liquid.default({builderProps:{uid:e},rootId:`ft-${e}-{{section.id}}-{{product.id}}`,conditionAppendJs:"product.media.size > 1",wrapperClass
|
|
59
|
+
${Carousel_liquid.default({builderProps:{uid:e},rootId:`ft-${e}-{{section.id}}-{{product.id}}`,conditionAppendJs:"product.media.size > 1",wrapperClass:w,rootClass:`${s}`,rootAttrs:{type:"gp-feature-image-carousel","product-id":"{{product.id}}","product-media":"{{product.media.size}}"},isHiddenArrowWhenDisabled:!0,setting:c,rootStyles:o,styles:u,style:{playSpeed:600},disableMarginAuto:!0,children:$,productBadgeLiquid:t||""})}
|
|
59
60
|
`,S=()=>{switch(a?.preDisplay){case"1st-images":return`
|
|
60
61
|
{% assign featureMedia = product.media.first %}
|
|
61
62
|
`;case"1st-3d-mode":return system.LiquidFor("media in product.media",system.LiquidIf("media.media_type == 'model'","{% assign featureMedia = media %}{% break %}"));case"1st-video":return system.LiquidFor("media in product.media",system.LiquidIf("media.media_type == 'video' or media.media_type == 'external_video'","{% assign featureMedia = media %}{% break %}"));default:return`
|
|
@@ -88,19 +89,19 @@
|
|
|
88
89
|
>
|
|
89
90
|
<div
|
|
90
91
|
class="gp-relative"
|
|
91
|
-
style="${_function.getStyleOfObject(
|
|
92
|
+
style="${_function.getStyleOfObject(l)}"
|
|
92
93
|
>
|
|
93
94
|
${t}
|
|
94
95
|
<div
|
|
95
96
|
type="gp-feature-image-only"
|
|
96
97
|
product-id="{{product.id}}"
|
|
97
98
|
product-media="{{product.media.size}}"
|
|
98
|
-
class="${d(
|
|
99
|
-
style="${_function.getStyleOfObject(
|
|
99
|
+
class="${d(w)}"
|
|
100
|
+
style="${_function.getStyleOfObject(m)}"
|
|
100
101
|
>
|
|
101
102
|
<div
|
|
102
103
|
class="gp-w-full gp-relative ${system.LiquidIf("featureMedia == null or featureMedia.media_type == 'image'","{{ 'gp-h-0' }}","{{ 'gp-h-full !gp-pb-0' }}")}"
|
|
103
|
-
style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",
|
|
104
|
+
style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",M))} ${system.LiquidIf("featureMedia.media_type == 'video' or featureMedia.media_type == 'external_video'","{{ 'display: flex; align-items: center; justify-content: center' }}")}"
|
|
104
105
|
>
|
|
105
106
|
${p()}
|
|
106
107
|
</div>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{SEPARATOR as e}from"./constants.js";let LIQUID_EXPRESSION_REGEX=/^\s*\{\{[\s\S]*\}\}\s*$/,appendLiquidEscapeFilter=e=>e.replace(/\s*\}\}\s*$/,"
|
|
1
|
+
import{SEPARATOR as e}from"./constants.js";let LIQUID_EXPRESSION_REGEX=/^\s*\{\{[\s\S]*\}\}\s*$/,appendLiquidEscapeFilter=e=>e.replace(/\s*\}\}\s*$/,"| escape | replace: '"', '\"' }}"),escapeSingleQuoteForAttr=e=>{if(null==e)return e;let t=e.toString();return LIQUID_EXPRESSION_REGEX.test(t)?appendLiquidEscapeFilter(t):t.replaceAll("'","'").replaceAll("’","'")},checkIconVisibility=e=>e?.enableIcon===!0,getRenderRegularPriceSettings=e=>({lineThrough:!1,typo:removeColorFromTypo(e?.priceTypo)}),getRenderComparePriceSettings=e=>({lineThrough:!0,typo:removeColorFromTypo(e?.compareAtPriceTypo),opacityPrice:e?.opacityPrice}),getGPProductButtonState=({styles:e,setting:t,successMessage:r,errorMessage:o})=>({styles:{errorTypo:e?.errorTypo,successTypo:e?.successTypo},setting:{errorType:t?.errorType,actionEffect:t?.actionEffect,enableMessage:t?.enableMessage,label:escapeSingleQuoteForAttr(t?.label),errorMessage:escapeSingleQuoteForAttr(o??t?.errorMessage),successMessage:escapeSingleQuoteForAttr(r??t?.successMessage),outOfStockLabel:escapeSingleQuoteForAttr(t?.outOfStockLabel),customURL:{link:escapeSingleQuoteForAttr(t?.customURL?.link),target:t?.customURL?.target}},variantID:"{{variant.id}}",disabled:"{{variant.available}}",totalVariant:"{{total_combinations}}"}),renderSeparator=t=>{let r=t??"horizontal-line";return({dot:e.DOT,"vertical-line":e.VERTICAL_LINE,"horizontal-line":e.HORIZONTAL_LINE})[r]??e.HORIZONTAL_LINE},removeColorFromTypo=e=>(e?.attrs&&e?.attrs.color&&delete e.attrs.color,e);export{checkIconVisibility,getGPProductButtonState,getRenderComparePriceSettings,getRenderRegularPriceSettings,renderSeparator};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{makeStyleResponsive as e,template as a,cls as
|
|
1
|
+
import{makeStyleResponsive as e,template as a,cls as i}from"@gem-sdk/core";import{getAspectRatio as t,getPaddingBottomByShapeSetting as r,getSrcImage as s}from"../../common/common.js";import{checkRenderFeaturedCarousel as d,getVideoHeight as o,getZoomImageClass as u,getZoomLenClass as m}from"../../common/productFeaturedImage.js";import l from"../../../../../video/components/HTML5Embed.liquid.js";import p from"../../../../../image/components/Modal3d.liquid.js";import g from"../../../../../image/components/NextImage.liquid.js";import n from"../../../../../image/components/Video.liquid.js";import{getStyleOfObject as c}from"../../../../helpers/function.js";import{getProductImagesStyles as f}from"../../composables/getProductImagesStyles.js";import{getProductImagesClassName as h}from"../../composables/getProductImagesClassName.js";import{getProductImagesAttr as y}from"../../composables/getProductImagesAttr.js";import{LiquidIf as M,LiquidFor as _,Liquid as w,If as v,createStyle as $}from"@gem-sdk/system";import b from"../../../../../carousel-v3/components/root/Carousel.liquid.js";import I from"../../../../../carousel-v3/components/item/CarouselItem.liquid.js";let FeatureImageWithGallery=({builderPropUID:x,children:q,enableLazyLoadImage:S,...j})=>{let{featuredImageCarouselClasses:z,galleryItemClasses:L,featuredCarouselItemClasses:P}=h({...j,builderProps:{uid:x}}),{featuredImageCarouselStyle:R,featureImageStyle:W,featureImageCarouselOnlyOneImageStyle:T,featureImageOnlyOneImageStyle:C,featureImageCarouselItemStyle:N}=f(j),{featuredImageCarouselSettingAttrs:k}=y(j),E=t(j.ftShape),O=()=>`
|
|
2
2
|
{% case featureMedia.media_type %}
|
|
3
3
|
{% when 'image' %}
|
|
4
4
|
${F()}
|
|
@@ -13,15 +13,15 @@ import{makeStyleResponsive as e,template as a,cls as t}from"@gem-sdk/core";impor
|
|
|
13
13
|
{% else %}
|
|
14
14
|
${G()}
|
|
15
15
|
{% endcase %}
|
|
16
|
-
`,A=()=>p({src:M("featureMedia.sources.first.url contains '.glb'","{{ featureMedia.sources.first.url }}","{{featureMedia.sources.last.url}}"),alt:"{{featureMedia.preview_image.alt}}",poster:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%"},aspectRatio:E}),D=()=>n({src:"{{mediaSourceVideo}}",alt:"{{featureMedia.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"},aspectRatio:E}),V=()=>{let a
|
|
17
|
-
${H(
|
|
18
|
-
${
|
|
16
|
+
`,A=()=>p({src:M("featureMedia.sources.first.url contains '.glb'","{{ featureMedia.sources.first.url }}","{{featureMedia.sources.last.url}}"),alt:"{{featureMedia.preview_image.alt}}",poster:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%"},aspectRatio:E}),D=()=>n({src:"{{mediaSourceVideo}}",alt:"{{featureMedia.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"},aspectRatio:E}),V=()=>{let a=$({...o({ftLayout:j?.ftLayout,ftShape:j?.ftShape}),...e("objf",j?.ftLayout)}),i=$({...o({ftLayout:j?.ftLayout,ftShape:j?.ftShape})});return l({src:"{{mediaSourceVideo}}",title:"{{featureMedia.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",isCheckLoaded:!0,wrapperStyles:i,poster:{altText:"{{featureMedia.alt | escape}}"},style:{width:"100%","max-height":"100%",...a},className:"gp-invisible"})},F=()=>a`
|
|
17
|
+
${H(i("gp-w-full gp-transition-opacity",{"group-hover:gp-opacity-0":"other"==j.hoverEffect},"{{shouldHidden}}"))}
|
|
18
|
+
${v(j?.hoverEffect!=="none",`<div class="${i("zoom-element !gp-max-w-none",u())}">
|
|
19
19
|
${H("image-zoom",!0)}
|
|
20
20
|
</div>`," ")}
|
|
21
|
-
${
|
|
22
|
-
`,H=(e,
|
|
21
|
+
${v(j?.hoverEffect=="zoom"&&j?.zoomType=="glasses",`<div class="${i("zoom-lens-element",m())}" style="opacity: 0; background-image: url('{{ featureMedia.src | img_url: "1024x1024"}}')"></div>`," ")}
|
|
22
|
+
`,H=(e,i)=>a`
|
|
23
23
|
{% assign src = featureMedia.src %}
|
|
24
|
-
${
|
|
24
|
+
${v(i&&"other"==j.hoverEffect,`{% assign media_length = product.media | size %}
|
|
25
25
|
{% assign other_image_index = ${j.otherImage} | plus: 0 %}
|
|
26
26
|
{% if other_image_index >= media_length %}
|
|
27
27
|
{% assign other_image_index = media_length | minus: 1 %}
|
|
@@ -31,7 +31,7 @@ import{makeStyleResponsive as e,template as a,cls as t}from"@gem-sdk/core";impor
|
|
|
31
31
|
`)}
|
|
32
32
|
${g({srcIsLiquidCode:!0,src:M("src != null",s("src"),"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif"),id:M("featureMedia != null","{{featureMedia.id}}"),width:"{{featureMedia.width}}",height:"{{featureMedia.height}}",alt:"{{featureMedia.alt | escape}}",srcset:`${s("src")}`,baseSrc:"{{src | image_url}}",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:j?.ftLayout,aspectRatio:E,qualityType:j?.qualityType,qualityPercent:j?.qualityPercent},priority:j?.preload,className:`gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none ${e??""}`,enableLazyLoadImage:S})}`,G=()=>a`
|
|
33
33
|
${g({srcIsLiquidCode:!0,src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",alt:"No Image",sizes:"(max-width: 768px) 50vw, 100vw",setting:{layout:j?.ftLayout,aspectRatio:E,qualityType:j?.qualityType,qualityPercent:j?.qualityPercent},priority:j?.preload,className:"gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 featured-image-only gp-cursor-pointer !gp-rounded-none",enableLazyLoadImage:S})}`,B=r(j.ftShape),J=a=>`
|
|
34
|
-
${
|
|
34
|
+
${w(`{% assign productImageWidth = 0 %}
|
|
35
35
|
{% case featureMedia.media_type %}
|
|
36
36
|
{% when 'image' %}
|
|
37
37
|
{% assign productImageWidth = featureMedia.width %}
|
|
@@ -46,24 +46,25 @@ import{makeStyleResponsive as e,template as a,cls as t}from"@gem-sdk/core";impor
|
|
|
46
46
|
${O()}
|
|
47
47
|
</div>
|
|
48
48
|
`})}`,K=d(j),Q="gp-featured-image-wrapper",U=M("product.media.size > 0",`{% assign largestRatio = 0 %}
|
|
49
|
-
${
|
|
50
|
-
{% assign height = featureMedia.height | times: 1.0 %}
|
|
51
|
-
|
|
49
|
+
${_("featureMedia in product.media",`
|
|
50
|
+
${M("featureMedia.media_type == 'video' and featureMedia.preview_image",`{% assign height = featureMedia.preview_image.height | times: 1.0 %}
|
|
51
|
+
{% assign width = featureMedia.preview_image.width | times: 1.0 %}`,`{% assign height = featureMedia.height | times: 1.0 %}
|
|
52
|
+
{% assign width = featureMedia.width | times: 1.0 %}`)}
|
|
52
53
|
{% assign ratio = height | divided_by: width %}
|
|
53
54
|
${M("ratio > largestRatio","{% assign largestRatio = ratio %}")}
|
|
54
55
|
`)}
|
|
55
|
-
${
|
|
56
|
+
${_("featureMedia in product.media",`${M("featureMedia.media_type == 'image'",`${_("image in product.images",M("image.src == featureMedia.src","{% assign imageID = image.id %}{% break %}"))}`,"{% assign imageID = '' %}")}
|
|
56
57
|
${J()}`)}
|
|
57
58
|
`,g({src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",id:"noImageError",width:"480",height:"480",alt:"no image",priority:j?.preload,setting:{layout:j?.ftLayout,aspectRatio:E,qualityType:j?.qualityType,qualityPercent:j?.qualityPercent},style:{height:"100%"},className:"gp-w-full featured-image-only !gp-rounded-none",customLazyload:!0,enableLazyLoadImage:S})),X=()=>`
|
|
58
|
-
${
|
|
59
|
+
${b({builderProps:{uid:x},rootId:`ft-${x}-{{section.id}}-{{product.id}}`,conditionAppendJs:"product.media.size > 1",wrapperClass:Q,rootClass:`${z}`,rootAttrs:{type:"gp-feature-image-carousel","product-id":"{{product.id}}","product-media":"{{product.media.size}}"},isHiddenArrowWhenDisabled:!0,setting:k,rootStyles:W,styles:R,style:{playSpeed:600},disableMarginAuto:!0,children:U,productBadgeLiquid:q||""})}
|
|
59
60
|
`,Y=()=>{switch(j?.preDisplay){case"1st-images":return`
|
|
60
61
|
{% assign featureMedia = product.media.first %}
|
|
61
|
-
`;case"1st-3d-mode":return
|
|
62
|
+
`;case"1st-3d-mode":return _("media in product.media",M("media.media_type == 'model'","{% assign featureMedia = media %}{% break %}"));case"1st-video":return _("media in product.media",M("media.media_type == 'video' or media.media_type == 'external_video'","{% assign featureMedia = media %}{% break %}"));default:return`
|
|
62
63
|
{% assign featureMedia = variant.featured_media %}
|
|
63
64
|
{% unless featureMedia %}
|
|
64
65
|
{% assign featureMedia = product.featured_media %}
|
|
65
66
|
{% endunless %}
|
|
66
|
-
`}},Z=()
|
|
67
|
+
`}},Z=()=>w(`
|
|
67
68
|
{% assign featureMedia = variant.featured_media %}
|
|
68
69
|
{% unless featureMedia %}
|
|
69
70
|
{% assign featureMedia = product.featured_media %}
|
|
@@ -107,12 +108,12 @@ import{makeStyleResponsive as e,template as a,cls as t}from"@gem-sdk/core";impor
|
|
|
107
108
|
</div>
|
|
108
109
|
</div>
|
|
109
110
|
</div>
|
|
110
|
-
`);return
|
|
111
|
+
`);return w(`
|
|
111
112
|
{% capture featureImageOnlyOne %}
|
|
112
113
|
${Z()}
|
|
113
114
|
{% endcapture %}
|
|
114
115
|
${M("product.media.size > 1",`
|
|
115
|
-
${
|
|
116
|
-
${
|
|
116
|
+
${v(K,X()," ")}
|
|
117
|
+
${v(!K,"{{ featureImageOnlyOne }}"," ")}
|
|
117
118
|
`,"{{ featureImageOnlyOne }}")}
|
|
118
119
|
`)};export{FeatureImageWithGallery as default};
|