@gem-sdk/components 4.0.0-staging.1194 → 4.0.0-staging.1196

package/dist/cjs/product/components/product-images-v2/components/feature-gallery/FeatureImageWithGallery.liquid.js

@@ -1,4 +1,4 @@
-"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/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel/components/item/CarouselItem.liquid.js");const FeatureImageWithGallery=({builderPropUID:e,children:t,enableLazyLoadImage:i,...a})=>{let{featuredImageCarouselClasses:s,galleryItemClasses:r,featuredCarouselItemClasses:d}=getProductImagesClassName.getProductImagesClassName(a),{featuredImageCarouselStyle:u,featureImageStyle:o,featureImageCarouselOnlyOneImageStyle:m,featureImageOnlyOneImageStyle:l,featureImageCarouselItemStyle:g}=getProductImagesStyles.getProductImagesStyles(a),{featuredImageCarouselSettingAttrs:c}=getProductImagesAttr.getProductImagesAttr(a),n=common.getAspectRatio(a.ftShape),p=()=>`
+"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/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel/components/item/CarouselItem.liquid.js");const FeatureImageWithGallery=({builderPropUID:e,children:t,enableLazyLoadImage:i,...a})=>{let{featuredImageCarouselClasses:s,galleryItemClasses:r,featuredCarouselItemClasses:d}=getProductImagesClassName.getProductImagesClassName(a),{featuredImageCarouselStyle:o,featureImageStyle:u,featureImageCarouselOnlyOneImageStyle:m,featureImageOnlyOneImageStyle:l,featureImageCarouselItemStyle:g}=getProductImagesStyles.getProductImagesStyles(a),{featuredImageCarouselSettingAttrs:c}=getProductImagesAttr.getProductImagesAttr(a),n=common.getAspectRatio(a.ftShape),p=()=>`
     {% case featureMedia.media_type %}
       {% when 'image' %}
         ${I()}
@@ -13,7 +13,7 @@
       {% else %}
         ${_()}
     {% endcase %}
-    `,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=()=>HTML5Embed_liquid.default({src:"{{mediaSourceVideo}}",title:"{{featureMedia.alt | escape}}",autoplay:!1,controls:!0,thumbnail:"{{featureMedia.preview_image.src | product_img_url: '1024x1024'}}",isCheckLoaded:!0,style:{width:"100%","max-height":"100%"},className:"gp-invisible"}),I=()=>core.template`
+    `,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(a?.ftLayout),...core.makeStyleResponsive("objf",a?.ftLayout)}),t=system.createStyle({...productFeaturedImage.getVideoHeight(a?.ftLayout)});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,style:{width:"100%","max-height":"100%",...e},className:"gp-invisible"})},I=()=>core.template`
       ${q(core.cls("gp-w-full gp-transition-opacity",{"group-hover:gp-opacity-0":"other"==a.hoverEffect},"{{shouldHidden}}"))}
       ${system.If(a?.hoverEffect!=="none",`<div class="${core.cls("zoom-element !gp-max-w-none",productFeaturedImage.getZoomImageClass())}">
             ${q("image-zoom",!0)}
@@ -38,14 +38,14 @@
       {% else %}
         {% assign productImageWidth = featureMedia.preview_image.width %}
     {% endcase %}`)}
-    ${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:`${e}-{{section.id}}-{{product.id}}`,style:g,customStyle:{width:"{{productImageWidth}}px"},children:`
+    ${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:`
       <div
         class="gp-w-full gp-relative ${system.LiquidIf("featureMedia == null or featureMedia.media_type == 'image'","{{ 'gp-h-0' }}","{{ 'gp-h-full !gp-pb-0' }}")}"
         style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",b))} ${system.LiquidIf("featureMedia.media_type == 'video' or featureMedia.media_type == 'external_video'","{{ 'display: flex; align-items: center; justify-content: center' }}")}"
       >
         ${p()}
       </div>
-      `})}`,$=productFeaturedImage.checkRenderFeaturedCarousel(a),v="gp-featured-image-wrapper",w=system.LiquidIf("product.media.size > 0",`${t||""} {% assign largestRatio = 0 %}
+      `})}`,v=productFeaturedImage.checkRenderFeaturedCarousel(a),$="gp-featured-image-wrapper",w=system.LiquidIf("product.media.size > 0",`${t||""} {% assign largestRatio = 0 %}
       ${system.LiquidFor("featureMedia in product.media",`
           {% assign height = featureMedia.height | times: 1.0 %}
           {% assign width = featureMedia.width | times: 1.0 %}
@@ -55,20 +55,20 @@
       ${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 = '' %}")}
         ${M()}`)}
     `,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=()=>`
-      ${Carousel_liquid.default({builderProps:{uid:e},rootId:`ft-${e}-{{section.id}}-{{product.id}}`,conditionAppendJs:"product.media.size > 1",wrapperClass:v,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:w})}
-    `,x=()=>{switch(a?.preDisplay){case"1st-images":return`
+      ${Carousel_liquid.default({builderProps:{uid:e},rootId:`ft-${e}-{{section.id}}-{{product.id}}`,conditionAppendJs:"product.media.size > 1",wrapperClass:$,rootClass:`${s}`,rootAttrs:{type:"gp-feature-image-carousel","product-id":"{{product.id}}","product-media":"{{product.media.size}}"},isHiddenArrowWhenDisabled:!0,setting:c,rootStyles:u,styles:o,style:{playSpeed:600},disableMarginAuto:!0,children:w})}
+    `,S=()=>{switch(a?.preDisplay){case"1st-images":return`
           {% assign featureMedia = product.media.first %}
         `;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`
           {% assign featureMedia = variant.featured_media %}
           {% unless featureMedia %}
           {% assign featureMedia = product.featured_media %}
           {% endunless %}
-        `}},S=()=>system.Liquid(`
+        `}},x=()=>system.Liquid(`
         {% assign featureMedia = variant.featured_media %}
         {% unless featureMedia %}
         {% assign featureMedia = product.featured_media %}
         {% endunless %}
-        ${system.LiquidIf("product.media.size > 1",x())}
+        ${system.LiquidIf("product.media.size > 1",S())}
         {% assign largestRatio = 0 %}
         {% assign height = featureMedia.height | times: 1.0 %}
         {% assign width = featureMedia.width | times: 1.0 %}
@@ -84,7 +84,7 @@
         ${system.LiquidIf("featureMedia == null","{% assign productImageWidth = 1600 %}")}
         <div
           class='gp-feature-image-carousel gp-feature-image-only'
-          style="${_function.getStyleOfObject(o)}"
+          style="${_function.getStyleOfObject(u)}"
         >
           <div
             class="gp-relative"
@@ -95,7 +95,7 @@
               type="gp-feature-image-only"
               product-id="{{product.id}}"
               product-media="{{product.media.size}}"
-              class="${d(v)}"
+              class="${d($)}"
               style="${_function.getStyleOfObject(m)}"
             >
               <div
@@ -109,10 +109,10 @@
         </div>
       `);return system.Liquid(`
     {% capture featureImageOnlyOne %}
