@gem-sdk/components 17.0.0-dev.120 → 17.0.0-dev.121
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-images-v3/components/child/ProductGalleryGrid.js +2 -2
- package/dist/cjs/product/components/product-images-v3/components/gallery-grid/GalleryGrid.liquid.js +9 -9
- package/dist/esm/product/components/product-images-v3/components/child/ProductGalleryGrid.js +2 -2
- package/dist/esm/product/components/product-images-v3/components/gallery-grid/GalleryGrid.liquid.js +12 -12
- package/package.json +1 -1
package/dist/cjs/product/components/product-images-v3/components/child/ProductGalleryGrid.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),o=require("react"),s=require("../../common/common.js"),
|
|
2
|
-
${
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),o=require("react"),s=require("../../common/common.js"),r=require("../../../../../image/components/NextImage.js"),a=require("../lightbox/ButtonOpenLightBox.js"),i=require("./MediaIcon.js"),l=require("./ProductFeatureVideo.js"),c=require("../../common/productFeaturedImage.js"),n=require("../../common/hoverAction.js"),u=require("../../composables/getProductImagesClassName.js"),d=require("../../composables/getProductImagesStyles.js"),m=require("../../hooks/useProductGalleryGrid.js"),g=o.memo(o=>{let{builderPropUID:g,productImages:p,onHandleClick:y,activeIndexFromFeatureImage:h,children:v,isHiddenInteraction:j,...x}=o,{isDisplay:f,shapeByLayout:q,imageActiveIndex:I,enableOpenLightBox:M,isEnableBorderActive:R,filteredProductImages:T}=m.useProductGalleryGrid(o),w=t.useCurrentDevice(),{isEditMode:b}=t.useRenderMode(),E=["one-col","two-col"].includes(t.getResponsiveValueByScreen(x.position,w)||""),{galleryGridWrapperClasses:N,galleryItemClasses:P}=u.getProductImagesClassName(x),{galleryGridStyles:F,galleryGridItemStyles:O}=d.getProductImagesStyles(x);return e.jsx(e.Fragment,{children:f&&e.jsxs("div",{"data-slot":"children","data-id":g,className:N,style:F,"gp-data-hidden":`${j}`,children:[T?.map((o,u)=>{let d=u===I,m=c.isFeatureMedia(o.contentType)?o.previewImage:o.src,p=!b&&E&&!M&&["VIDEO","EXTERNAL_VIDEO"].includes(o?.contentType||"");return e.jsxs("div",{"aria-hidden":!0,className:P(`gp-gallery-image-item gem-slider-item-${g}
|
|
2
|
+
${d&&R?"gem-slider-item-active":""}`),onClick:()=>y(o?.id||"",M),style:O,onMouseMove:e=>n.handleMouseMove(e,{hoverEffect:x.galleryHoverEffect,zoom:x.galleryZoom,zoomType:x.galleryZoomType}),onMouseOut:e=>n.handleMouseOut(e),"data-border":d&&x?.borderActive?"active":"deactive",children:[p?e.jsx(l.default,{type:o?.contentType,url:o?.src??"",thumbnail:o?.previewImage,aspectRatio:s.getAspectRatio(q)}):e.jsxs(e.Fragment,{children:[e.jsx(r.default,{src:m,width:o?.width,height:o?.height,alt:o?.alt,setting:{aspectRatio:s.getAspectRatio(q),layout:x?.layout},style:{width:"100%",height:"100%"}},o?.id),e.jsx(i.default,{contentType:o?.contentType||""})]}),x?.galleryHoverEffect!=="none"&&!c.isFeatureMedia(o?.contentType)&&e.jsx(r.default,{src:m,width:o?.width,height:o?.height,alt:o?.alt,setting:{layout:x.layout,aspectRatio:s.getAspectRatio(q)},className:t.cls("hover-image !gp-max-w-none",c.getZoomImageClass())}),x?.galleryHoverEffect=="zoom"&&x?.galleryZoomType=="glasses"&&["one-col","two-col"].includes(t.getResponsiveValueByScreen(x.position,w)||"")&&!c.isFeatureMedia(o?.contentType)&&e.jsx("div",{className:t.cls(c.getZoomLenClass(),"room-len"),style:{...t.makeStyle({bgi:`url("${o?.src}")`})}}),t.getResponsiveValueByScreen(x?.clickOpenLightBox,w)&&e.jsx(a.default,{})]},o?.id)}),v]})})});exports.default=g;
|
package/dist/cjs/product/components/product-images-v3/components/gallery-grid/GalleryGrid.liquid.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),i=require("@gem-sdk/system"),a=require("../../../../../image/components/Modal3d.liquid.js"),t=require("../../../../../image/components/NextImage.liquid.js"),s=require("../../../../../image/components/Video.liquid.js"),d=require("../../../../../video/components/HTML5Embed.liquid.js"),o=require("../../../../helpers/function.js"),
|
|
2
|
-
${t.default({srcIsLiquidCode:!0,src:`${
|
|
3
|
-
${i.If(f?.galleryHoverEffect!=="none",`<div class="${e.cls("zoom-element !gp-max-w-none gp-w-full gp-h-full",
|
|
4
|
-
${t.default({srcIsLiquidCode:!0,src:`${
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),i=require("@gem-sdk/system"),a=require("../../../../../image/components/Modal3d.liquid.js"),t=require("../../../../../image/components/NextImage.liquid.js"),s=require("../../../../../image/components/Video.liquid.js"),d=require("../../../../../video/components/HTML5Embed.liquid.js"),o=require("../../../../helpers/function.js"),r=require("../../common/common.js"),l=require("../../common/productFeaturedImage.js"),m=require("../../common/productGallery.js"),p=require("../../composables/getProductImagesClassName.js"),g=require("../../composables/getProductImagesStyles.js");exports.default=({builderPropUID:u,wrapperStyle:c,children:n,enableLazyLoadImage:y,...f})=>{let{galleryItemClasses:h,galleryGridWrapperClasses:v}=p.getProductImagesClassName(f),{galleryGridStyles:C,galleryGridItemStyles:L}=g.getProductImagesStyles(f),w=m.getShapeByLayout({shape:f.shape,shapeForBottom:f.shapeForBottom,shapeFor1Col:f.shapeFor1Col,shapeFor2Col:f.shapeFor2Col,shapeForFtOnly:f.shapeForFtOnly,shapeForInsideBottom:f.shapeForInsideBottom,shapeForInside:f.shapeForInside},f.position),q=(i=!1)=>{let a={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(t=>{let s=e.getResponsiveValueByScreen(f?.position,t)||"",d="one-col"===s||"two-col"===s;a[t]=(i?!d:d)?"block":"none"}),e.makeStyleResponsive("d",a)},_=()=>q(),b=()=>q(!0),I=(a,s)=>e.template`
|
|
2
|
+
${t.default({srcIsLiquidCode:!0,src:`${r.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",baseSrc:"{{media.preview_image | image_url}}",setting:a,style:s,className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:y})}
|
|
3
|
+
${i.If(f?.galleryHoverEffect!=="none",`<div class="${e.cls("zoom-element !gp-max-w-none gp-w-full gp-h-full",l.getZoomImageClass())}">
|
|
4
|
+
${t.default({srcIsLiquidCode:!0,src:`${r.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",baseSrc:"{{media.preview_image | image_url}}",alt:"{{media.alt | escape}}",setting:a,style:s,className:"!gp-rounded-none gp-w-full gp-h-full",customLazyload:!1,enableLazyLoadImage:y})}
|
|
5
5
|
</div>`," ")}
|
|
6
|
-
${i.If(f?.galleryHoverEffect=="zoom"&&f?.galleryZoomType=="glasses",`<div class="${e.cls("zoom-lens-element",
|
|
6
|
+
${i.If(f?.galleryHoverEffect=="zoom"&&f?.galleryZoomType=="glasses",`<div class="${e.cls("zoom-lens-element",l.getZoomLenClass())}" style="opacity: 0; background-image: url('{{media.preview_image | product_img_url: '1024x1024'}}')">
|
|
7
7
|
</div>
|
|
8
8
|
`," ")}
|
|
9
|
-
`,$=()=>a.default({src:i.LiquidIf("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:
|
|
9
|
+
`,$=()=>a.default({src:i.LiquidIf("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:r.getAspectRatio(w)}),x=()=>s.default({src:"{{mediaSourceVideo}}",alt:"{{media.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),S=()=>d.default({src:"{{mediaSourceVideo}}",title:"{{media.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{media.preview_image.src | product_img_url: '1024x1024'}}",poster:{altText:"{{media.alt | escape}}"},style:{width:"100%","max-height":"100%"}}),F=()=>e.template`
|
|
10
10
|
${i.LiquidIf("media.media_type == 'video' or media.media_type == 'external_video'",`<div class="gp-absolute gp-pb-1 gp-pr-1 gp-right-0 gp-bottom-0" >
|
|
11
11
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
12
12
|
<rect opacity="0.9" width="24" height="24" rx="3" fill="#212121"/>
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.7441 4.57034C11.9017 4.47655 12.098 4.47655 12.2555 4.57034L18.5889 8.33957C18.7404 8.42971 18.8332 8.59296 18.8332 8.76923V15.2308C18.8332 15.407 18.7404 15.5703 18.5889 15.6604L12.2555 19.4297C12.098 19.5234 11.9017 19.5234 11.7441 19.4297L5.41079 15.6604C5.25932 15.5703 5.1665 15.407 5.1665 15.2308V8.76923C5.1665 8.59296 5.25932 8.42971 5.41079 8.33957L11.7441 4.57034ZM6.1665 9.64865V14.9465L11.4998 18.1206V12.8227L6.1665 9.64865ZM12.4998 12.8227V18.1206L17.8332 14.9465V9.64865L12.4998 12.8227ZM17.3555 8.76923L11.9998 11.9566L6.64417 8.76923L11.9998 5.58185L17.3555 8.76923Z" fill="#F9F9F9"/>
|
|
20
20
|
</svg>
|
|
21
21
|
</div>`)}
|
|
22
|
-
${I({aspectRatio:
|
|
22
|
+
${I({aspectRatio:r.getAspectRatio(w),layout:f?.layout,qualityType:f?.qualityType,qualityPercent:f?.qualityPercent},{width:"100%",height:"100%"})}
|
|
23
23
|
|
|
24
24
|
<div class="gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-opacity gp-duration-100 group-hover:gp-opacity-100"
|
|
25
25
|
style="${o.getStyleOfObject(m.getZoomDisplay(f?.clickOpenLightBox))}" >
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
</div>
|
|
68
68
|
|
|
69
69
|
<div class="${i.LiquidIf("isMedia","gp-flex gp-justify-center gp-items-center")} ${i.LiquidIf("isModel","gp-w-full")}"
|
|
70
|
-
style="${i.LiquidIf("isMedia",o.getStyleOfObject({...e.makeStyleResponsive("aspect",
|
|
70
|
+
style="${i.LiquidIf("isMedia",o.getStyleOfObject({...e.makeStyleResponsive("aspect",r.getAspectRatio(w))}))} ${o.getStyleOfObject({..._()})}"
|
|
71
71
|
>
|
|
72
72
|
{% case media.media_type %}
|
|
73
73
|
{% when 'external_video' %}
|
|
@@ -84,7 +84,7 @@
|
|
|
84
84
|
{% assign isMedia= false %}
|
|
85
85
|
{% assign isModel= false %}
|
|
86
86
|
</div>`,M=()=>e.template`
|
|
87
|
-
${t.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:{aspectRatio:
|
|
87
|
+
${t.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:{aspectRatio:r.getAspectRatio(w),layout:f?.layout,qualityType:f?.qualityType,qualityPercent:f?.qualityPercent},className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:y})}`;return i.Liquid(`
|
|
88
88
|
<div type="grid-gallery"
|
|
89
89
|
class="${v}"
|
|
90
90
|
style="${o.getStyleOfObject(C)}}"
|
package/dist/esm/product/components/product-images-v3/components/child/ProductGalleryGrid.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import{useCurrentDevice as r,
|
|
2
|
-
${
|
|
1
|
+
import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import{useCurrentDevice as r,useRenderMode as i,getResponsiveValueByScreen as a,cls as m,makeStyle as l}from"@gem-sdk/core";import{memo as c}from"react";import{getAspectRatio as s}from"../../common/common.js";import n from"../../../../../image/components/NextImage.js";import d from"../lightbox/ButtonOpenLightBox.js";import p from"./MediaIcon.js";import g from"./ProductFeatureVideo.js";import{isFeatureMedia as h,getZoomImageClass as y,getZoomLenClass as u}from"../../common/productFeaturedImage.js";import{handleMouseOut as f,handleMouseMove as v}from"../../common/hoverAction.js";import{getProductImagesClassName as j}from"../../composables/getProductImagesClassName.js";import{getProductImagesStyles as T}from"../../composables/getProductImagesStyles.js";import{useProductGalleryGrid as w}from"../../hooks/useProductGalleryGrid.js";var I=c(c=>{let{builderPropUID:I,productImages:E,onHandleClick:b,activeIndexFromFeatureImage:x,children:N,isHiddenInteraction:O,...P}=c,{isDisplay:k,shapeByLayout:G,imageActiveIndex:M,enableOpenLightBox:R,isEnableBorderActive:$,filteredProductImages:z}=w(c),A=r(),{isEditMode:B}=i(),H=["one-col","two-col"].includes(a(P.position,A)||""),{galleryGridWrapperClasses:L,galleryItemClasses:V}=j(P),{galleryGridStyles:Z,galleryGridItemStyles:C}=T(P);return e(o,{children:k&&t("div",{"data-slot":"children","data-id":I,className:L,style:Z,"gp-data-hidden":`${O}`,children:[z?.map((r,i)=>{let c=i===M,j=h(r.contentType)?r.previewImage:r.src,T=!B&&H&&!R&&["VIDEO","EXTERNAL_VIDEO"].includes(r?.contentType||"");return t("div",{"aria-hidden":!0,className:V(`gp-gallery-image-item gem-slider-item-${I}
|
|
2
|
+
${c&&$?"gem-slider-item-active":""}`),onClick:()=>b(r?.id||"",R),style:C,onMouseMove:e=>v(e,{hoverEffect:P.galleryHoverEffect,zoom:P.galleryZoom,zoomType:P.galleryZoomType}),onMouseOut:e=>f(e),"data-border":c&&P?.borderActive?"active":"deactive",children:[T?e(g,{type:r?.contentType,url:r?.src??"",thumbnail:r?.previewImage,aspectRatio:s(G)}):t(o,{children:[e(n,{src:j,width:r?.width,height:r?.height,alt:r?.alt,setting:{aspectRatio:s(G),layout:P?.layout},style:{width:"100%",height:"100%"}},r?.id),e(p,{contentType:r?.contentType||""})]}),P?.galleryHoverEffect!=="none"&&!h(r?.contentType)&&e(n,{src:j,width:r?.width,height:r?.height,alt:r?.alt,setting:{layout:P.layout,aspectRatio:s(G)},className:m("hover-image !gp-max-w-none",y())}),P?.galleryHoverEffect=="zoom"&&P?.galleryZoomType=="glasses"&&["one-col","two-col"].includes(a(P.position,A)||"")&&!h(r?.contentType)&&e("div",{className:m(u(),"room-len"),style:{...l({bgi:`url("${r?.src}")`})}}),a(P?.clickOpenLightBox,A)&&e(d,{})]},r?.id)}),N]})})});export{I as default};
|
package/dist/esm/product/components/product-images-v3/components/gallery-grid/GalleryGrid.liquid.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cls as t}from"@gem-sdk/core";import{Liquid as o,LiquidFor as s,LiquidIf as d,If as r}from"@gem-sdk/system";import l from"../../../../../image/components/Modal3d.liquid.js";import m from"../../../../../image/components/NextImage.liquid.js";import p from"../../../../../image/components/Video.liquid.js";import
|
|
1
|
+
import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cls as t}from"@gem-sdk/core";import{Liquid as o,LiquidFor as s,LiquidIf as d,If as r}from"@gem-sdk/system";import l from"../../../../../image/components/Modal3d.liquid.js";import m from"../../../../../image/components/NextImage.liquid.js";import p from"../../../../../image/components/Video.liquid.js";import g from"../../../../../video/components/HTML5Embed.liquid.js";import{getStyleOfObject as n}from"../../../../helpers/function.js";import{getAspectRatio as c,getSrcImage as u}from"../../common/common.js";import{getZoomImageClass as h,getZoomLenClass as y}from"../../common/productFeaturedImage.js";import{getShapeByLayout as C,getZoomDisplay as v}from"../../common/productGallery.js";import{getProductImagesClassName as f}from"../../composables/getProductImagesClassName.js";import{getProductImagesStyles as w}from"../../composables/getProductImagesStyles.js";let _=({builderPropUID:_,wrapperStyle:$,children:b,enableLazyLoadImage:x,...L})=>{let{galleryItemClasses:F,galleryGridWrapperClasses:M}=f(L),{galleryGridStyles:V,galleryGridItemStyles:q}=w(L),I=C({shape:L.shape,shapeForBottom:L.shapeForBottom,shapeFor1Col:L.shapeFor1Col,shapeFor2Col:L.shapeFor2Col,shapeForFtOnly:L.shapeForFtOnly,shapeForInsideBottom:L.shapeForInsideBottom,shapeForInside:L.shapeForInside},L.position),j=(i=!1)=>{let t={desktop:"none",tablet:"none",mobile:"none"};return["desktop","mobile","tablet"].forEach(e=>{let o=a(L?.position,e)||"",s="one-col"===o||"two-col"===o;t[e]=(i?!s:s)?"block":"none"}),e("d",t)},k=()=>j(),S=()=>j(!0),Z=(e,a)=>i`
|
|
2
2
|
${m({srcIsLiquidCode:!0,src:`${u("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",baseSrc:"{{media.preview_image | image_url}}",setting:e,style:a,className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:x})}
|
|
3
3
|
${r(L?.galleryHoverEffect!=="none",`<div class="${t("zoom-element !gp-max-w-none gp-w-full gp-h-full",h())}">
|
|
4
4
|
${m({srcIsLiquidCode:!0,src:`${u("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",baseSrc:"{{media.preview_image | image_url}}",alt:"{{media.alt | escape}}",setting:e,style:a,className:"!gp-rounded-none gp-w-full gp-h-full",customLazyload:!1,enableLazyLoadImage:x})}
|
|
@@ -6,7 +6,7 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
6
6
|
${r(L?.galleryHoverEffect=="zoom"&&L?.galleryZoomType=="glasses",`<div class="${t("zoom-lens-element",y())}" style="opacity: 0; background-image: url('{{media.preview_image | product_img_url: '1024x1024'}}')">
|
|
7
7
|
</div>
|
|
8
8
|
`," ")}
|
|
9
|
-
`,z=()=>l({src:d("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:c(I)}),B=()=>p({src:"{{mediaSourceVideo}}",alt:"{{media.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),H=()=>
|
|
9
|
+
`,z=()=>l({src:d("media.sources.first.url contains '.glb'","{{ media.sources.first.url }}","{{media.sources.last.url}}"),alt:"{{media.preview_image.alt}}",poster:"{{media.preview_image.src | product_img_url: '1024x1024'}}",cameraControls:!0,arStatus:"not-presenting",style:{width:"100%",height:"100%"},aspectRatio:c(I)}),B=()=>p({src:"{{mediaSourceVideo}}",alt:"{{media.alt | escape}}",autoplay:!1,allowfullscreen:!0,controls:!0,style:{width:"100%",height:"100%"}}),H=()=>g({src:"{{mediaSourceVideo}}",title:"{{media.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{media.preview_image.src | product_img_url: '1024x1024'}}",poster:{altText:"{{media.alt | escape}}"},style:{width:"100%","max-height":"100%"}}),P=()=>i`
|
|
10
10
|
${d("media.media_type == 'video' or media.media_type == 'external_video'",`<div class="gp-absolute gp-pb-1 gp-pr-1 gp-right-0 gp-bottom-0" >
|
|
11
11
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
12
12
|
<rect opacity="0.9" width="24" height="24" rx="3" fill="#212121"/>
|
|
@@ -22,7 +22,7 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
22
22
|
${Z({aspectRatio:c(I),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},{width:"100%",height:"100%"})}
|
|
23
23
|
|
|
24
24
|
<div class="gp-absolute gp-inset-0 gp-flex gp-cursor-pointer gp-items-center gp-justify-center gp-bg-black/50 gp-opacity-0 gp-transition-opacity gp-duration-100 group-hover:gp-opacity-100"
|
|
25
|
-
style="${
|
|
25
|
+
style="${n(v(L?.clickOpenLightBox))}" >
|
|
26
26
|
<svg
|
|
27
27
|
height="100%"
|
|
28
28
|
width="100%"
|
|
@@ -39,7 +39,7 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
39
39
|
/>
|
|
40
40
|
</svg>
|
|
41
41
|
</div>
|
|
42
|
-
`,
|
|
42
|
+
`,T=i=>`
|
|
43
43
|
${d("media.media_type == 'video'","{% assign mediaSourceUrl = media.sources.last.url %}")}
|
|
44
44
|
${d("media.media_type == 'external_video'","{% assign mediaSourceUrl = media | external_video_url %}{% assign mediaSource = media | json %}")}
|
|
45
45
|
${d("media.media_type == 'image'","{% assign mediaSourceUrl = media.src %}")}
|
|
@@ -54,7 +54,7 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
54
54
|
grid-index="{{forloop.index}}"
|
|
55
55
|
data-outline="none"
|
|
56
56
|
class="${F(`gem-slider-item-${_}-{{product.id}} gp-gallery-image-item ${i??""} data-[outline=deactive]:after:!gp-border-transparent`)}"
|
|
57
|
-
style="${
|
|
57
|
+
style="${n(q)}"
|
|
58
58
|
>
|
|
59
59
|
${d("media.media_type == 'external_video' or media.media_type == 'video' or media.media_type == 'model'","{% assign isMedia = true %}")}
|
|
60
60
|
|
|
@@ -62,12 +62,12 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
62
62
|
|
|
63
63
|
${d("media.media_type == 'model'","{% assign isModel = true %}")}
|
|
64
64
|
|
|
65
|
-
<div class="gp-w-full" style="${d("media == null or media.media_type == 'image'","display: block !important;")} ${d("isMedia",
|
|
66
|
-
${d("media != null",P(),
|
|
65
|
+
<div class="gp-w-full" style="${d("media == null or media.media_type == 'image'","display: block !important;")} ${d("isMedia",n({...S()}))}">
|
|
66
|
+
${d("media != null",P(),N())}
|
|
67
67
|
</div>
|
|
68
68
|
|
|
69
69
|
<div class="${d("isMedia","gp-flex gp-justify-center gp-items-center")} ${d("isModel","gp-w-full")}"
|
|
70
|
-
style="${d("isMedia",
|
|
70
|
+
style="${d("isMedia",n({...e("aspect",c(I))}))} ${n({...k()})}"
|
|
71
71
|
>
|
|
72
72
|
{% case media.media_type %}
|
|
73
73
|
{% when 'external_video' %}
|
|
@@ -83,14 +83,14 @@ import{makeStyleResponsive as e,template as i,getResponsiveValueByScreen as a,cl
|
|
|
83
83
|
{% assign isVideo= false %}
|
|
84
84
|
{% assign isMedia= false %}
|
|
85
85
|
{% assign isModel= false %}
|
|
86
|
-
</div>`,
|
|
86
|
+
</div>`,N=()=>i`
|
|
87
87
|
${m({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:{aspectRatio:c(I),layout:L?.layout,qualityType:L?.qualityType,qualityPercent:L?.qualityPercent},className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:x})}`;return o(`
|
|
88
88
|
<div type="grid-gallery"
|
|
89
89
|
class="${M}"
|
|
90
|
-
style="${
|
|
90
|
+
style="${n(V)}}"
|
|
91
91
|
>
|
|
92
92
|
${s("media in product.media",`${d("media.media_type == 'image'",s("image in product.images",d("image.src == media.src","{% assign imageID = image.id %}{% break %}")),"{% assign imageID = '' %}")}
|
|
93
|
-
${d("media.id == product.featured_media.id ",
|
|
93
|
+
${d("media.id == product.featured_media.id ",T(L?.borderActive?.border!=="none"?"active":""),T())}`)}
|
|
94
94
|
${d("product.media.size > 0",b)}
|
|
95
|
-
${d("product.media.size < 1",
|
|
95
|
+
${d("product.media.size < 1",T())}
|
|
96
96
|
</div>`)};export{_ as default};
|