@gem-sdk/components 19.1.0-staging.3 → 19.1.0-staging.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/carousel-v3/components/root/CarouselEmbla.liquid.js +6 -5
- package/dist/cjs/form/components/form-dropdown/FormDropdown.liquid.js +10 -10
- package/dist/cjs/product/components/product-images-v3/ProductImagesV3.liquid.js +13 -13
- package/dist/cjs/product/components/product-images-v3/ProductImagesV3Embla.liquid.js +15 -15
- package/dist/esm/carousel-v3/components/root/CarouselEmbla.liquid.js +4 -3
- package/dist/esm/form/components/form-dropdown/FormDropdown.liquid.js +6 -6
- package/dist/esm/product/components/product-images-v3/ProductImagesV3.liquid.js +12 -12
- package/dist/esm/product/components/product-images-v3/ProductImagesV3Embla.liquid.js +16 -16
- package/package.json +2 -2
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js"),l=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:
|
|
2
|
-
<gp-carousel-v3
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),r=require("../arrow/Arrow.liquid.js"),t=require("../dot/Dots.liquid.js"),s=require("../arrow/common/helpers.js"),o=require("./common/helpers.js"),a=require("./common/classes.js"),i=require("./common/styles.js"),l=require("./common/attrs.js"),d=require("../../../helpers.js");exports.default=n=>{let{children:c,builderAttrs:p,builderProps:u,styles:v,isHiddenArrowWhenDisabled:g=!0,hiddenDotWhenOnlyOne:m,rootId:$,rawChildren:S,conditionAppendJs:h,productBadgeLiquid:w}=n,y=s.mappingNavigationCarousel(n.setting),f={...n,setting:y},{arrowButtonSize:C,arrowBackgroundColor:j,arrowGapToEachSide:q="16",roundedArrow:b,arrowIconSize:k,arrowCustomColor:P,arrowBorder:A,arrowShadow:D,showWhenHover:E}=y??{},{uniqueComponentId:I,loopConfig:R,arrowShowConfig:_,stateData:x}=o.getData(f),{rootClassRender:G,wrapperClassRender:O,wrapperInnerClass:T,sliderClass:W}=a.getClass(f),{sliderWrapperStyle:z,rootStyleRender:B,wrapperStyleRender:L,wrapperInnerStyle:H}=i.getStyle(f),{rootAttrRender:M,sliderAttr:N}=l.getAttr(f),U=()=>e.RenderIf(e.isLocalEnv,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-carousel-v3-embla-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-carousel-v3-embla-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),V=e=>r.default({uid:u?.uid,componentId:I,custom:y?.arrowCustom??"",showArrow:_,arrowButtonSize:C||{},arrowIconSize:k||{},arrowBackgroundColor:j??"",arrowCustomColor:P,gapToEachSize:q,showWhenHover:E,arrowBorder:A||{},arrowCorner:b||{},arrowShadow:D||{},left:"next"!==e,onClick:e=>{e.stopPropagation()},vertical:y?.vertical,isHiddenWhenDisabled:g,rootId:$});return e.template`
|
|
2
|
+
<gp-carousel-v3 ${M} style="${B}" class="${G}">
|
|
3
|
+
<script gp-data type="application/json">${x}</script>
|
|
3
4
|
<div
|
|
4
|
-
${
|
|
5
|
+
${p}
|
|
5
6
|
class="${O}"
|
|
6
7
|
style="${L}"
|
|
7
8
|
>
|
|
@@ -11,12 +12,12 @@
|
|
|
11
12
|
<div ${N} style="${z}">
|
|
12
13
|
<div class="${W}">
|
|
13
14
|
${e.template`
|
|
14
|
-
${S?.length?e.WrapRenderChildren({uid:
|
|
15
|
+
${S?.length?e.WrapRenderChildren({uid:u?.uid??"",customProps:S[0]?.customProps},S.map((r,t)=>{if(r)return e.template`${e.RenderChildren({...r,index:t,parentSettings:y,parentStyle:v,background:y?.background,parentUid:u?.uid})}`})):c??`<div>${d.getStaticLocale("Carousel","no_slider")}</div>`}`}
|
|
15
16
|
</div>
|
|
16
17
|
</div>
|
|
17
18
|
${V("next")}
|
|
18
19
|
</div>
|
|
19
|
-
${t.default({loop:R,showDots:
|
|
20
|
+
${t.default({loop:R,showDots:y?.dot,dotStyle:y?.dotStyle,dotGapToCarousel:y?.dotGapToCarousel,vertical:y?.vertical,uniqueComponentId:I,hiddenWhenOnlyOne:m})}
|
|
20
21
|
</div>
|
|
21
22
|
</gp-carousel-v3>
|
|
22
23
|
${h?`{% if ${h} %} ${U()} {% endif %}`:U()}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../../helpers.js"),s=require("@gem-sdk/system"),r=require("./common/styles.js"),o=require("./common/classes.js"),a=require("../../settings/form-dropdown/configs/translate.js");exports.default=({builderProps:l,setting:i,advanced:p,pageContext:d,styles:n})=>{let{name:c,childItem:m,required:u}=i??{},g=m?.map((e,s)=>t.getDynamicSourceLocales({val:e,uid:l?.uid,settingId:t.createSettingId({id:a.FormDropdown?.childItem?.id,index:s}),pageContext:d??{}})),f=s.createStyle(r.composeContainerStyles(p,i)),y=s.createStyle({...r.composeFormDropdownStyles(p,i,n),...r.getAppendTypoStyleFirstTime(i)}),$=s.createStyle(r.getStyleOption(i)),S=s.createClass(o.composeContainerClasses(p,l)),v=s.createClass(o.composeFormDropdownClasses(i));return e.template`
|
|
2
2
|
<gp-form-dropdown
|
|
3
3
|
data-id="${l?.uid}"
|
|
4
4
|
class="${S}"
|
|
@@ -8,22 +8,22 @@
|
|
|
8
8
|
type="email"
|
|
9
9
|
class="${v}"
|
|
10
10
|
style="${y}"
|
|
11
|
-
${
|
|
11
|
+
${s.If(u,"required")}
|
|
12
12
|
name="${c}"
|
|
13
|
-
gp-data='${JSON.stringify(d).replaceAll("'","'")}'
|
|
14
13
|
>
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
<script gp-data type="application/json">${JSON.stringify(i).replaceAll("'","'")}</script>
|
|
15
|
+
${s.If(!Number(i?.defaultOption),`<option class="gp-hidden" value="" disabled selected>
|
|
16
|
+
${i?.placeholder}
|
|
17
17
|
</option>`)}
|
|
18
|
-
${g?.map(
|
|
18
|
+
${g?.map(t=>e.template`
|
|
19
19
|
<option
|
|
20
|
-
value="${
|
|
20
|
+
value="${t}"
|
|
21
21
|
style="${$}"
|
|
22
|
-
${
|
|
22
|
+
${s.If(!!Number(i?.defaultOption),`selected: ${t===g[Number(i?.defaultOption)-1]}`)}
|
|
23
23
|
>
|
|
24
|
-
${
|
|
24
|
+
${t}
|
|
25
25
|
</option>`).join("")}
|
|
26
26
|
</select>
|
|
27
27
|
</gp-form-dropdown>
|
|
28
|
-
${e.RenderIf(e.isLocalEnv,`<script ${
|
|
28
|
+
${e.RenderIf(e.isLocalEnv,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-form-dropdown-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${t.getSettingPreloadData('class="gps-link" delay',"src")}="${e.baseAssetURL}/assets-v2/gp-form-dropdown-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
29
29
|
`};
|
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./common/common.js"),i=require("./components/feature-gallery/FeatureImageWithGallery.liquid.js"),r=require("./components/gallery-carousel/GalleryCarousel.liquid.js"),s=require("./components/gallery-grid/GalleryGrid.liquid.js"),a=require("../../../helpers.js"),o=require("./common/productGallery.js"),l=require("./composables/getProductImagesClassName.js"),d=require("./composables/getProductImagesStyles.js"),u=require("@gem-sdk/system"),p=require("./common/getBorderActiveCss.js"),n=require("../../helpers/function.js");exports.default=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./common/common.js"),i=require("./components/feature-gallery/FeatureImageWithGallery.liquid.js"),r=require("./components/gallery-carousel/GalleryCarousel.liquid.js"),s=require("./components/gallery-grid/GalleryGrid.liquid.js"),a=require("../../../helpers.js"),o=require("./common/productGallery.js"),l=require("./composables/getProductImagesClassName.js"),d=require("./composables/getProductImagesStyles.js"),u=require("@gem-sdk/system"),p=require("./common/getBorderActiveCss.js"),n=require("../../helpers/function.js");exports.default=c=>{let g=t.setDefaultWhenUndefineSetting(c),{setting:m,styles:f,builderProps:y,style:$}=g,{rawChildren:h,pageContext:S}=c,I={...m,...f},j=`
|
|
2
2
|
{
|
|
3
3
|
"id":${JSON.stringify(y?.uid)},
|
|
4
|
-
"pageContext": ${JSON.stringify(a.filterPageContext(
|
|
4
|
+
"pageContext": ${JSON.stringify(a.filterPageContext(S))},
|
|
5
5
|
"setting":${JSON.stringify(m)},
|
|
6
6
|
"styles":${JSON.stringify(f)},
|
|
7
7
|
"productUrl":{{product.url | json }},
|
|
8
|
-
"product":{{ product | json }},
|
|
8
|
+
"product":{% if product %}{"id":{{ product.id | json }},"handle":{{ product.handle | json }},"media":{{ product.media | json }}}{% else %}null{% endif %},
|
|
9
9
|
"collectionUrl": {{ collection.url | json }},
|
|
10
|
-
"collection": {{ collection | json }}
|
|
10
|
+
"collection": {% if collection %}{"handle":{{ collection.handle | json }}}{% else %}null{% endif %}
|
|
11
11
|
}
|
|
12
|
-
`,
|
|
13
|
-
${e.WrapRenderChildren({uid:y?.uid||"",customProps:
|
|
12
|
+
`,q=u.createAttr({"section-id":"{{section.id}}","data-id":`${y?.uid}`}),{isOnlyFeatureAllDevices:v,isRenderGalleryGrid:C}=t.getConditionRenderGalleryImages(I?.position,m?.type),F=C?{}:u.createAttr({"data-only-image":u.LiquidIf("product.media.size > 1","false","true")}),{wrapperClasses:L,productImagesGalleryClasses:P}=l.getProductImagesClassName(c),O=u.createClass({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),D=u.createClass({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:b,wrapContainerStyleOnlyOneImage:G,galleryImageStyle:z}=d.getProductImagesStyles(I),A=o.getShapeByLayout({shape:I.shape,shapeForBottom:I.shapeForBottom,shapeFor1Col:I.shapeFor1Col,shapeFor2Col:I.shapeFor2Col,shapeForFtOnly:I.shapeForFtOnly,shapeForInsideBottom:I.shapeForInsideBottom??o.sizeSettingDefaultForNewLayout,shapeForInside:I.shapeForInside??o.sizeSettingDefaultForNewLayout},I.position),N=t.getStyleInsideLayout(I.position,A,I?.spacing),_=()=>e.template`
|
|
13
|
+
${e.WrapRenderChildren({uid:y?.uid||"",customProps:h?.[0].customProps},h?.map(t=>{if(t)return e.template`${e.RenderChildren({...t,isInsideProductImage:!0,imageData:{imageShape:f?.ftShape,imageAlign:f?.align,imageLayout:f?.position},dotData:{dotSize:m?.ftDotSize,dotGapToCarousel:m?.ftDotGapToCarousel,dotStyle:m?.ftDotStyle}})}`}))}
|
|
14
14
|
`;return e.template`
|
|
15
|
-
${u.If(m?.borderActive?.border!=="none",u.LiquidIf("product.media.size > 1",`<style>${p.getBorderActiveCss({settings:
|
|
15
|
+
${u.If(m?.borderActive?.border!=="none",u.LiquidIf("product.media.size > 1",`<style>${p.getBorderActiveCss({settings:I,uid:y?.uid,type:"Liquid"})}</style>`),"")}
|
|
16
16
|
${u.Liquid(`
|
|
17
17
|
{% assign featured_image = product.featured_image %}
|
|
18
18
|
${u.LiquidIf("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
|
|
19
19
|
`)}
|
|
20
20
|
<gp-product-images-v3
|
|
21
|
-
${{...
|
|
21
|
+
${{...q}}
|
|
22
22
|
style="${{...$}}"
|
|
23
23
|
class="${L}"
|
|
24
24
|
>
|
|
25
|
-
<script gp-data type="application/json">${
|
|
25
|
+
<script gp-data type="application/json">${j}</script>
|
|
26
26
|
<div
|
|
27
27
|
class="${u.LiquidIf("product.media.size > 1",`${O}`,`${D}`)}"
|
|
28
28
|
style="${u.LiquidIf("product.media.size > 1",n.getStyleOfObject(b),n.getStyleOfObject(G))}"
|
|
29
29
|
>
|
|
30
|
-
${i.default({builderPropUID:`gp-carousel-${y?.uid}`,...
|
|
31
|
-
${u.If(!
|
|
30
|
+
${i.default({builderPropUID:`gp-carousel-${y?.uid}`,...I,children:_(),pageContext:S})}
|
|
31
|
+
${u.If(!v,e.template`
|
|
32
32
|
<div
|
|
33
33
|
class="${P}"
|
|
34
34
|
style="${n.getStyleOfObject(z)}"
|
|
35
35
|
${{...F}}
|
|
36
36
|
>
|
|
37
|
-
${u.LiquidIf("product.media.size > 1",r.default({builderPropUID:`gp-gallery-${y?.uid}`,...
|
|
38
|
-
${u.If(C,s.default({builderPropUID:y?.uid,wrapperStyle:{...N},children:_(),...
|
|
37
|
+
${u.LiquidIf("product.media.size > 1",r.default({builderPropUID:`gp-gallery-${y?.uid}`,...I,pageContext:S}))}
|
|
38
|
+
${u.If(C,s.default({builderPropUID:y?.uid,wrapperStyle:{...N},children:_(),...I,pageContext:S}))}
|
|
39
39
|
</div>
|
|
40
40
|
`)}
|
|
41
41
|
</div>
|
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./common/common.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("./common/common.js"),i=require("./components/feature-gallery/FeatureImageWithGalleryEmbla.liquid.js"),r=require("./components/gallery-carousel/GalleryCarouselEmbla.liquid.js"),s=require("./components/gallery-grid/GalleryGrid.liquid.js"),a=require("../../../helpers.js"),o=require("./common/productGallery.js"),l=require("./composables/getProductImagesClassName.js"),d=require("./composables/getProductImagesStyles.js"),u=require("@gem-sdk/system"),p=require("./common/getBorderActiveCss.js"),n=require("../../helpers/function.js");exports.default=c=>{let g=t.setDefaultWhenUndefineSetting(c),{setting:m,styles:f,builderProps:y,style:$}=g,{rawChildren:h,pageContext:S}=c,I={...m,...f},j=`
|
|
2
2
|
{
|
|
3
3
|
"id":${JSON.stringify(y?.uid)},
|
|
4
|
-
"pageContext": ${JSON.stringify(a.filterPageContext(
|
|
4
|
+
"pageContext": ${JSON.stringify(a.filterPageContext(S))},
|
|
5
5
|
"setting":${JSON.stringify(m)},
|
|
6
6
|
"styles":${JSON.stringify(f)},
|
|
7
|
-
"productUrl":{{product.url | json
|
|
8
|
-
"product":{{product | json |
|
|
9
|
-
"collectionUrl": {{ collection.url | json
|
|
10
|
-
"collection": {{ collection | json
|
|
7
|
+
"productUrl":{{product.url | json }},
|
|
8
|
+
"product":{% if product %}{"id":{{ product.id | json }},"handle":{{ product.handle | json }},"media":{{ product.media | json }}}{% else %}null{% endif %},
|
|
9
|
+
"collectionUrl": {{ collection.url | json }},
|
|
10
|
+
"collection": {% if collection %}{"handle":{{ collection.handle | json }}}{% else %}null{% endif %}
|
|
11
11
|
}
|
|
12
|
-
`,
|
|
13
|
-
${e.WrapRenderChildren({uid:y?.uid||"",customProps:
|
|
12
|
+
`,q=u.createAttr({"section-id":"{{section.id}}","data-id":`${y?.uid}`}),{isOnlyFeatureAllDevices:v,isRenderGalleryGrid:C}=t.getConditionRenderGalleryImages(I?.position,m?.type),F=C?{}:u.createAttr({"data-only-image":u.LiquidIf("product.media.size > 1","false","true")}),{wrapperClasses:L,productImagesGalleryClasses:P}=l.getProductImagesClassName(c),b=u.createClass({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),O=u.createClass({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:D,wrapContainerStyleOnlyOneImage:G,galleryImageStyle:z}=d.getProductImagesStyles(I),A=o.getShapeByLayout({shape:I.shape,shapeForBottom:I.shapeForBottom,shapeFor1Col:I.shapeFor1Col,shapeFor2Col:I.shapeFor2Col,shapeForFtOnly:I.shapeForFtOnly,shapeForInsideBottom:I.shapeForInsideBottom??o.sizeSettingDefaultForNewLayout,shapeForInside:I.shapeForInside??o.sizeSettingDefaultForNewLayout},I.position),N=t.getStyleInsideLayout(I.position,A,I?.spacing),_=()=>e.template`
|
|
13
|
+
${e.WrapRenderChildren({uid:y?.uid||"",customProps:h?.[0].customProps},h?.map(t=>{if(t)return e.template`${e.RenderChildren({...t,isInsideProductImage:!0,imageData:{imageShape:f?.ftShape,imageAlign:f?.align,imageLayout:f?.position},dotData:{dotSize:m?.ftDotSize,dotGapToCarousel:m?.ftDotGapToCarousel,dotStyle:m?.ftDotStyle}})}`}))}
|
|
14
14
|
`;return e.template`
|
|
15
|
-
${u.If(m?.borderActive?.border!=="none",u.LiquidIf("product.media.size > 1",`<style>${p.getBorderActiveCss({settings:
|
|
15
|
+
${u.If(m?.borderActive?.border!=="none",u.LiquidIf("product.media.size > 1",`<style>${p.getBorderActiveCss({settings:I,uid:y?.uid,type:"Liquid"})}</style>`),"")}
|
|
16
16
|
${u.Liquid(`
|
|
17
17
|
{% assign featured_image = product.featured_image %}
|
|
18
18
|
${u.LiquidIf("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
|
|
19
19
|
`)}
|
|
20
20
|
<gp-product-images-v3
|
|
21
|
-
|
|
22
|
-
${{...v}}
|
|
21
|
+
${{...q}}
|
|
23
22
|
style="${{...$}}"
|
|
24
23
|
class="${L}"
|
|
25
24
|
>
|
|
25
|
+
<script gp-data type="application/json">${j}</script>
|
|
26
26
|
<div
|
|
27
27
|
class="${u.LiquidIf("product.media.size > 1",`${b}`,`${O}`)}"
|
|
28
28
|
style="${u.LiquidIf("product.media.size > 1",n.getStyleOfObject(D),n.getStyleOfObject(G))}"
|
|
29
29
|
>
|
|
30
|
-
${
|
|
31
|
-
${u.If(!
|
|
30
|
+
${i.default({builderPropUID:`gp-carousel-${y?.uid}`,...I,children:_(),pageContext:S})}
|
|
31
|
+
${u.If(!v,e.template`
|
|
32
32
|
<div
|
|
33
33
|
class="${P}"
|
|
34
34
|
style="${n.getStyleOfObject(z)}"
|
|
35
35
|
${{...F}}
|
|
36
36
|
>
|
|
37
|
-
${u.LiquidIf("product.media.size > 1",
|
|
38
|
-
${u.If(C,s.default({builderPropUID:y?.uid,wrapperStyle:{...N},children:_(),...
|
|
37
|
+
${u.LiquidIf("product.media.size > 1",r.default({builderPropUID:`gp-gallery-${y?.uid}`,...I,pageContext:S}))}
|
|
38
|
+
${u.If(C,s.default({builderPropUID:y?.uid,wrapperStyle:{...N},children:_(),...I,pageContext:S}))}
|
|
39
39
|
</div>
|
|
40
40
|
`)}
|
|
41
41
|
</div>
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import{template as o,WrapRenderChildren as r,RenderChildren as
|
|
2
|
-
<gp-carousel-v3
|
|
1
|
+
import{template as o,WrapRenderChildren as r,RenderChildren as s,RenderIf as e,isLocalEnv as t,baseAssetURL 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 p}from"./common/helpers.js";import{getClass as n}from"./common/classes.js";import{getStyle as c}from"./common/styles.js";import{getAttr as m}from"./common/attrs.js";import{getStaticLocale as u,getSettingPreloadData as $}from"../../../helpers.js";let v=v=>{let{children:f,builderAttrs:g,builderProps:w,styles:h,isHiddenArrowWhenDisabled:S=!0,hiddenDotWhenOnlyOne:y,rootId:j,rawChildren:C,conditionAppendJs:k,productBadgeLiquid:b}=v,E=d(v.setting),I={...v,setting:E},{arrowButtonSize:A,arrowBackgroundColor:G,arrowGapToEachSide:P="16",roundedArrow:T,arrowIconSize:q,arrowCustomColor:x,arrowBorder:z,arrowShadow:B,showWhenHover:D}=E??{},{uniqueComponentId:O,loopConfig:W,arrowShowConfig:_,stateData:H}=p(I),{rootClassRender:M,wrapperClassRender:N,wrapperInnerClass:R,sliderClass:U}=n(I),{sliderWrapperStyle:V,rootStyleRender:F,wrapperStyleRender:J,wrapperInnerStyle:K}=c(I),{rootAttrRender:L,sliderAttr:Q}=m(I),X=()=>e(t,`<script ${$('class="gps-link" delay',"src")}="{{ 'gp-carousel-v3-embla-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${$('class="gps-link" delay',"src")}="${i}/assets-v2/gp-carousel-v3-embla-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`),Y=o=>a({uid:w?.uid,componentId:O,custom:E?.arrowCustom??"",showArrow:_,arrowButtonSize:A||{},arrowIconSize:q||{},arrowBackgroundColor:G??"",arrowCustomColor:x,gapToEachSize:P,showWhenHover:D,arrowBorder:z||{},arrowCorner:T||{},arrowShadow:B||{},left:"next"!==o,onClick:o=>{o.stopPropagation()},vertical:E?.vertical,isHiddenWhenDisabled:S,rootId:j});return o`
|
|
2
|
+
<gp-carousel-v3 ${L} style="${F}" class="${M}">
|
|
3
|
+
<script gp-data type="application/json">${H}</script>
|
|
3
4
|
<div
|
|
4
5
|
${g}
|
|
5
6
|
class="${N}"
|
|
@@ -11,7 +12,7 @@ import{template as o,WrapRenderChildren as r,RenderChildren as e,RenderIf as s,i
|
|
|
11
12
|
<div ${Q} style="${V}">
|
|
12
13
|
<div class="${U}">
|
|
13
14
|
${o`
|
|
14
|
-
${
|
|
15
|
+
${C?.length?r({uid:w?.uid??"",customProps:C[0]?.customProps},C.map((r,e)=>{if(r)return o`${s({...r,index:e,parentSettings:E,parentStyle:h,background:E?.background,parentUid:w?.uid})}`})):f??`<div>${u("Carousel","no_slider")}</div>`}`}
|
|
15
16
|
</div>
|
|
16
17
|
</div>
|
|
17
18
|
${Y("next")}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{template as e,RenderIf as s,isLocalEnv as o,baseAssetURL as
|
|
1
|
+
import{template as e,RenderIf as s,isLocalEnv as o,baseAssetURL as t}from"@gem-sdk/core";import{getDynamicSourceLocales as r,createSettingId as p,getSettingPreloadData as d}from"../../../helpers.js";import{createStyle as i,createClass as l,If as a}from"@gem-sdk/system";import{composeContainerStyles as m,getAppendTypoStyleFirstTime as n,composeFormDropdownStyles as c,getStyleOption as f}from"./common/styles.js";import{composeContainerClasses as $,composeFormDropdownClasses as g}from"./common/classes.js";import{FormDropdown as u}from"../../settings/form-dropdown/configs/translate.js";let y=({builderProps:y,setting:j,advanced:v,pageContext:w,styles:S})=>{let{name:h,childItem:N,required:O}=j??{},b=N?.map((e,s)=>r({val:e,uid:y?.uid,settingId:p({id:u?.childItem?.id,index:s}),pageContext:w??{}})),k=i(m(v,j)),E=i({...c(v,j,S),...n(j)}),A=i(f(j)),I=l($(v,y)),x=l(g(j));return e`
|
|
2
2
|
<gp-form-dropdown
|
|
3
3
|
data-id="${y?.uid}"
|
|
4
4
|
class="${I}"
|
|
@@ -8,22 +8,22 @@ import{template as e,RenderIf as s,isLocalEnv as o,baseAssetURL as r}from"@gem-s
|
|
|
8
8
|
type="email"
|
|
9
9
|
class="${x}"
|
|
10
10
|
style="${E}"
|
|
11
|
-
${
|
|
11
|
+
${a(O,"required")}
|
|
12
12
|
name="${h}"
|
|
13
|
-
gp-data='${JSON.stringify(j).replaceAll("'","'")}'
|
|
14
13
|
>
|
|
15
|
-
|
|
14
|
+
<script gp-data type="application/json">${JSON.stringify(j).replaceAll("'","'")}</script>
|
|
15
|
+
${a(!Number(j?.defaultOption),`<option class="gp-hidden" value="" disabled selected>
|
|
16
16
|
${j?.placeholder}
|
|
17
17
|
</option>`)}
|
|
18
18
|
${b?.map(s=>e`
|
|
19
19
|
<option
|
|
20
20
|
value="${s}"
|
|
21
21
|
style="${A}"
|
|
22
|
-
${
|
|
22
|
+
${a(!!Number(j?.defaultOption),`selected: ${s===b[Number(j?.defaultOption)-1]}`)}
|
|
23
23
|
>
|
|
24
24
|
${s}
|
|
25
25
|
</option>`).join("")}
|
|
26
26
|
</select>
|
|
27
27
|
</gp-form-dropdown>
|
|
28
|
-
${s(o,`<script ${
|
|
28
|
+
${s(o,`<script ${d('class="gps-link" delay',"src")}="{{ 'gp-form-dropdown-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${d('class="gps-link" delay',"src")}="${t}/assets-v2/gp-form-dropdown-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
29
29
|
`};export{y as default};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import{isLocalEnv as e,baseAssetURL as o,template as
|
|
1
|
+
import{isLocalEnv as e,baseAssetURL as o,template as i,WrapRenderChildren as t,RenderChildren as r}from"@gem-sdk/core";import{getConditionRenderGalleryImages as s,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as l}from"./common/common.js";import p from"./components/feature-gallery/FeatureImageWithGallery.liquid.js";import d from"./components/gallery-carousel/GalleryCarousel.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{filterPageContext as n,getSettingPreloadData as c}from"../../../helpers.js";import{getShapeByLayout as u,sizeSettingDefaultForNewLayout as g}from"./common/productGallery.js";import{getProductImagesClassName as f}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as y}from"./composables/getProductImagesStyles.js";import{createAttr as $,LiquidIf as h,createClass as j,If as v,Liquid as S}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let C=C=>{let P=l(C),{setting:G,styles:D,builderProps:b,style:z}=P,{rawChildren:O,pageContext:_}=C,N={...G,...D},A=`
|
|
2
2
|
{
|
|
3
3
|
"id":${JSON.stringify(b?.uid)},
|
|
4
|
-
"pageContext": ${JSON.stringify(
|
|
4
|
+
"pageContext": ${JSON.stringify(n(_))},
|
|
5
5
|
"setting":${JSON.stringify(G)},
|
|
6
6
|
"styles":${JSON.stringify(D)},
|
|
7
7
|
"productUrl":{{product.url | json }},
|
|
8
|
-
"product":{{ product | json }},
|
|
8
|
+
"product":{% if product %}{"id":{{ product.id | json }},"handle":{{ product.handle | json }},"media":{{ product.media | json }}}{% else %}null{% endif %},
|
|
9
9
|
"collectionUrl": {{ collection.url | json }},
|
|
10
|
-
"collection": {{ collection | json }}
|
|
10
|
+
"collection": {% if collection %}{"handle":{{ collection.handle | json }}}{% else %}null{% endif %}
|
|
11
11
|
}
|
|
12
|
-
`,B=$({"section-id":"{{section.id}}","data-id":`${b?.uid}`}),{isOnlyFeatureAllDevices:U,isRenderGalleryGrid:k}=
|
|
13
|
-
${t({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(e=>{if(e)return
|
|
14
|
-
`;return
|
|
15
|
-
${
|
|
12
|
+
`,B=$({"section-id":"{{section.id}}","data-id":`${b?.uid}`}),{isOnlyFeatureAllDevices:U,isRenderGalleryGrid:k}=s(N?.position,G?.type),q=k?{}:$({"data-only-image":h("product.media.size > 1","false","true")}),{wrapperClasses:E,productImagesGalleryClasses:J}=f(C),w=j({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),T=j({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:x,wrapContainerStyleOnlyOneImage:L,galleryImageStyle:M}=y(N),R=u({shape:N.shape,shapeForBottom:N.shapeForBottom,shapeFor1Col:N.shapeFor1Col,shapeFor2Col:N.shapeFor2Col,shapeForFtOnly:N.shapeForFtOnly,shapeForInsideBottom:N.shapeForInsideBottom??g,shapeForInside:N.shapeForInside??g},N.position),V=a(N.position,R,N?.spacing),W=()=>i`
|
|
13
|
+
${t({uid:b?.uid||"",customProps:O?.[0].customProps},O?.map(e=>{if(e)return i`${r({...e,isInsideProductImage:!0,imageData:{imageShape:D?.ftShape,imageAlign:D?.align,imageLayout:D?.position},dotData:{dotSize:G?.ftDotSize,dotGapToCarousel:G?.ftDotGapToCarousel,dotStyle:G?.ftDotStyle}})}`}))}
|
|
14
|
+
`;return i`
|
|
15
|
+
${v(G?.borderActive?.border!=="none",h("product.media.size > 1",`<style>${F({settings:N,uid:b?.uid,type:"Liquid"})}</style>`),"")}
|
|
16
16
|
${S(`
|
|
17
17
|
{% assign featured_image = product.featured_image %}
|
|
18
18
|
${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
|
|
@@ -27,18 +27,18 @@ import{isLocalEnv as e,baseAssetURL as o,template as r,WrapRenderChildren as t,R
|
|
|
27
27
|
class="${h("product.media.size > 1",`${w}`,`${T}`)}"
|
|
28
28
|
style="${h("product.media.size > 1",I(x),I(L))}"
|
|
29
29
|
>
|
|
30
|
-
${
|
|
31
|
-
${
|
|
30
|
+
${p({builderPropUID:`gp-carousel-${b?.uid}`,...N,children:W(),pageContext:_})}
|
|
31
|
+
${v(!U,i`
|
|
32
32
|
<div
|
|
33
33
|
class="${J}"
|
|
34
34
|
style="${I(M)}"
|
|
35
35
|
${{...q}}
|
|
36
36
|
>
|
|
37
37
|
${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${b?.uid}`,...N,pageContext:_}))}
|
|
38
|
-
${
|
|
38
|
+
${v(k,m({builderPropUID:b?.uid,wrapperStyle:{...V},children:W(),...N,pageContext:_}))}
|
|
39
39
|
</div>
|
|
40
40
|
`)}
|
|
41
41
|
</div>
|
|
42
42
|
</gp-product-images-v3>
|
|
43
|
-
${
|
|
43
|
+
${v(e,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-images-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-images-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
44
44
|
`};export{C as default};
|
|
@@ -1,44 +1,44 @@
|
|
|
1
|
-
import{isLocalEnv as e,baseAssetURL as o,template as
|
|
1
|
+
import{isLocalEnv as e,baseAssetURL as o,template as i,WrapRenderChildren as t,RenderChildren as r}from"@gem-sdk/core";import{getConditionRenderGalleryImages as s,getStyleInsideLayout as a,setDefaultWhenUndefineSetting as l}from"./common/common.js";import p from"./components/feature-gallery/FeatureImageWithGalleryEmbla.liquid.js";import d from"./components/gallery-carousel/GalleryCarouselEmbla.liquid.js";import m from"./components/gallery-grid/GalleryGrid.liquid.js";import{filterPageContext as n,getSettingPreloadData as c}from"../../../helpers.js";import{getShapeByLayout as u,sizeSettingDefaultForNewLayout as g}from"./common/productGallery.js";import{getProductImagesClassName as f}from"./composables/getProductImagesClassName.js";import{getProductImagesStyles as y}from"./composables/getProductImagesStyles.js";import{createAttr as $,LiquidIf as h,createClass as j,If as v,Liquid as S}from"@gem-sdk/system";import{getBorderActiveCss as F}from"./common/getBorderActiveCss.js";import{getStyleOfObject as I}from"../../helpers/function.js";let C=C=>{let P=l(C),{setting:b,styles:G,builderProps:D,style:z}=P,{rawChildren:O,pageContext:_}=C,E={...b,...G},N=`
|
|
2
2
|
{
|
|
3
3
|
"id":${JSON.stringify(D?.uid)},
|
|
4
|
-
"pageContext": ${JSON.stringify(
|
|
4
|
+
"pageContext": ${JSON.stringify(n(_))},
|
|
5
5
|
"setting":${JSON.stringify(b)},
|
|
6
6
|
"styles":${JSON.stringify(G)},
|
|
7
|
-
"productUrl":{{product.url | json
|
|
8
|
-
"product":{{product | json |
|
|
9
|
-
"collectionUrl": {{ collection.url | json
|
|
10
|
-
"collection": {{ collection | json
|
|
7
|
+
"productUrl":{{product.url | json }},
|
|
8
|
+
"product":{% if product %}{"id":{{ product.id | json }},"handle":{{ product.handle | json }},"media":{{ product.media | json }}}{% else %}null{% endif %},
|
|
9
|
+
"collectionUrl": {{ collection.url | json }},
|
|
10
|
+
"collection": {% if collection %}{"handle":{{ collection.handle | json }}}{% else %}null{% endif %}
|
|
11
11
|
}
|
|
12
|
-
`,A
|
|
13
|
-
${
|
|
14
|
-
`;return
|
|
15
|
-
${
|
|
16
|
-
${
|
|
12
|
+
`,A=$({"section-id":"{{section.id}}","data-id":`${D?.uid}`}),{isOnlyFeatureAllDevices:B,isRenderGalleryGrid:U}=s(E?.position,b?.type),k=U?{}:$({"data-only-image":h("product.media.size > 1","false","true")}),{wrapperClasses:q,productImagesGalleryClasses:J}=f(C),w=j({"gp-grid gp-w-full !gp-m-0 gp-relative":!0}),T=j({"gp-w-full !gp-m-0 gp-relative":!0}),{wrapContainerStyle:x,wrapContainerStyleOnlyOneImage:L,galleryImageStyle:M}=y(E),R=u({shape:E.shape,shapeForBottom:E.shapeForBottom,shapeFor1Col:E.shapeFor1Col,shapeFor2Col:E.shapeFor2Col,shapeForFtOnly:E.shapeForFtOnly,shapeForInsideBottom:E.shapeForInsideBottom??g,shapeForInside:E.shapeForInside??g},E.position),V=a(E.position,R,E?.spacing),W=()=>i`
|
|
13
|
+
${t({uid:D?.uid||"",customProps:O?.[0].customProps},O?.map(e=>{if(e)return i`${r({...e,isInsideProductImage:!0,imageData:{imageShape:G?.ftShape,imageAlign:G?.align,imageLayout:G?.position},dotData:{dotSize:b?.ftDotSize,dotGapToCarousel:b?.ftDotGapToCarousel,dotStyle:b?.ftDotStyle}})}`}))}
|
|
14
|
+
`;return i`
|
|
15
|
+
${v(b?.borderActive?.border!=="none",h("product.media.size > 1",`<style>${F({settings:E,uid:D?.uid,type:"Liquid"})}</style>`),"")}
|
|
16
|
+
${S(`
|
|
17
17
|
{% assign featured_image = product.featured_image %}
|
|
18
18
|
${h("variant != null and variant.featured_image != null","{% assign featured_image = variant.featured_image %}")}
|
|
19
19
|
`)}
|
|
20
20
|
<gp-product-images-v3
|
|
21
|
-
gp-data='${N}'
|
|
22
21
|
${{...A}}
|
|
23
22
|
style="${{...z}}"
|
|
24
23
|
class="${q}"
|
|
25
24
|
>
|
|
25
|
+
<script gp-data type="application/json">${N}</script>
|
|
26
26
|
<div
|
|
27
27
|
class="${h("product.media.size > 1",`${w}`,`${T}`)}"
|
|
28
28
|
style="${h("product.media.size > 1",I(x),I(L))}"
|
|
29
29
|
>
|
|
30
|
-
${
|
|
31
|
-
${
|
|
30
|
+
${p({builderPropUID:`gp-carousel-${D?.uid}`,...E,children:W(),pageContext:_})}
|
|
31
|
+
${v(!B,i`
|
|
32
32
|
<div
|
|
33
33
|
class="${J}"
|
|
34
34
|
style="${I(M)}"
|
|
35
35
|
${{...k}}
|
|
36
36
|
>
|
|
37
37
|
${h("product.media.size > 1",d({builderPropUID:`gp-gallery-${D?.uid}`,...E,pageContext:_}))}
|
|
38
|
-
${
|
|
38
|
+
${v(U,m({builderPropUID:D?.uid,wrapperStyle:{...V},children:W(),...E,pageContext:_}))}
|
|
39
39
|
</div>
|
|
40
40
|
`)}
|
|
41
41
|
</div>
|
|
42
42
|
</gp-product-images-v3>
|
|
43
|
-
${
|
|
43
|
+
${v(e,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-images-v3-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-images-v3-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
44
44
|
`};export{C as default};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gem-sdk/components",
|
|
3
|
-
"version": "19.1.0-staging.
|
|
3
|
+
"version": "19.1.0-staging.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"lint": "oxlint --format=stylish ./src",
|
|
19
19
|
"test": "jest -c ./../../helpers/jest.config.ts",
|
|
20
20
|
"test:watch": "jest -c ./../../helpers/jest.config.ts --watch",
|
|
21
|
-
"type-check": "
|
|
21
|
+
"type-check": "node ../../node_modules/typescript7/bin/tsc --noEmit",
|
|
22
22
|
"format": "prettier --write \"./src/**/*.{ts,tsx}\"",
|
|
23
23
|
"relationship": "rollup -c ./scripts/rollup.config.settings.mjs && node ./scripts/element-relationship/index.js",
|
|
24
24
|
"update-img-src-3rd": "node ./scripts/update-img-src-3rd.js",
|