-      ${S()}
+      ${x()}
     {% endcapture %}
     ${system.LiquidIf("product.media.size > 1",`
-        ${system.If($,L()," ")}
-        ${system.If(!$,"{{ featureImageOnlyOne }}"," ")}
+        ${system.If(v,L()," ")}
+        ${system.If(!v,"{{ featureImageOnlyOne }}"," ")}
       `,"{{ featureImageOnlyOne }}")}
   `)};exports.default=FeatureImageWithGallery;

package/dist/cjs/product/components/product-images-v2/components/gallery-carousel/GalleryCarousel.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),common=require("../../common/common.js"),productGallery=require("../../common/productGallery.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),MediaIcon=require("../child/MediaIcon.js"),ButtonOpenLightBox=require("../lightbox/ButtonOpenLightBox.js"),NextImage=require("../../../../../image/components/NextImage.js"),Carousel=require("../../../../../carousel/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel/components/item/CarouselItem.js"),useGalleryCarousel=require("../../hooks/useGalleryCarousel.js"),system=require("@gem-sdk/system");const ProductGalleryCarousel=e=>{let{builderPropUID:t,productImages:s,activeIndexFormFeatureImage:r,onClickFeatureArrow:a,builderPropsClass:o,arrow:u,priorityFeatureImage:i,...l}=e,m=core.useCurrentDevice(),{galleryItemClasses:c}=getProductImagesClassName.getProductImagesClassName(l),{galleryCarouselSettingAttrs:d}=getProductImagesAttr.getProductImagesAttr(l),{galleryCarouselStyle:n,galleryCarouselItemStyle:g}=getProductImagesStyles.getProductImagesStyles(l),{moveToIdx:p,isDisplay:y,shapeByLayout:I,isEnableBorderActive:j,isShowButtonLightbox:x,filteredProductImages:C,handleClickCarouselItem:h,safeMoveToIdx:q,setSliderReady:P}=useGalleryCarousel.useGalleryCarousel(e);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:y&&jsxRuntime.jsx(Carousel.default,{parentClass:o,rootClass:o,setting:d,styles:n,slidesClass:productGallery.getEditorMinHeightClass(m,l.position,l.navigationPosition),builderProps:{uid:`${t}-carousel`},moveToIdx:q,isHiddenArrowWhenDisabled:!0,disableMarginAuto:!0,onLoaded:e=>{e&&P(!0)},children:C?.map((e,s)=>{let r=s===p,a=productFeaturedImage.isFeatureMedia(e.contentType)?e.previewImage:e.src;return jsxRuntime.jsxs(CarouselItem.default,{contentType:"productImage",className:c(`gp-gallery-image-item gem-slider-item-${t} ${r&&j?"gem-slider-item-active":""}`),onClickItem:()=>h(e?.id),style:g,"data-id":e?.id,"data-border":r&&l?.borderActive?"active":"deactive",children:[jsxRuntime.jsx(NextImage.default,{draggable:"false",src:a,width:e?.width,height:e?.height,alt:e?.alt,setting:{aspectRatio:common.getAspectRatio(I),layout:l?.layout,qualityPercent:l?.qualityPercent,qualityType:l?.qualityType},style:{width:"100%",height:"100%",cursor:"pointer"},className:"product-list-image"}),jsxRuntime.jsx(MediaIcon.default,{contentType:e?.contentType||""}),system.If(x,jsxRuntime.jsx(ButtonOpenLightBox.default,{}))]},e?.id)})})})};exports.default=ProductGalleryCarousel;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),common=require("../../common/common.js"),productGallery=require("../../common/productGallery.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),MediaIcon=require("../child/MediaIcon.js"),ButtonOpenLightBox=require("../lightbox/ButtonOpenLightBox.js"),NextImage=require("../../../../../image/components/NextImage.js"),Carousel=require("../../../../../carousel/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel/components/item/CarouselItem.js"),useGalleryCarousel=require("../../hooks/useGalleryCarousel.js"),system=require("@gem-sdk/system");const ProductGalleryCarousel=e=>{let{builderPropUID:t,productImages:s,onSwiperReady:r,activeIndexFormFeatureImage:a,onClickFeatureArrow:o,builderPropsClass:u,arrow:l,priorityFeatureImage:i,...m}=e,c=core.useCurrentDevice(),{galleryItemClasses:n}=getProductImagesClassName.getProductImagesClassName(m),{galleryCarouselSettingAttrs:d}=getProductImagesAttr.getProductImagesAttr(m),{galleryCarouselStyle:g,galleryCarouselItemStyle:p}=getProductImagesStyles.getProductImagesStyles(m),{isDisplay:y,shapeByLayout:I,isShowButtonLightbox:j,filteredProductImages:x,handleClickCarouselItem:C,safeMoveToIdx:h,setSliderReady:q}=useGalleryCarousel.useGalleryCarousel(e);return jsxRuntime.jsx(jsxRuntime.Fragment,{children:y&&jsxRuntime.jsx(Carousel.default,{parentClass:u,rootClass:u,setting:d,styles:g,slidesClass:productGallery.getEditorMinHeightClass(c,m.position,m.navigationPosition),builderProps:{uid:`${t}-carousel`},moveToIdx:h,isHiddenArrowWhenDisabled:!0,disableMarginAuto:!0,isEnableCheckHasScrollableContent:!0,onLoaded:e=>{e&&q(!0)},onSwiperReady:r,children:x?.map(e=>{let s=productFeaturedImage.isFeatureMedia(e.contentType)?e.previewImage:e.src;return jsxRuntime.jsxs(CarouselItem.default,{contentType:"productImage",className:n(`gp-gallery-image-item gem-slider-item-${t}`),onClickItem:()=>C(e?.id),style:p,"data-id":e?.id,children:[jsxRuntime.jsx(NextImage.default,{draggable:"false",src:s,width:e?.width,height:e?.height,alt:e?.alt,setting:{aspectRatio:common.getAspectRatio(I),layout:m?.layout,qualityPercent:m?.qualityPercent,qualityType:m?.qualityType},style:{width:"100%",height:"100%",cursor:"pointer"},className:"product-list-image"}),jsxRuntime.jsx(MediaIcon.default,{contentType:e?.contentType||""}),system.If(j,jsxRuntime.jsx(ButtonOpenLightBox.default,{}))]},e?.id)})})})};exports.default=ProductGalleryCarousel;

package/dist/cjs/product/components/product-images-v2/components/gallery-carousel/GalleryCarousel.liquid.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),common=require("../../common/common.js"),productGallery=require("../../common/productGallery.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/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel/components/item/CarouselItem.liquid.js");const ProductGalleryCarousel=({builderPropUID:e,children:t,enableLazyLoadImage:i,...o})=>{let{featuredImageGalleryClasses:s,galleryItemClasses:r}=getProductImagesClassName.getProductImagesClassName(o),{galleryCarouselSettingAttrs:a}=getProductImagesAttr.getProductImagesAttr(o),{galleryCarouselStyle:l,galleryCarouselItemStyle:d}=getProductImagesStyles.getProductImagesStyles(o),p=()=>{let e=(e,t,i)=>{let o=core.getResponsiveValueByScreen(t,i),s=core.getResponsiveValueByScreen(e,i),r="slider"===s&&("bottom-center"===o||"inside-bottom"===o),a=["left","right","inside-left","inside-right"].includes(o??"");return a||r},t=productGallery.checkDisplayGalleryByWidth({shapeByLayout:m}),i={desktop:t.desktop&&e(o.type,o.position,"desktop"),tablet:t.tablet&&e(o.type,o.position,"tablet"),mobile:t.mobile&&e(o.type,o.position,"mobile")};return common.getDisplayStyle(e=>!i[e],"flex")},m=productGallery.getShapeByLayout({shape:o.shape,shapeForBottom:o.shapeForBottom,shapeFor1Col:o.shapeFor1Col,shapeFor2Col:o.shapeFor2Col,shapeForFtOnly:o.shapeForFtOnly,shapeForInsideBottom:o.shapeForInsideBottom,shapeForInside:o.shapeForInside},o.position),g=(e,t)=>core.template`${NextImage_liquid.default({srcIsLiquidCode:!0,src:`${common.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:e,baseSrc:"{{media.preview_image | image_url}}",customLazyload:!0,style:t,className:"!gp-rounded-none gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 gp-cursor-pointer",enableLazyLoadImage:i})}`,u=common.getPaddingBottomByShapeSetting(m),c=t=>`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),common=require("../../common/common.js"),productGallery=require("../../common/productGallery.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/components/root/Carousel.liquid.js"),CarouselItem_liquid=require("../../../../../carousel/components/item/CarouselItem.liquid.js");const ProductGalleryCarousel=({builderPropUID:e,children:t,enableLazyLoadImage:i,...o})=>{let{featuredImageGalleryClasses:s,galleryItemClasses:r}=getProductImagesClassName.getProductImagesClassName(o),{galleryCarouselSettingAttrs:a}=getProductImagesAttr.getProductImagesAttr(o),{galleryCarouselStyle:l,galleryCarouselItemStyle:d}=getProductImagesStyles.getProductImagesStyles(o),p=()=>{let e=(e,t,i)=>{let o=core.getResponsiveValueByScreen(t,i),s=core.getResponsiveValueByScreen(e,i),r="slider"===s&&("bottom-center"===o||"inside-bottom"===o),a=["left","right","inside-left","inside-right"].includes(o??"");return a||r},t=productGallery.checkDisplayGalleryByWidth({shapeByLayout:g}),i={desktop:t.desktop&&e(o.type,o.position,"desktop"),tablet:t.tablet&&e(o.type,o.position,"tablet"),mobile:t.mobile&&e(o.type,o.position,"mobile")};return common.getDisplayStyle(e=>!i[e],"flex")},g=productGallery.getShapeByLayout({shape:o.shape,shapeForBottom:o.shapeForBottom,shapeFor1Col:o.shapeFor1Col,shapeFor2Col:o.shapeFor2Col,shapeForFtOnly:o.shapeForFtOnly,shapeForInsideBottom:o.shapeForInsideBottom,shapeForInside:o.shapeForInside},o.position),m=(e,t)=>core.template`${NextImage_liquid.default({srcIsLiquidCode:!0,src:`${common.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",setting:e,baseSrc:"{{media.preview_image | image_url}}",style:t,className:"!gp-rounded-none gp-w-full gp-h-full gp-absolute gp-top-0 gp-left-0 gp-cursor-pointer",enableLazyLoadImage:i})}`,u=common.getPaddingBottomByShapeSetting(g),c=t=>`
     ${system.LiquidIf("media.media_type == 'video'","{% assign mediaSourceUrl = media.sources.last.url %}")}
     ${system.LiquidIf("media.media_type == 'external_video'","{% assign mediaSourceUrl = media | external_video_url %}")}
     ${system.LiquidIf("media.media_type == 'image'","{% assign mediaSourceUrl = media.src %}")}
     ${CarouselItem_liquid.default({id:"{{imageID}}",contentType:"productImage",className:`${r(`gp-gallery-image-item ${t}`)}`,parentId:`${e}-{{product.id}}`,builderAttrs:{"data-outline":t?"active":"deactive"},style:d,children:`
-      <div class="gp-w-full gp-relative"
+      <div class="gp-w-full gp-relative gp-h-full"
         style="${_function.getStyleOfObject(core.makeStyleResponsive("pb",u))};"
       >
-      ${g({aspectRatio:common.getAspectRatio(m),layout:o?.layout,qualityPercent:o?.qualityPercent,qualityType:o?.qualityType},{width:"100%",height:"100%",cursor:"pointer"})}
+      ${m({aspectRatio:common.getAspectRatio(g),layout:o?.layout,qualityPercent:o?.qualityPercent,qualityType:o?.qualityType},{width:"100%",height:"100%",cursor:"pointer"})}
 
     ${system.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" >
       <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">

package/dist/cjs/product/components/product-images-v2/components/gallery-grid/GalleryGrid.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),ProductGalleryGrid=require("../child/ProductGalleryGrid.js");const GalleryGrid=e=>{let{setting:r,styles:t,gallery:i,builderProps:l,noDataChildren:d,onHandleClickImage:u,children:n}=e,a={...r,...t};return i?.[0]?.id==="noImageError"?jsxRuntime.jsx(jsxRuntime.Fragment,{children:d}):jsxRuntime.jsx(ProductGalleryGrid.default,{productImages:i,enableHoverAction:!0,...a,builderPropUID:l?.uid,onHandleClick:(e,r)=>u(e||"",r),children:n})};exports.default=GalleryGrid;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),ProductGalleryGrid=require("../child/ProductGalleryGrid.js");const GalleryGrid=e=>{let{setting:r,styles:t,gallery:i,builderProps:d,noDataChildren:l,onHandleClickImage:o,children:u}=e,n={...r,...t,borderActive:{...r?.borderActive,border:"none"}};return i?.[0]?.id==="noImageError"?jsxRuntime.jsx(jsxRuntime.Fragment,{children:l}):jsxRuntime.jsx(ProductGalleryGrid.default,{productImages:i,enableHoverAction:!0,...n,builderPropUID:d?.uid,onHandleClick:(e,r)=>o(e||"",r),children:u})};exports.default=GalleryGrid;

package/dist/cjs/product/components/product-images-v2/components/gallery-grid/GalleryGrid.liquid.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),Modal3d_liquid=require("../../../../../image/components/Modal3d.liquid.js"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),Video_liquid=require("../../../../../image/components/Video.liquid.js"),HTML5Embed_liquid=require("../../../../../video/components/HTML5Embed.liquid.js"),_function=require("../../../../helpers/function.js"),common=require("../../common/common.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),productGallery=require("../../common/productGallery.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js");const ProductGalleryGrid=({builderPropUID:e,wrapperStyle:i,children:t,enableLazyLoadImage:a,...s})=>{let{galleryItemClasses:o,galleryGridWrapperClasses:d}=getProductImagesClassName.getProductImagesClassName(s),{galleryGridStyles:r,galleryGridItemStyles:l}=getProductImagesStyles.getProductImagesStyles(s),m=productGallery.getShapeByLayout({shape:s.shape,shapeForBottom:s.shapeForBottom,shapeFor1Col:s.shapeFor1Col,shapeFor2Col:s.shapeFor2Col,shapeForFtOnly:s.shapeForFtOnly,shapeForInsideBottom:s.shapeForInsideBottom,shapeForInside:s.shapeForInside},s.position),c=(e=!1)=>{let i=["desktop","mobile","tablet"],t={desktop:"none",tablet:"none",mobile:"none"};return i.forEach(i=>{let a=core.getResponsiveValueByScreen(s?.position,i)||"",o="one-col"===a||"two-col"===a,d=e?!o:o;t[i]=d?"block":"none"}),core.makeStyleResponsive("d",t)},u=()=>c(),g=()=>c(!0),p=(e,i)=>core.template`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),Modal3d_liquid=require("../../../../../image/components/Modal3d.liquid.js"),NextImage_liquid=require("../../../../../image/components/NextImage.liquid.js"),Video_liquid=require("../../../../../image/components/Video.liquid.js"),HTML5Embed_liquid=require("../../../../../video/components/HTML5Embed.liquid.js"),_function=require("../../../../helpers/function.js"),common=require("../../common/common.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),productGallery=require("../../common/productGallery.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js");const ProductGalleryGrid=({builderPropUID:e,wrapperStyle:i,children:t,enableLazyLoadImage:a,...s})=>{let{galleryItemClasses:o,galleryGridWrapperClasses:d}=getProductImagesClassName.getProductImagesClassName(s),{galleryGridStyles:r,galleryGridItemStyles:l}=getProductImagesStyles.getProductImagesStyles(s),m=productGallery.getShapeByLayout({shape:s.shape,shapeForBottom:s.shapeForBottom,shapeFor1Col:s.shapeFor1Col,shapeFor2Col:s.shapeFor2Col,shapeForFtOnly:s.shapeForFtOnly,shapeForInsideBottom:s.shapeForInsideBottom,shapeForInside:s.shapeForInside},s.position),u=(e=!1)=>{let i=["desktop","mobile","tablet"],t={desktop:"none",tablet:"none",mobile:"none"};return i.forEach(i=>{let a=core.getResponsiveValueByScreen(s?.position,i)||"",o="one-col"===a||"two-col"===a,d=e?!o:o;t[i]=d?"block":"none"}),core.makeStyleResponsive("d",t)},c=()=>u(),g=()=>u(!0),p=(e,i)=>core.template`
       ${NextImage_liquid.default({srcIsLiquidCode:!0,src:`${common.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",alt:"{{media.alt | escape}}",baseSrc:"{{media.preview_image | image_url}}",setting:e,style:i,className:"!gp-rounded-none",customLazyload:!1,enableLazyLoadImage:a})}
       ${system.If(s?.galleryHoverEffect!=="none",`<div class="${core.cls("zoom-element !gp-max-w-none gp-w-full gp-h-full",productFeaturedImage.getZoomImageClass())}">
           ${NextImage_liquid.default({srcIsLiquidCode:!0,src:`${common.getSrcImage("media.preview_image")}`,width:"{{media.width}}",height:"{{media.height}}",baseSrc:"{{media.preview_image | image_url}}",alt:"{{media.alt | escape}}",setting:e,style:i,className:"!gp-rounded-none gp-w-full gp-h-full",customLazyload:!1,enableLazyLoadImage:a})}
@@ -52,8 +52,8 @@
       media-last-source-url="{{mediaSourceUrl}}"
       external-id="{{media.external_id}}"
       grid-index="{{forloop.index}}"
-      data-outline="${i?"active":"deactive"}"
-      class="${o(`gem-slider-item-${e}-{{product.id}} gp-gallery-image-item ${i}`)}"
+      data-outline="none"
+      class="${o(`gem-slider-item-${e}-{{product.id}} gp-gallery-image-item ${i} data-[outline=deactive]:after:!gp-border-transparent`)}"
       style="${_function.getStyleOfObject(l)}"
       >
       ${system.LiquidIf("media.media_type == 'external_video' or media.media_type == 'video' or media.media_type == 'model'","{% assign isMedia = true %}")}
@@ -65,7 +65,7 @@
       </div>
 
       <div class="${system.LiquidIf("isMedia","gp-flex gp-justify-center gp-items-center")}"
-      style="${system.LiquidIf("isMedia",_function.getStyleOfObject({...core.makeStyleResponsive("aspect",common.getAspectRatio(m))}))} ${_function.getStyleOfObject({...u()})}"
+      style="${system.LiquidIf("isMedia",_function.getStyleOfObject({...core.makeStyleResponsive("aspect",common.getAspectRatio(m))}))} ${_function.getStyleOfObject({...c()})}"
       >
         {% case media.media_type %}
           {% when 'external_video' %}

package/dist/cjs/product/components/product-images-v2/components/lightbox/ProductImagesLightBox.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),Carousel=require("../../../../../carousel/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel/components/item/CarouselItem.js"),NextImage=require("../../../../../image/components/NextImage.js");require("../../../../../modal/components/confirm.js");var Modal=require("../../../../../modal/components/Modal.js"),React=require("react"),productFeaturedImage=require("../../common/productFeaturedImage.js"),ProductFeatureVideo=require("../child/ProductFeatureVideo.js"),MediaIcon=require("../child/MediaIcon.js");const ProductImagesLightBox=({builderPropUID:e,productImages:t,open:o,imageRatio:s,onHandleClose:i})=>{let r=core.useFeaturedImageGlobal(),l=React.useMemo(()=>{let e=t?.findIndex(e=>e.id===r?.id);return e&&e>0?e:0},[t,r]),d={desktop:t&&t.length>1,mobile:t&&t?.length>1,tablet:t&&t?.length>1},a={desktop:!1,mobile:!1,tablet:!1},n=core.useEditorMode(),u=e=>"edit"!==n&&["VIDEO","EXTERNAL_VIDEO"].includes(e?.contentType||"");return jsxRuntime.jsx(Modal.default,{setting:{open:o},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>{i(),console.log("onHandleClose")},disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2 gp-pb-10",children:jsxRuntime.jsx(Carousel.default,{setting:{loop:a,slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:l,dot:{desktop:!0,mobile:!0,tablet:!0},dotStyle:{desktop:"outside",mobile:"outside",tablet:"outside"},dotColor:{desktop:"#E2E2E2",mobile:"#E2E2E2",tablet:"#E2E2E2"},dotActiveColor:{desktop:"#121212",mobile:"#121212",tablet:"#121212"},dotSize:{desktop:12},dotGapToCarousel:{desktop:12},navigationEnable:d,navigationStyle:{desktop:"outside"},arrowIconSize:{desktop:24}},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}}},moveToIdx:l,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,builderProps:{uid:e},fullHeight:!0,children:t?.map(t=>jsxRuntime.jsx(CarouselItem.default,{className:`gem-slider-item gem-slider-item-${e} gp-flex gp-items-center gp-justify-center gp-px-4`,children:u(t)?jsxRuntime.jsx(ProductFeatureVideo.default,{type:t?.contentType,url:t.src??"",aspectRatio:s}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(NextImage.default,{src:productFeaturedImage.isFeatureMedia(t?.contentType)?t?.previewImage:t?.src,width:t?.width,height:t?.height,alt:t?.alt,"content-type":t?.contentType,setting:{aspectRatio:s},className:core.cls("gp-h-full gp-w-full gp-object-contain")},t?.id),jsxRuntime.jsx(MediaIcon.default,{contentType:t?.contentType??""})]})},t?.id))})})};exports.default=ProductImagesLightBox;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),Carousel=require("../../../../../carousel/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel/components/item/CarouselItem.js"),NextImage=require("../../../../../image/components/NextImage.js");require("../../../../../modal/components/confirm.js");var Modal=require("../../../../../modal/components/Modal.js"),React=require("react"),productFeaturedImage=require("../../common/productFeaturedImage.js"),ProductFeatureVideo=require("../child/ProductFeatureVideo.js"),MediaIcon=require("../child/MediaIcon.js");const ProductImagesLightBox=({builderPropUID:e,productImages:t,open:o,imageRatio:i,onHandleClose:s})=>{let l=core.useFeaturedImageGlobal(),r=React.useMemo(()=>{let e=t?.findIndex(e=>e.id===l?.id);return e&&e>0?e:0},[t,l]),d={desktop:t&&t.length>1,mobile:t&&t?.length>1,tablet:t&&t?.length>1},a={desktop:!1,mobile:!1,tablet:!1},n=core.useEditorMode(),u=e=>"edit"!==n&&["VIDEO","EXTERNAL_VIDEO"].includes(e?.contentType||"");return jsxRuntime.jsx(Modal.default,{setting:{open:o},styles:{width:"80%"},closeOnClickOutside:!0,onClose:()=>{s(),console.log("onHandleClose")},disableIframeClickEvent:!0,contentClass:"mobile:!gp-w-[100%] gp-px-2 gp-pb-10",children:jsxRuntime.jsx(Carousel.default,{setting:{loop:a,slidesToShow:{desktop:1,tablet:1,mobile:1},defaultCurrentSlider:r,dot:{desktop:!0,mobile:!0,tablet:!0},dotStyle:{desktop:"outside",mobile:"outside",tablet:"outside"},dotColor:{desktop:"#E2E2E2",mobile:"#E2E2E2",tablet:"#E2E2E2"},dotActiveColor:{desktop:"#121212",mobile:"#121212",tablet:"#121212"},dotSize:{desktop:12},dotGapToCarousel:{desktop:12},navigationEnable:d,navigationStyle:{desktop:"outside"},arrowIconSize:{desktop:24},initialSlide:r},styles:{sizeSetting:{desktop:{height:"80vh"},tablet:{height:"80vh"},mobile:{height:"60vh"}},playSpeed:0},moveToIdx:r,hiddenDotWhenOnlyOne:!0,isHiddenArrowWhenDisabled:!0,isDisableResetSlide:!0,builderProps:{uid:e},fullHeight:!0,children:t?.map(t=>jsxRuntime.jsx(CarouselItem.default,{className:`gem-slider-item gem-slider-item-${e} gp-flex gp-items-center gp-justify-center gp-px-4`,children:u(t)?jsxRuntime.jsx(ProductFeatureVideo.default,{type:t?.contentType,url:t.src??"",aspectRatio:i}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(NextImage.default,{src:productFeaturedImage.isFeatureMedia(t?.contentType)?t?.previewImage:t?.src,width:t?.width,height:t?.height,alt:t?.alt,"content-type":t?.contentType,setting:{aspectRatio:i},className:core.cls("gp-h-full gp-w-full gp-object-contain")},t?.id),jsxRuntime.jsx(MediaIcon.default,{contentType:t?.contentType??""})]})},t?.id))})})};exports.default=ProductImagesLightBox;

package/dist/cjs/product/components/product-images-v2/hooks/useProductGalleryGrid.js

@@ -1 +1 @@
-"use strict";var core=require("@gem-sdk/core"),React=require("react"),productGallery=require("../common/productGallery.js"),useFilterImagesByVariant=require("./useFilterImagesByVariant.js"),helpers=require("../../../../image/common/helpers.js");const useProductGalleryGrid=e=>{let{builderPropUID:r,productImages:t,activeIndexFormFeatureImage:a,children:o,isHiddenInteraction:s,...i}=e,l=core.useCurrentDevice(),c=core.useFeaturedImageGlobal(),[u,n]=React.useState(0),y=core.useEditorMode(),{filteredProductImages:d}=useFilterImagesByVariant.useFilterImagesByVariant({productImages:t,displayByVariant:i?.displayByVariant,variantSelect:i?.variantSelect}),p=productGallery.getShapeByLayout({shape:i.shape,shapeForBottom:i.shapeForBottom,shapeFor1Col:i.shapeFor1Col,shapeFor2Col:i.shapeFor2Col,shapeForFtOnly:i.shapeForFtOnly,shapeForInsideBottom:i.shapeForInsideBottom,shapeForInside:i.shapeForInside},i.position),h=core.getResponsiveValueByScreen(i.clickOpenLightBox,l),F=productGallery.checkDisplayGalleryByWidth({shapeByLayout:p}),m=core.getResponsiveValueByScreen(F,l),B=i?.borderActive?.border!=="none",g=React.useCallback(()=>{helpers.handleSetSrcForProductImageList({builderPropUID:r,shapeByLayout:p,qualityType:i.qualityType,qualityPercent:i.qualityPercent})},[p,i.qualityPercent,i.qualityType,r]);return React.useEffect(()=>{n(a||0)},[a]),React.useEffect(()=>{let e=d?.findIndex(e=>e.id===c?.id);n(e&&e>0?e:0)},[c,d]),React.useEffect(()=>{if("edit"===y)return;let e=document?.querySelector(".grid-gallery");if(!e)return;g();let r=new ResizeObserver(()=>{g()});return r?.observe(e,{}),()=>{r?.disconnect()}},[g,r,y]),{isDisplay:m,shapeByLayout:p,imageActiveIndex:u,enableOpenLightBox:h,isEnableBorderActive:B,filteredProductImages:d}};exports.useProductGalleryGrid=useProductGalleryGrid;
+"use strict";var core=require("@gem-sdk/core"),React=require("react"),productGallery=require("../common/productGallery.js"),useFilterImagesByVariant=require("./useFilterImagesByVariant.js"),helpers=require("../../../../image/common/helpers.js");const useProductGalleryGrid=e=>{let{builderPropUID:r,productImages:t,activeIndexFromFeatureImage:a,children:o,isHiddenInteraction:s,...i}=e,l=core.useCurrentDevice(),c=core.useFeaturedImageGlobal(),[u,n]=React.useState(0),y=core.useEditorMode(),{filteredProductImages:d}=useFilterImagesByVariant.useFilterImagesByVariant({productImages:t,displayByVariant:i?.displayByVariant,variantSelect:i?.variantSelect}),p=productGallery.getShapeByLayout({shape:i.shape,shapeForBottom:i.shapeForBottom,shapeFor1Col:i.shapeFor1Col,shapeFor2Col:i.shapeFor2Col,shapeForFtOnly:i.shapeForFtOnly,shapeForInsideBottom:i.shapeForInsideBottom,shapeForInside:i.shapeForInside},i.position),h=core.getResponsiveValueByScreen(i.clickOpenLightBox,l),F=productGallery.checkDisplayGalleryByWidth({shapeByLayout:p}),m=core.getResponsiveValueByScreen(F,l),B=i?.borderActive?.border!=="none",g=React.useCallback(()=>{helpers.handleSetSrcForProductImageList({builderPropUID:r,shapeByLayout:p,qualityType:i.qualityType,qualityPercent:i.qualityPercent})},[p,i.qualityPercent,i.qualityType,r]);return React.useEffect(()=>{n(a||0)},[a]),React.useEffect(()=>{let e=d?.findIndex(e=>e.id===c?.id);n(e&&e>0?e:0)},[c,d]),React.useEffect(()=>{if("edit"===y)return;let e=document?.querySelector(".grid-gallery");if(!e)return;g();let r=new ResizeObserver(()=>{g()});return r?.observe(e,{}),()=>{r?.disconnect()}},[g,r,y]),{isDisplay:m,shapeByLayout:p,imageActiveIndex:u,enableOpenLightBox:h,isEnableBorderActive:B,filteredProductImages:d}};exports.useProductGalleryGrid=useProductGalleryGrid;

package/dist/cjs/product/components/product-list/ProductListCarouselLayout.liquid.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),CarouselItem_liquid=require("../../../carousel/components/item/CarouselItem.liquid.js"),Carousel_liquid=require("../../../carousel/components/root/Carousel.liquid.js"),helpers=require("./common/helpers.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers$1=require("../../../helpers.js"),ProductListCarouselItem_liquid=require("./ProductListCarouselItem.liquid.js");const ProductListCarouselLayout=e=>{let{builderProps:t,advanced:r,productSrc:s,productListId:o}=e,{carouselConfigSetting:i,carouselConfigStyle:u}=helpers.getData(e),{carouselItemStyle:l}=styles.getStyle(e),{carouselClass:d}=classes.getClass(e);return core.template`
-    ${Carousel_liquid.default({advanced:r,builderProps:{...t},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${t?.uid}`,rootClass:d,setting:i,styles:u,children:`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),CarouselItem_liquid=require("../../../carousel/components/item/CarouselItem.liquid.js"),Carousel_liquid=require("../../../carousel/components/root/Carousel.liquid.js"),helpers=require("./common/helpers.js"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers$1=require("../../../helpers.js"),ProductListCarouselItem_liquid=require("./ProductListCarouselItem.liquid.js");const ProductListCarouselLayout=e=>{let{builderProps:t,advanced:r,productSrc:s,productListId:i}=e,{carouselConfigSetting:o,carouselConfigStyle:u}=helpers.getData(e),{carouselItemStyle:l}=styles.getStyle(e),{carouselClass:d}=classes.getClass(e);return core.template`
+    ${Carousel_liquid.default({advanced:r,builderProps:{...t},rootAttrs:{"items-repeat":"true"},rootId:`product-list-carousel-${t?.uid}`,rootClass:d,setting:o,styles:u,isProductList:!0,children:`
         {%- assign count = 0 -%}
         {%- for product in products limit: limit -%}
         {%- if product.id != empty -%}
         {%- assign count = count | plus: 1 -%}
         {%- assign variant = product.selected_or_first_available_variant -%}
         {%- assign product_form_id = 'product-form-' | append: "${t?.uid}" | append: product.id -%}
-        ${CarouselItem_liquid.default({builderProps:{...t},style:l,parentId:`product-list-carousel-${t?.uid} gp-child-item-${t?.uid}`,parentStyle:u,background:i?.background,children:`
+        ${CarouselItem_liquid.default({builderProps:{...t},style:l,parentId:`product-list-carousel-${t?.uid} gp-child-item-${t?.uid}`,parentStyle:u,parentSettings:o,background:o?.background,children:`
             ${ProductListCarouselItem_liquid.default({...e})}
           `})}
         {%- endif -%}
         {% endfor %}
-        {%- if count == 0 and ${o.length} == 0 -%}
+        {%- if count == 0 and ${i.length} == 0 -%}
           {% if '${s}' == 'RelatedProduct' -%}
               <div>${helpers$1.getStaticLocale("ProductList","no_related_products")}</div>
             {% else %}

package/dist/cjs/product/index.js

@@ -1 +1 @@
-"use strict";var Product=require("./components/product-wrap/Product.js");require("react/jsx-runtime"),require("next/link"),require("@gem-sdk/core"),require("react"),require("@gem-sdk/system"),require("../notification/components/Notifications.js"),require("../notification/components/Notice.js"),require("./components/product-button/types.js"),require("./components/product-variants/components/variants/index.js"),require("next/image"),require("@gem-sdk/keen-slider/react"),require("../modal/components/confirm.js"),require("react-dom"),require("../video/components/Video.js");var QuickView=require("./components/product-quick-view/QuickView.js");require("./components/constants/product-bundle.js");var ProductList=require("./components/product-list/ProductList.js");require("./components/product-bundle/common/styles.js"),require("./components/product-bundle/common/classes.js"),require("./components/product-badge/constants.js"),require("./components/product-badge/types.js"),require("./components/product-badge/utils/shape.js");var Product$1=require("./settings/Product.js"),ProductQuantity$1=require("./settings/ProductQuantity.js"),ProductTitle$1=require("./settings/ProductTitle.js"),ProductButton$1=require("./settings/ProductButton.js"),ProductPrice$1=require("./settings/ProductPrice.js"),ProductVariants$1=require("./settings/ProductVariants.js"),ProductImages$1=require("./settings/ProductImages.js"),ProductImages$2=require("./settings/product-image-v2/ProductImages.js"),ProductDescription$1=require("./settings/ProductDescription.js"),ProductProperties$1=require("./settings/ProductProperties.js"),ProductTag=require("./settings/ProductTag.js"),ProductList$1=require("./settings/ProductList.js"),DynamicCheckout$1=require("./settings/DynamicCheckout.js"),Vendor$1=require("./settings/Vendor.js"),Sku$1=require("./settings/Sku.js"),ProductBundleDiscount$1=require("./components/product-bundle/setting/ProductBundleDiscount.js"),ProductBundleDiscountItem$1=require("./components/product-bundle/setting/ProductBundleDiscountItem.js"),ProductViewMore$1=require("./settings/ProductViewMore.js"),ProductBadge$1=require("./settings/ProductBadge.js"),index=require("./components/file-upload/settings/index.js");const productSetting={Product:Product$1.default,ProductQuantity:ProductQuantity$1.default,ProductTitle:ProductTitle$1.default,ProductButton:ProductButton$1.default,ProductPrice:ProductPrice$1.default,ProductVariants:ProductVariants$1.default,ProductImages:ProductImages$1.default,ProductImagesV2:ProductImages$2.default,ProductDescription:ProductDescription$1.default,ProductProperties:ProductProperties$1.default,ProductTag:ProductTag.default,ProductList:ProductList$1.default,DynamicCheckout:DynamicCheckout$1.default,ProductVendor:Vendor$1.default,ProductSku:Sku$1.default,ProductBundleDiscount:ProductBundleDiscount$1.default,ProductBundleDiscountItem:ProductBundleDiscountItem$1.default,ProductViewMore:ProductViewMore$1.default,ProductBadge:ProductBadge$1.default,FileUpload:index.default};exports.Product=Product.default,exports.ProductQuickView=QuickView.default,exports.ProductList=ProductList.default,exports.productSetting=productSetting;
+"use strict";var Product=require("./components/product-wrap/Product.js");require("react/jsx-runtime"),require("next/link"),require("@gem-sdk/core"),require("react"),require("@gem-sdk/system"),require("../notification/components/Notifications.js"),require("../notification/components/Notice.js"),require("./components/product-button/types.js"),require("./components/product-variants/components/variants/index.js"),require("next/image"),require("../modal/components/confirm.js"),require("react-dom"),require("../video/components/Video.js");var QuickView=require("./components/product-quick-view/QuickView.js");require("./components/constants/product-bundle.js");var ProductList=require("./components/product-list/ProductList.js");require("./components/product-bundle/common/styles.js"),require("./components/product-bundle/common/classes.js"),require("./components/product-badge/constants.js"),require("./components/product-badge/types.js"),require("./components/product-badge/utils/shape.js");var Product$1=require("./settings/Product.js"),ProductQuantity$1=require("./settings/ProductQuantity.js"),ProductTitle$1=require("./settings/ProductTitle.js"),ProductButton$1=require("./settings/ProductButton.js"),ProductPrice$1=require("./settings/ProductPrice.js"),ProductVariants$1=require("./settings/ProductVariants.js"),ProductImages$1=require("./settings/ProductImages.js"),ProductImages$2=require("./settings/product-image-v2/ProductImages.js"),ProductDescription$1=require("./settings/ProductDescription.js"),ProductProperties$1=require("./settings/ProductProperties.js"),ProductTag=require("./settings/ProductTag.js"),ProductList$1=require("./settings/ProductList.js"),DynamicCheckout$1=require("./settings/DynamicCheckout.js"),Vendor$1=require("./settings/Vendor.js"),Sku$1=require("./settings/Sku.js"),ProductBundleDiscount$1=require("./components/product-bundle/setting/ProductBundleDiscount.js"),ProductBundleDiscountItem$1=require("./components/product-bundle/setting/ProductBundleDiscountItem.js"),ProductViewMore$1=require("./settings/ProductViewMore.js"),ProductBadge$1=require("./settings/ProductBadge.js"),index=require("./components/file-upload/settings/index.js");const productSetting={Product:Product$1.default,ProductQuantity:ProductQuantity$1.default,ProductTitle:ProductTitle$1.default,ProductButton:ProductButton$1.default,ProductPrice:ProductPrice$1.default,ProductVariants:ProductVariants$1.default,ProductImages:ProductImages$1.default,ProductImagesV2:ProductImages$2.default,ProductDescription:ProductDescription$1.default,ProductProperties:ProductProperties$1.default,ProductTag:ProductTag.default,ProductList:ProductList$1.default,DynamicCheckout:DynamicCheckout$1.default,ProductVendor:Vendor$1.default,ProductSku:Sku$1.default,ProductBundleDiscount:ProductBundleDiscount$1.default,ProductBundleDiscountItem:ProductBundleDiscountItem$1.default,ProductViewMore:ProductViewMore$1.default,ProductBadge:ProductBadge$1.default,FileUpload:index.default};exports.Product=Product.default,exports.ProductQuickView=QuickView.default,exports.ProductList=ProductList.default,exports.productSetting=productSetting;

package/dist/cjs/product/settings/product-image-v2/configs/ui-v2.js

@@ -1 +1 @@
-"use strict";var ImageListNavigation=require("./ui/ImageListNavigation.js"),FeatureNavigation=require("./ui/FeatureNavigation.js"),FeatureDots=require("./ui/FeatureDots.js");const showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...FeatureDots.FeatureDots,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...FeatureNavigation.FeatureNavigation,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...ImageListNavigation.ImageListNavigation,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Default item"},setting:{id:"preDisplay"}}]},{label:{en:"Optimize LCP"},controls:[{label:{en:"Preload"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',setting:{id:"preload"}},{label:{en:"Quality"},setting:{id:"qualityType"},conditionDisplay:"preload === false"},{layout:"horizontal",label:{en:" "},conditionDisplay:'qualityType == "custom" && preload === false',setting:{id:"qualityPercent"}}]},{controls:[{label:{en:"Align"},setting:{id:"align"},options:{labelVariant:"primary"}}]}];exports.SettingUIV2=SettingUIV2;
+"use strict";var ImageListNavigation=require("./ui/ImageListNavigation.js"),FeatureNavigation=require("./ui/FeatureNavigation.js"),FeatureDots=require("./ui/FeatureDots.js");const showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...FeatureDots.FeatureDots,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...FeatureNavigation.FeatureNavigation,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...ImageListNavigation.ImageListNavigation,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Default item"},setting:{id:"preDisplay"}}]},{label:{en:"Optimize LCP"},controls:[{label:{en:"Preload"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',setting:{id:"preload"}},{label:{en:"Quality"},setting:{id:"qualityType"},conditionDisplay:"preload === false"},{layout:"horizontal",label:{en:"Quality"},conditionDisplay:'qualityType == "custom" && preload === false',setting:{id:"qualityPercent"}}]},{controls:[{label:{en:"Align"},setting:{id:"align"},options:{labelVariant:"primary"}}]}];exports.SettingUIV2=SettingUIV2;

package/dist/cjs/video/components/HTML5Embed.liquid.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),NextImage_liquid=require("../../image/components/NextImage.liquid.js"),helpers=require("../../helpers.js"),system=require("@gem-sdk/system"),classes=require("../common/classes.js"),styles=require("../common/styles.js"),attrs=require("../common/attrs.js");const HTML5Embed=e=>{let t=`gp-video-${e.uid}`,{thumbnail:s,muted:a,autoplay:l,loop:o,controls:r,src:i,style:d,title:n,className:c,lazy:m,poster:u}=e,p=l&&a&&!!s,y=!m&&e.isVideoComponent,g=i.endsWith(".mp4"),v=!s||l&&a,$=y?i:void 0,h=system.createAttr({...attrs.getHtml5Attr({videoId:t,title:n,autoplay:l,preloadThumbnail:p,offLazyLoad:y,src:i,thumbnail:s})}),b=system.createClass({...classes.getWrapThumbnailClasses(v)}),f=system.createStyle({...styles.getPreloadImageStyle()}),L=system.createClass({...classes.getButtonThumbnailClasses()}),I=system.createClass({...classes.getImageThumbnailClasses()}),E=system.createClass({...classes.getVideoYoutubeClasses(c,y)}),A=()=>p?core.template`${NextImage_liquid.default({src:s,alt:n,priority:u?.preload,enableLazyLoadImage:!0,style:f})}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),NextImage_liquid=require("../../image/components/NextImage.liquid.js"),helpers=require("../../helpers.js"),system=require("@gem-sdk/system"),classes=require("../common/classes.js"),styles=require("../common/styles.js"),attrs=require("../common/attrs.js");const HTML5Embed=e=>{let t=`gp-video-${e.uid}`,{thumbnail:s,muted:a,autoplay:l,loop:o,controls:r,src:i,style:d,title:n,className:c,lazy:m,poster:u,wrapperStyles:p}=e,y=l&&a&&!!s,g=!m&&e.isVideoComponent,v=i.endsWith(".mp4"),$=!s||l&&a,h=g?i:void 0,b=system.createAttr({...attrs.getHtml5Attr({videoId:t,title:n,autoplay:l,preloadThumbnail:y,offLazyLoad:g,src:i,thumbnail:s})}),f=system.createClass({...classes.getWrapThumbnailClasses($)}),L=system.createStyle({...styles.getPreloadImageStyle()}),I=system.createClass({...classes.getButtonThumbnailClasses()}),E=system.createClass({...classes.getImageThumbnailClasses()}),A=system.createClass({...classes.getVideoYoutubeClasses(c,g)}),C=()=>y?core.template`${NextImage_liquid.default({src:s,alt:n,priority:u?.preload,enableLazyLoadImage:!0,style:L})}
     ${system.If(l,`<script>
         document.addEventListener("DOMContentLoaded", (event) => {
           const eventList = ["keydown", "mousemove", "wheel", "touchmove", "touchstart", "touchend"];
@@ -20,14 +20,14 @@
           }
         });
       </script>`)}
-      `:"",C=()=>core.template`
+      `:"",P=()=>core.template`
      <div
         role="presentation"
         style="${d}"
-        class="${b}"
+        class="${f}"
         >
-           ${NextImage_liquid.default({id:"video-thumbnail",src:s??"",alt:u?.altText,title:u?.imageTitle,className:I,isDisableAspectStyle:!0,priority:u?.preload,enableLazyLoadImage:!0})}
-          <button type="button" class="${L}" aria-label="Play">
+           ${NextImage_liquid.default({id:"video-thumbnail",src:s??"",alt:u?.altText,title:u?.imageTitle,className:E,isDisableAspectStyle:!0,priority:u?.preload,enableLazyLoadImage:!0})}
+          <button type="button" class="${I}" aria-label="Play">
             <svg class="gp-w-5 gp-text-white" viewBox="0 0 24 24">
               <path
                 fill="currentColor"
@@ -37,22 +37,22 @@
           </button>
         </div>
   `;return core.template`
-  <gp-lite-html5-embed is-check-loaded="${e.isCheckLoaded??!1}">
-    ${A()}
+  <gp-lite-html5-embed is-check-loaded="${e.isCheckLoaded??!1}" style="${p}">
+    ${C()}
     <video
-    ${{...h}}
+    ${{...b}}
       style="${d}"
-      class="${E}"
+      class="${A}"
       ${r?"controls":void 0}
       ${o?"loop":void 0}
       ${a?"muted":void 0}
       ${l?"autoplay":void 0}
       playsinline
-      src="${$}"
+      src="${h}"
     >
-      ${system.If(g,`<source data-src="${i}" src="${$}" type="video/mp4"></source>`)}
+      ${system.If(v,`<source data-src="${i}" src="${h}" type="video/mp4"></source>`)}
     </video>
-    ${system.If(!v,C())}
+    ${system.If(!$,P())}
   </gp-lite-html5-embed>
         ${core.RenderIf(core.isLocalEnv,`<script ${helpers.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-lite-html5-embed-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${helpers.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-lite-html5-embed-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};exports.default=HTML5Embed;

package/dist/esm/carousel/components/arrow/common/classes.js

@@ -1 +1 @@
-import{createClass as e}from"@gem-sdk/system";import{getClassArrowDisplay as r,getClassArrowRotate as g,getResponsiveSetting as s}from"./helpers.js";let getClass=p=>{let{className:t,componentId:i,rootId:l,left:o,uid:n,isHiddenWhenDisabled:u,disabled:a,showWhenHover:c,showArrow:m,vertical:f}=p,v="gp-carousel-arrow-"+n,d=s(m||{}),x=o?"gp-carousel-action-back gem-slider-previous":"gp-carousel-action-next gem-slider-next",h=e({"gp-z-1 gp-items-center gp-justify-center gp-overflow-hidden gp-shrink-0":!0,[v]:!0,...t&&{[t]:!0},...i&&{[i]:!0},...l&&{[l]:!0},...x&&{[x]:!0},...{"gp-invisible":u&&a,"gp-cursor-default gp-text-gray-300":a,"gp-cursor-pointer gp-text-gray-500":!a,"!gp-invisible group-hover/carousel:!gp-visible":c,...r(d)}}),y=e({"gp-flex gp-items-center gp-justify-center [&>svg]:gp-h-full [&>svg]:gp-w-full":!0,...g(!!o,f)});return{buttonClass:h,buttonContentClass:y}};export{getClass};
+import{createClass as e}from"@gem-sdk/system";import{getClassArrowDisplay as r,getClassArrowRotate as g,getResponsiveSetting as p}from"./helpers.js";let getClass=t=>{let{className:s,componentId:o,rootId:i,left:l,uid:n,isHiddenWhenDisabled:u,disabled:a,showWhenHover:c,showArrow:f,vertical:m}=t,v="gp-carousel-arrow-"+n,b=p(f||{}),d=l?"gp-carousel-action-back gem-slider-previous":"gp-carousel-action-next gem-slider-next",x=e({"gp-z-1 gp-items-center gp-justify-center gp-overflow-hidden gp-shrink-0 before:gp-left-0 before:gp-top-0":!0,[v]:!0,...s&&{[s]:!0},...o&&{[o]:!0},...i&&{[i]:!0},...d&&{[d]:!0},...{"gp-invisible":u&&a,"gp-cursor-default gp-text-gray-300":a,"gp-cursor-pointer gp-text-gray-500":!a,"!gp-invisible group-hover/carousel:!gp-visible":c,...r(b)}}),h=e({"gp-flex gp-items-center gp-justify-center [&>svg]:gp-h-full [&>svg]:gp-w-full":!0,...g(!!l,m)});return{buttonClass:x,buttonContentClass:h}};export{getClass};

package/dist/esm/carousel/components/arrow/common/helpers.js

@@ -1 +1 @@
-import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let getResponsiveSetting=t=>{let e=t.desktop,l=t.tablet?t.tablet:e,i=t.mobile?t.mobile:l;return{desktop:e,tablet:l,mobile:i}},getArrowPositionStyle=({vertical:l,arrowType:i,gapToEachSize:o,left:a})=>{let r={};return t.forEach(t=>{let p=e(l,t,!1),g="desktop"===t?"":`-${t}`;p?(r[`top${g}`]="inside"===i[t]&&a?o+"px":"initial",r[`left${g}`]=a?"initial":"",r[`bottom${g}`]="inside"!==i[t]||a?"initial":o+"px",r[`right${g}`]=a?"":"initial"):(a?(r[`left${g}`]="inside"===i[t]?o+"px":"3px",r[`right${g}`]="initial"):(r[`right${g}`]="inside"===i[t]?o+"px":"3px",r[`left${g}`]="initial"),r[`top${g}`]=a?"initial":"",r[`bottom${g}`]=a?"":"initial")}),r},getClassArrowRotate=(l,i)=>{let o={},a={vertical:{left:{desktop:"gp-rotate-[-90deg]",tablet:"tablet:gp-rotate-[-90deg]",mobile:"mobile:gp-rotate-[-90deg]"},right:{desktop:"gp-rotate-90",tablet:"tablet:gp-rotate-90",mobile:"mobile:gp-rotate-90"}},horizontal:{left:{desktop:"gp-rotate-180",tablet:"tablet:gp-rotate-180",mobile:"mobile:gp-rotate-180"},right:{desktop:"gp-rotate-0",tablet:"tablet:gp-rotate-0",mobile:"mobile:gp-rotate-0"}}};return t.forEach(t=>{let r=e(i,t,!1),p=r?"vertical":"horizontal",g=l?"left":"right",n=a[p][g][t];o[n]=!0}),o},getClassArrowDisplay=e=>{let l={inside:{desktop:"!gp-flex !gp-absolute gp-z-2",tablet:"tablet:!gp-flex tablet:!gp-absolute tablet:gp-z-2",mobile:"mobile:!gp-flex mobile:!gp-absolute mobile:gp-z-2"},outside:{desktop:"!gp-flex !gp-relative",tablet:"tablet:!gp-flex tablet:!gp-relative",mobile:"mobile:!gp-flex mobile:!gp-relative"},none:{desktop:"!gp-hidden",tablet:"tablet:!gp-hidden",mobile:"mobile:!gp-hidden"}},i={};return t.forEach(t=>{let o=e[t];o||(o="none");let a=l[o][t];i[a]=!0}),i},getArrowDisplayStyle=l=>{let i={};return t.forEach(t=>{let o=e(l,t,"none");i={...i,[t]:"none"===o?"none":"flex"}}),i},mappingNavigationCarousel=e=>{let l=e=>{let l={...e},i=t.filter(t=>!Object.keys(l).includes(t));return i.forEach(t=>{"tablet"===t&&(l[t]=l.desktop),"mobile"===t&&(l[t]=l.tablet)}),l};if(e?.layout==="vertical"){let{controlOverContent:i,arrow:o}=e,a=l(o),r=l(i),p={};return t.forEach(t=>{a[t]?a[t]&&r[t]?p[t]="inside":p[t]="outside":p[t]="none"}),{...e,navigationStyle:p}}return e},getData=t=>{let e=!!t.custom&&""!==t.custom;return{isRenderCustomIcon:e}};export{getArrowDisplayStyle,getArrowPositionStyle,getClassArrowDisplay,getClassArrowRotate,getData,getResponsiveSetting,mappingNavigationCarousel};
+import{DEVICES as e,getResponsiveValueByScreen as t}from"@gem-sdk/core";let getResponsiveSetting=e=>{let t=e.desktop,i=e.tablet?e.tablet:t,l=e.mobile?e.mobile:i;return{desktop:t,tablet:i,mobile:l}},getArrowPositionStyle=({vertical:i,arrowType:l,gapToEachSize:o,left:a})=>{let r={};return e.forEach(e=>{let p=t(i,e,!1),g="desktop"===e?"":`-${e}`;p?(r[`top${g}`]="inside"===l[e]&&a?o+"px":"initial",r[`left${g}`]=a?"initial":"",r[`bottom${g}`]="inside"!==l[e]||a?"initial":o+"px",r[`right${g}`]=a?"":"initial"):(a?(r[`left${g}`]="inside"===l[e]?o+"px":"3px",r[`right${g}`]="initial"):(r[`right${g}`]="inside"===l[e]?o+"px":"3px",r[`left${g}`]="initial"),r[`top${g}`]=a?"initial":"",r[`bottom${g}`]=a?"":"initial")}),r},getClassArrowRotate=(i,l)=>{let o={},a={vertical:{left:{desktop:"gp-rotate-[-90deg]",tablet:"tablet:gp-rotate-[-90deg]",mobile:"mobile:gp-rotate-[-90deg]"},right:{desktop:"gp-rotate-90",tablet:"tablet:gp-rotate-90",mobile:"mobile:gp-rotate-90"}},horizontal:{left:{desktop:"gp-rotate-180",tablet:"tablet:gp-rotate-180",mobile:"mobile:gp-rotate-180"},right:{desktop:"gp-rotate-0",tablet:"tablet:gp-rotate-0",mobile:"mobile:gp-rotate-0"}}};return e.forEach(e=>{let r=t(l,e,!1),p=r?"vertical":"horizontal",g=i?"left":"right",s=a[p][g][e];o[s]=!0}),o},getClassArrowDisplay=t=>{let i={inside:{desktop:"!gp-flex !gp-absolute gp-z-2",tablet:"tablet:!gp-flex tablet:!gp-absolute tablet:gp-z-2",mobile:"mobile:!gp-flex mobile:!gp-absolute mobile:gp-z-2"},outside:{desktop:"!gp-flex !gp-relative",tablet:"tablet:!gp-flex tablet:!gp-relative",mobile:"mobile:!gp-flex mobile:!gp-relative"},none:{desktop:"!gp-hidden",tablet:"tablet:!gp-hidden",mobile:"mobile:!gp-hidden"}},l={};return e.forEach(e=>{let o=t[e];o||(o="none");let a=i[o][e];l[a]=!0}),l},getArrowDisplayStyle=i=>{let l={};return e.forEach(e=>{let o=t(i,e,"none");l={...l,[e]:"none"===o?"none":"flex"}}),l},mappingNavigationCarousel=t=>{let i=t=>{let i={...t},l=e.filter(e=>!Object.keys(i).includes(e));return l.forEach(e=>{"tablet"===e&&(i[e]=i.desktop),"mobile"===e&&(i[e]=i.tablet)}),i};if(t?.layout==="vertical"){let{controlOverContent:l,arrow:o}=t,a=i(o),r=i(l),p={};return e.forEach(e=>{a[e]?a[e]&&r[e]?p[e]="inside":p[e]="outside":p[e]="none"}),{...t,navigationStyle:p}}return t},getData=e=>{let t=!!e.custom&&""!==e.custom;return{isRenderCustomIcon:t}},getResponsiveSizeValue=(e,t,i)=>{for(let l of({mobile:["mobile","tablet","desktop"],tablet:["tablet","desktop"],desktop:["desktop"]})[t]){let t=e?.[l]?.[i];if(void 0!==t)return""===t?"auto":t}return"auto"},getResponsiveWidth=e=>({"--w":getResponsiveSizeValue(e,"desktop","width"),"--w-tablet":getResponsiveSizeValue(e,"tablet","width"),"--w-mobile":getResponsiveSizeValue(e,"mobile","width")}),getResponsiveHeight=e=>({"--h":getResponsiveSizeValue(e,"desktop","height"),"--h-tablet":getResponsiveSizeValue(e,"tablet","height"),"--h-mobile":getResponsiveSizeValue(e,"mobile","height")});export{getArrowDisplayStyle,getArrowPositionStyle,getClassArrowDisplay,getClassArrowRotate,getData,getResponsiveHeight,getResponsiveSetting,getResponsiveWidth,mappingNavigationCarousel};

package/dist/esm/carousel/components/arrow/common/styles.js

@@ -1,6 +1,6 @@
-import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeStyle as r,getSingleColorVariable as t,getResponsiveStyleShadowWithoutState as a,getPaddingGlobalSize as l,makeGlobalSizeWidthResponsive as p,makeGlobalSizeHeightResponsive as i,makeStyleResponsive as s,composeCornerCss as $,composeBorderCss as d}from"@gem-sdk/core";import{getArrowDisplayStyle as m,getArrowPositionStyle as n,getResponsiveSetting as c}from"./helpers.js";let getStyle=(g,b="liquid")=>{let{uid:w,vertical:h,showArrow:x,gapToEachSize:u,left:f,arrowBackgroundColor:k,arrowButtonSize:y,rootId:S,arrowBorder:z,arrowCorner:j,arrowCustomColor:q,arrowIconSize:v,arrowShadow:E}=g,T=r({bg:t(k)}),A=r({c:t(q)}),B=a(E,"box-shadow",E),C=c(z||{}),D=c(j||{}),F=l(y),G=c(v||{}),H=c(x||{}),I=p(y),J=i(y),K=s("w",G,"px"),L=s("h",G,"px"),M=s("d",m(H)),N=r(n({vertical:h,arrowType:H,gapToEachSize:u??"",left:!!f})),O={...T,...M,...N,...I,...J,...F,...B},P={...A,...K,...L},Q="react"===b?e(O):o(O),R="react"===b?e(P):o(P),U=`
+import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeStyle as r,getSingleColorVariable as t,getResponsiveStyleShadowWithoutState as a,getPaddingGlobalSize as i,makeStyleResponsive as l,composeCornerCss as p,composeBorderCss as d}from"@gem-sdk/core";import{getResponsiveWidth as s,getResponsiveHeight as $,getArrowDisplayStyle as n,getArrowPositionStyle as m,getResponsiveSetting as c}from"./helpers.js";let getStyle=(g,b="liquid")=>{let{uid:w,vertical:h,showArrow:u,gapToEachSize:x,left:f,arrowBackgroundColor:k,arrowButtonSize:y,rootId:S,arrowBorder:q,arrowCorner:v,arrowCustomColor:z,arrowIconSize:j,arrowShadow:E}=g,T=r({bg:t(k)}),A=r({c:t(z)}),B=a(E,"box-shadow",E),C=c(q||{}),D=c(v||{}),F=i(y),G=c(j||{}),H=c(u||{}),I=r({v:"hidden"}),J=s(y),K=$(y),L=l("w",G,"px"),M=l("h",G,"px"),N=l("d",n(H)),O=r(m({vertical:h,arrowType:H,gapToEachSize:x??"",left:!!f})),P={...T,...N,...O,...J,...K,...F,...B,..."liquid"===b?I:{}},Q={...A,...L,...M},R="react"===b?e(P):o(P),U="react"===b?e(Q):o(Q),V=`
       ${S?"."+S:""}.gp-carousel-arrow-${w} {
-        ${$(D.desktop)}
+        ${p(D.desktop)}
       }
       ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
         content: '';
@@ -10,24 +10,24 @@ import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeS
         pointer-events: none;
         z-index: 10;
         ${d(C.desktop)}
-        ${$(D.desktop)}
+        ${p(D.desktop)}
       }
       @media only screen and (max-width: 1024px) and (min-width: 768px) {
         ${S?"."+S:""}.gp-carousel-arrow-${w} {
-          ${$(D.tablet)}
+          ${p(D.tablet)}
         }
         ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
           ${d(C.tablet)}
-          ${$(D.tablet)}
+          ${p(D.tablet)}
         }
       }
       @media only screen and (max-width: 768px) {
         ${S?"."+S:""}.gp-carousel-arrow-${w} {
-          ${$(D.mobile)}
+          ${p(D.mobile)}
         }
         ${S?"."+S:""}.gp-carousel-arrow-${w}::before {
           ${d(C.mobile)}
-          ${$(D.mobile)}
+          ${p(D.mobile)}
         }
       }
-    `;return{buttonStyle:Q,buttonContentStyle:R,innerBorderCss:U}};export{getStyle};
+    `;return{buttonStyle:R,buttonContentStyle:U,innerBorderCss:V}};export{getStyle};

package/dist/esm/carousel/components/dot/common/helpers.js

@@ -1 +1 @@
-import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let getData=t=>{let{hiddenWhenOnlyOne:e}=t,r=e=>{let{enabledSneakPeak:r,totalSlideItem:l=0,numberOfFullWidthShow:a=0,slideItemsPerPage:o=0}=t;return r?Array.from({length:e?l:l-a+1},(t,e)=>e):Array.from({length:e?l:Math.ceil(l/o)},(t,e)=>e)},l=t=>e&&t?.length<2;return{checkHidden:l,getDotItems:r}},getUpdatedDotStyle=(r,l)=>{let a={};return t.forEach(t=>{let o=e(r,t),g=e(l,t);a={...a,[t]:o?g:"none"}}),a};export{getData,getUpdatedDotStyle};
+import{DEVICES as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";let getData=t=>{let{hiddenWhenOnlyOne:e,slideDuplicated:r}=t,l=e=>{let{enabledSneakPeak:l,totalSlideItem:a=0,numberOfFullWidthShow:o=0,slideItemsPerPage:g=0}=t,n=0;return Array.from({length:n=e?r?a/2:a:l?a-o+1:Math.ceil(a/g)},(t,e)=>e)},a=t=>e&&t?.length<2;return{checkHidden:a,getDotItems:l}},getUpdatedDotStyle=(r,l)=>{let a={};return t.forEach(t=>{let o=e(r,t),g=e(l,t);a={...a,[t]:o?g:"none"}}),a};export{getData,getUpdatedDotStyle};

package/dist/esm/carousel/components/item/CarouselItem.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as e}from"react/jsx-runtime";import{isEmptyChildren as o}from"@gem-sdk/core";import{getStyle as r}from"./common/styles.js";import{getClass as s}from"./common/classes.js";import{useCarouselItem as m}from"../../hooks/useCarouseItem.js";import t from"../../../grid/components/ChildrenDroppable.js";let CarouselItem=i=>{let{children:l,builderAttrs:a}=i,{handleClick:n,handleMouseMove:c,handleMouseOut:d}=m(i),{carouselItemStyle:p,carouselItemInnerStyle:u}=r(i),{carouselItemClass:f,carouselItemInnerClass:h}=s(i);return e("div",{...a,"aria-hidden":!0,className:f,style:p,onClick:n,onMouseMove:c,onMouseLeave:d,children:e("div",{className:h,style:u,children:o(l)?e(t,{}):l})})};export{CarouselItem as default};
+import{jsx as e}from"react/jsx-runtime";import{useEditorMode as r,isEmptyChildren as o}from"@gem-sdk/core";import"react";import"@gem-sdk/system";import{SwiperSlide as s}from"../swiper/SwiperSlide.js";import{getStyle as m}from"./common/styles.js";import{getClass as t}from"./common/classes.js";import{useCarouselItem as i}from"../../hooks/useCarouseItem.js";import l from"../../../grid/components/ChildrenDroppable.js";let CarouselItem=a=>{let{children:d,builderAttrs:p,parentSettings:c,builderProps:n}=a,{handleClick:u,handleMouseMove:f,handleMouseOut:j}=i(a),{indexKey:h}=a,k=n?.uid?`${n?.uid}-${h}`:h,y=r(),{carouselItemStyle:C,carouselItemInnerStyle:g}=m(a,y),{carouselItemClass:v,carouselItemInnerClass:I}=t(a);return e(s,{...p,"aria-hidden":!0,className:v,style:C,onClick:u,onMouseMove:f,onMouseLeave:j,dir:c?.rtl?"rtl":"ltr","data-carousel-item-key":k,children:e("div",{className:I,style:g,children:o(d)?e(l,{}):d})})};export{CarouselItem as default};

package/dist/esm/carousel/components/item/common/styles.js

@@ -1 +1 @@
-import{makeGlobalSize as e,getStyleBackgroundByDevice as t,getGradientBgrStyleByDevice as o,getStyleShadow as r,makeStyle as a,getSingleColorVariable as s,getRadiusStyleActiveState as n}from"@gem-sdk/core";import{createStyle as d}from"@gem-sdk/system";import{getInitialWidthForCarouselItem as i}from"../../../common/helpers.js";let getStyle=k=>{let{style:l,contentType:m,parentStyle:p,parentSettings:c,background:b,customStyle:f}=k,u=e(p?.itemPadding),h=()=>{let e=["--radius"];return(e.forEach(e=>{delete l?.[e]}),"productImage"===m)?l:{...l,...a({bs:p?.borderContent?.border,bw:p?.borderContent?.width,bc:s(p?.borderContent?.color)}),...n({...p?.roundedContent,active:{...p?.roundedContent||{},radiusType:"custom"}})}},w={...f,...u&&u.padding,...i({spacing:p?.spacing,slidesToShow:c?.itemNumber??c?.slidesToShow,sneakPeak:c?.sneakPeak,sneakPeakType:c?.sneakPeakType,sneakPeakOffsetCenter:c?.sneakPeakOffsetCenter,sneakPeakOffsetForward:c?.sneakPeakOffsetForward,vertical:c?.vertical}),...t(b),...o(b,{desktop:!0,tablet:!0,mobile:!0})},g=d({...r({value:p?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:p?.hasActiveShadow})}),P=d({...w,...h()});return{carouselItemStyle:P,carouselItemInnerStyle:g}};export{getStyle};
+import{makeGlobalSize as e,DEVICES as t,getResponsiveValueByScreen as r,getStyleBackgroundByDevice as o,getGradientBgrStyleByDevice as a,getStyleShadow as s,makeStyle as n,getSingleColorVariable as d,getRadiusStyleActiveState as i}from"@gem-sdk/core";import{createStyle as l}from"@gem-sdk/system";import{getInitialWidthForCarouselItem as k}from"../../../common/helpers.js";let getStyle=(m,p)=>{let{style:c,contentType:u,parentStyle:f,parentSettings:b,background:g,customStyle:h}=m,w=e(f?.itemPadding),P=t.reduce((e,t)=>{if("edit"===p)return{};let o=b?.rtl,a=o?"ml":"mr",s=r(f?.spacing,t);return{...e,[`--${a}${"desktop"!==t?`-${t}`:""}`]:s+"px"}},{}),y=()=>{let e=["--radius"];return(e.forEach(e=>{delete c?.[e]}),"productImage"===u)?c:{...c,...n({bs:f?.borderContent?.border,bw:f?.borderContent?.width,bc:d(f?.borderContent?.color)}),...i({...f?.roundedContent,active:{...f?.roundedContent||{},radiusType:"custom"}})}},C={...h,...w&&w.padding,...k({spacing:f?.spacing,slidesToShow:b?.itemNumber??b?.slidesToShow,sneakPeak:b?.sneakPeak,sneakPeakType:b?.sneakPeakType,sneakPeakOffsetCenter:b?.sneakPeakOffsetCenter,sneakPeakOffsetForward:b?.sneakPeakOffsetForward,vertical:b?.vertical}),...o(g),...a(g,{desktop:!0,tablet:!0,mobile:!0})},S=l({...s({value:f?.carouselShadow,styleAppliedFor:"box-shadow",isEnableShadow:f?.hasActiveShadow})}),v=l({...C,...y(),...P});return{carouselItemStyle:v,carouselItemInnerStyle:S}};export{getStyle};

package/dist/esm/carousel/components/root/Carousel.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsx as o,jsxs as e,Fragment as r}from"react/jsx-runtime";import{useCurrentDevice as t,filterToolbarPreview as a,isEmptyChildren as s}from"@gem-sdk/core";import{forwardRef as l,Children as i,isValidElement as d}from"react";import n from"../dot/Dots.js";import m from"../arrow/Arrow.js";import{mappingNavigationCarousel as c}from"../arrow/common/helpers.js";import{useCarousel as p}from"../../hooks/useCarousel.js";import{getClass as u}from"./common/classes.js";import{getStyle as h}from"./common/styles.js";import{getAttr as f}from"./common/attrs.js";import{getData as k}from"./common/helpers.js";let Carousel=l((l,w)=>{let{children:C,builderAttrs:S,builderProps:v,styles:y,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:j,elmRef:b}=l,P=c(l.setting),x={...l,setting:P},{arrowButtonSize:z,arrowBackgroundColor:N,arrowGapToEachSide:T="16",roundedArrow:A,arrowIconSize:I,arrowCustomColor:W,arrowBorder:B,arrowShadow:D,showWhenHover:H}=P??{},{totalSlideItem:O,isInfinity:E,slider:G,currentSlide:F,localRef:U,showNavigation:q,isRenderDots:J,slideMaxIndex:K,handleDotClick:L,getItemsPerPage:M,sliderRef:Q,handleNextAndPrevSlide:R,dispatchEventSelectSlide:V,getNumberOfFullWidthShow:X}=p(x,w),{loopConfig:Y,arrowShowConfig:Z}=k(x),{rootClassRender:$,wrapperClassRender:_,wrapperInnerClass:oo,sliderClass:oe}=u(x),{rootStyleRender:or,wrapperStyleRender:ot,wrapperInnerStyle:oa}=h(x),{rootAttrRender:os,sliderAttr:ol}=f(x),oi=t(),od=P?.sneakPeak?.[oi],on=e=>{let r="next"===e,t=r?!E&&G?.track?.details?.abs===K:!E&&G?.track?.details?.abs===0;return o(m,{uid:v?.uid,custom:P?.arrowCustom??"",showArrow:Z,arrowButtonSize:z||{},arrowIconSize:I||{},arrowBackgroundColor:N||"",arrowCustomColor:W,gapToEachSize:T,showWhenHover:H,arrowBorder:B||{},arrowCorner:A||{},arrowShadow:D||{},onClick:o=>{o.stopPropagation(),R(e)},left:!r,disabled:t,vertical:P?.vertical,isHiddenWhenDisabled:g,rootId:l?.parentClass})},om=()=>o(r,{children:s(C)?o("div",{children:"No Slider"}):i.map(a(C),(e,r)=>d(e)?o(e.type,{...e.props,index:r,parentSettings:P,parentStyle:y,background:P?.background,parentUid:v?.uid,dispatchEventSelectSlide:V}):null)});return o("div",{ref:b,...os,className:$,style:or,children:e("div",{ref:U,...S,className:_,style:ot,children:[e("div",{className:oo,style:oa,children:[q&&on("prev"),o("div",{ref:Q,...ol,className:oe,children:om()}),q&&on("next")]}),J&&o(n,{showDots:P?.dot,dotStyle:P?.dotStyle,totalSlideItem:O,slideItemsPerPage:M(),currentSlide:F,enabledSneakPeak:od,vertical:P?.vertical,loop:Y,dotColor:P?.dotColor,dotGapToCarousel:P?.dotGapToCarousel,dotSize:P?.dotSize,dotActiveColor:P?.dotActiveColor,hiddenWhenOnlyOne:j,sneakPeakType:P?.sneakPeakType,numberOfFullWidthShow:X(oi),onHandleClick:L}),a(C,!0)]})})});export{Carousel as default};
+import{jsx as e,jsxs as r,Fragment as o}from"react/jsx-runtime";import{forwardRef as t,Children as i,useState as l,useRef as s,useMemo as n,useCallback as a,isValidElement as d,cloneElement as m,createElement as p}from"react";import{filterToolbarPreview as c,useCurrentDevice as u,isEmptyChildren as h}from"@gem-sdk/core";import{mappingNavigationCarousel as S}from"../arrow/common/helpers.js";import{useCarousel as v}from"../../hooks/useCarousel.js";import{getData as w}from"./common/helpers.js";import{getClass as f}from"./common/classes.js";import{getStyle as C}from"./common/styles.js";import{getAttr as k}from"./common/attrs.js";import y from"../arrow/Arrow.js";import g from"../dot/Dots.js";import{Swiper as j}from"../swiper/Swiper.js";import"@gem-sdk/system";let Carousel=t((t,b)=>{let{children:O,builderAttrs:$,builderProps:P,styles:D,isHiddenArrowWhenDisabled:I=!0,hiddenDotWhenOnlyOne:x,elmRef:z,isEnableCheckHasScrollableContent:A,onSwiperReady:T}=t,B=S(t.setting),N={...t,setting:B},R=i.count(c(O))??0,[W,E]=l(null),{arrowButtonSize:H,arrowBackgroundColor:G,arrowGapToEachSide:F="16",roundedArrow:K,arrowIconSize:U,arrowCustomColor:q,arrowBorder:J,arrowShadow:L,showWhenHover:M}=B??{},Q=s({prevOrder:"",prevContent:"",version:0}),V=n(()=>{let e=B?.childItem||[],r=e.join("|"),o=[...e].sort().join("|"),t=Q.current;return t.prevOrder&&t.prevContent&&o===t.prevContent&&r!==t.prevOrder&&t.version++,t.prevOrder=r,t.prevContent=o,`reorder-${t.version}`},[B?.childItem]),{isInfinity:X,localRef:Y,sliderSettings:Z,totalSlideItem:_,currentSlide:ee,isRenderDots:er,showNavigation:eo,isScrollToStart:et,isScrollToEnd:ei,handleDotClick:el,getItemsPerPage:es,handleNextAndPrevSlide:en,dispatchEventSelectSlide:ea,getNumberOfFullWidthShow:ed,setCurrentSlide:em,shouldDuplicateSlides:ep,setIsScrollToStart:ec,setIsScrollToEnd:eu}=v(N,b,W,R),{loopConfig:eh,arrowShowConfig:eS}=w(N),{rootClassRender:ev,wrapperClassRender:ew,wrapperInnerClass:ef,sliderClass:eC}=f(N),{rootStyleRender:ek,wrapperStyleRender:ey,wrapperInnerStyle:eg}=C(N),{rootAttrRender:ej,sliderAttr:eb}=k(N),eO=u(),e$=B?.sneakPeak?.[eO],eP=r=>{let o="next"===r;if(R<=1)return null;let i=o?!X&&W?.isEnd:!X&&W?.isBeginning,l=o?!X&&ei:!X&&et;return e(y,{uid:P?.uid,custom:B?.arrowCustom??"",showArrow:eS,arrowButtonSize:H||{},arrowIconSize:U||{},arrowBackgroundColor:G||"",arrowCustomColor:q,gapToEachSize:F,showWhenHover:M,arrowBorder:J||{},arrowCorner:K||{},arrowShadow:L||{},onClick:e=>{e.stopPropagation(),en(r)},left:!o,disabled:A?l:i,vertical:B?.vertical,isHiddenWhenDisabled:I,rootId:t?.parentClass})},eD=a(e=>{E(e),T?.(e)},[]),eI=a(()=>{t?.isDisableResetSlide||(em(0),ec(!0),eu(!1))},[t?.isDisableResetSlide,em,eu,ec]),ex=i.toArray(c(O)).filter(d),ez=ep(R),eA=ez?2*R:R,eT=n(()=>{if(!ez)return ex;let e=ex.map((e,r)=>{if(!d(e))return e;let o=e.key,t=o?`${o}-duplicate-${r}`:`duplicate-${r}`;return m(e,{...e.props||{},key:t})});return[...ex,...e]},[ez,ex]),eB=n(()=>`${R}-${V}-${eT.length}-${Z?.direction}`,[R,V,eT.length,Z?.direction]);return e("div",{ref:z,...ej,className:ev,style:ek,children:r("div",{ref:Y,...$,className:ew,style:ey,children:[r("div",{className:ef,style:eg,children:[eo&&eP("prev"),p(j,{...eb,...Z,sliderClass:eC,thumbsSwiper:t?.thumbsSwiper,onSwiperReady:eD,totalSlides:_,key:eB,sliderOrder:V,onSwiperReset:eI},h(O)?e("div",{children:"No Slider"}):e(o,{children:eT.map((e,r)=>{if(!d(e))return null;let o=e.props??{};return p(e.type,{...o,key:e.key,indexKey:r.toString(),parentSettings:B,parentStyle:D,background:B?.background,parentUid:P?.uid,dispatchEventSelectSlide:ea})})})),eo&&eP("next")]}),er&&e(g,{dotStyle:B?.dotStyle,dotGapToCarousel:B?.dotGapToCarousel,vertical:B?.vertical,showDots:B?.dot,slideItemsPerPage:es(),enabledSneakPeak:e$,dotColor:B?.dotColor,dotActiveColor:B?.dotActiveColor,dotSize:B?.dotSize,sneakPeakType:B?.sneakPeakType,totalSlideItem:eA,hiddenWhenOnlyOne:x,currentSlide:ee,loop:eh,numberOfFullWidthShow:ed(eO),onHandleClick:el,slideDuplicated:ez}),c(O,!0)]})})});export{Carousel as default};

package/dist/esm/carousel/components/root/Carousel.liquid.js

@@ -1,15 +1,17 @@
-import{template as o,RenderIf as r,isLocalEnv as e,baseAssetURL as s,WrapRenderChildren as t,RenderChildren as i}from"@gem-sdk/core";import a from"../arrow/Arrow.liquid.js";import l from"../dot/Dots.liquid.js";import{mappingNavigationCarousel as d}from"../arrow/common/helpers.js";import{getData as n}from"./common/helpers.js";import{getClass as p}from"./common/classes.js";import{getStyle as m}from"./common/styles.js";import{getAttr as c}from"./common/attrs.js";import{getSettingPreloadData as u,getStaticLocale as $}from"../../../helpers.js";let Carousel=f=>{let{children:v,builderAttrs:g,builderProps:w,styles:S,isHiddenArrowWhenDisabled:h=!0,hiddenDotWhenOnlyOne:C,rootId:y,rawChildren:j,conditionAppendJs:k}=f,z=d(f.setting),E={...f,setting:z},{arrowButtonSize:I,arrowBackgroundColor:A,arrowGapToEachSide:G="16",roundedArrow:P,arrowIconSize:T,arrowCustomColor:b,arrowBorder:q,arrowShadow:x,showWhenHover:B}=z??{},{uniqueComponentId:D,loopConfig:O,arrowShowConfig:W,stateData:_}=n(E),{rootClassRender:H,wrapperClassRender:M,wrapperInnerClass:N,sliderClass:R}=p(E),{rootStyleRender:U,wrapperStyleRender:V,wrapperInnerStyle:F,sliderStyle:J}=m(E),{rootAttrRender:K,sliderAttr:L}=c(E),Q=()=>r(e,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-carousel-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${s}/assets-v2/gp-carousel-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),X=o=>{let r="next"===o;return a({uid:w?.uid,componentId:D,custom:z?.arrowCustom??"",showArrow:W,arrowButtonSize:I||{},arrowIconSize:T||{},arrowBackgroundColor:A??"",arrowCustomColor:b,gapToEachSize:G,showWhenHover:B,arrowBorder:q||{},arrowCorner:P||{},arrowShadow:x||{},left:!r,onClick:o=>{o.stopPropagation()},vertical:z?.vertical,isHiddenWhenDisabled:h,rootId:y})},Y=()=>o`
-    ${j?.length?t({uid:w?.uid??"",customProps:j[0]?.customProps},j.map((r,e)=>{if(r)return o`${i({...r,index:e,parentSettings:z,parentStyle:S,background:z?.background,parentUid:w?.uid})}`})):v??`<div>${$("Carousel","no_slider")}</div>`}`;return o`
-    <gp-carousel gp-data='${_}' ${K} style="${U}" class="${H}">
+import{template as o,RenderIf as r,isLocalEnv as e,baseAssetURL as s,WrapRenderChildren as t,RenderChildren as i}from"@gem-sdk/core";import a from"../arrow/Arrow.liquid.js";import l from"../dot/Dots.liquid.js";import{mappingNavigationCarousel as d}from"../arrow/common/helpers.js";import{getData as n}from"./common/helpers.js";import{getClass as p}from"./common/classes.js";import{getStyle as m}from"./common/styles.js";import{getAttr as c}from"./common/attrs.js";import{getSettingPreloadData as u,getStaticLocale as $}from"../../../helpers.js";let Carousel=v=>{let{children:f,builderAttrs:g,builderProps:w,styles:S,isHiddenArrowWhenDisabled:h=!0,hiddenDotWhenOnlyOne:C,rootId:y,rawChildren:j,conditionAppendJs:k}=v,z=d(v.setting),E={...v,setting:z},{arrowButtonSize:I,arrowBackgroundColor:A,arrowGapToEachSide:G="16",roundedArrow:P,arrowIconSize:T,arrowCustomColor:b,arrowBorder:q,arrowShadow:x,showWhenHover:B}=z??{},{uniqueComponentId:D,loopConfig:O,arrowShowConfig:W,stateData:_}=n(E),{rootClassRender:H,wrapperClassRender:M,wrapperInnerClass:N,sliderClass:R}=p(E),{sliderWrapperStyle:U,rootStyleRender:V,wrapperStyleRender:F,wrapperInnerStyle:J}=m(E),{rootAttrRender:K,sliderAttr:L}=c(E),Q=()=>r(e,`<script ${u('class="gps-link" delay',"src")}="{{ 'gp-carousel-v2-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${u('class="gps-link" delay',"src")}="${s}/assets-v2/gp-carousel-v2-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),X=o=>{let r="next"===o;return a({uid:w?.uid,componentId:D,custom:z?.arrowCustom??"",showArrow:W,arrowButtonSize:I||{},arrowIconSize:T||{},arrowBackgroundColor:A??"",arrowCustomColor:b,gapToEachSize:G,showWhenHover:B,arrowBorder:q||{},arrowCorner:P||{},arrowShadow:x||{},left:!r,onClick:o=>{o.stopPropagation()},vertical:z?.vertical,isHiddenWhenDisabled:h,rootId:y})},Y=()=>o`
+    ${j?.length?t({uid:w?.uid??"",customProps:j[0]?.customProps},j.map((r,e)=>{if(r)return o`${i({...r,index:e,parentSettings:z,parentStyle:S,background:z?.background,parentUid:w?.uid})}`})):f??`<div>${$("Carousel","no_slider")}</div>`}`;return o`
+    <gp-carousel gp-data='${_}' ${K} style="${V}" class="${H}">
       <div
         ${g}
         class="${M}"
-        style="${V}"
+        style="${F}"
       >
-        <div class="${N}" style="${F}">
+        <div class="${N}" style="${J}">
           ${X("prev")}
-          <div ${L} class="${R}" style="${J}">
-            ${Y()}
+          <div ${L} style="${U}">
+            <div class="${R}">
+              ${Y()}
+            </div>
           </div>
           ${X("next")}
         </div>

package/dist/esm/carousel/components/root/common/attrs.js

@@ -1 +1 @@
-import{createAttr as t}from"@gem-sdk/system";import{getData as r}from"./helpers.js";let getAttr=e=>{let{rootAttrs:o,builderProps:d,rootId:i}=e,{uniqueComponentId:s}=r(e),m=t({"data-id":`${d?.uid}`,id:`gp-root-carousel-${s}`,...o}),p=t({...(d?.uid||i)&&{id:`gp-carousel-${s}`}});return{rootAttrRender:m,sliderAttr:p}};export{getAttr};
+import{createAttr as t}from"@gem-sdk/system";import{getData as r}from"./helpers.js";let getAttr=e=>{let{rootAttrs:i,builderProps:o,rootId:d}=e,{uniqueComponentId:l}=r(e),s=t({"data-id":`${o?.uid}`,id:`gp-root-carousel-${l}`,...i}),g=t({...(o?.uid||d)&&{id:`gp-carousel-${l}`},dir:e.setting?.rtl?"rtl":"ltr"});return{rootAttrRender:s,sliderAttr:g}};export{getAttr};