@gem-sdk/components 19.1.0-staging.10 → 19.1.0-staging.13
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/post-purchase/product/components/product-image/FeatureImage.js +1 -1
- package/dist/cjs/post-purchase/product/components/product-image/carousel-post-purchase/Arrow.js +1 -1
- package/dist/cjs/post-purchase/product/components/product-image/carousel-post-purchase/CarouselWrapperPostPurchase.js +1 -1
- package/dist/cjs/post-purchase/product/components/product-image/layouts/OnlyGalleryImage.js +1 -1
- package/dist/cjs/post-purchase/product/hooks/useNavigationCarouselPostPurchase.js +1 -1
- package/dist/cjs/sticky/common/helper.js +1 -0
- package/dist/cjs/sticky/common/styles.js +1 -1
- package/dist/cjs/sticky/components/Sticky.liquid.js +7 -7
- package/dist/cjs/sticky/hooks/useSticky.js +1 -1
- package/dist/cjs/sticky/settings/configs/settings-v2.js +1 -1
- package/dist/cjs/sticky/settings/configs/ui-v2.js +1 -1
- package/dist/esm/post-purchase/product/components/product-image/FeatureImage.js +1 -1
- package/dist/esm/post-purchase/product/components/product-image/carousel-post-purchase/Arrow.js +1 -1
- package/dist/esm/post-purchase/product/components/product-image/carousel-post-purchase/CarouselWrapperPostPurchase.js +1 -1
- package/dist/esm/post-purchase/product/components/product-image/layouts/OnlyGalleryImage.js +1 -1
- package/dist/esm/post-purchase/product/hooks/useNavigationCarouselPostPurchase.js +1 -1
- package/dist/esm/sticky/common/helper.js +1 -0
- package/dist/esm/sticky/common/styles.js +1 -1
- package/dist/esm/sticky/components/Sticky.liquid.js +7 -7
- package/dist/esm/sticky/hooks/useSticky.js +1 -1
- package/dist/esm/sticky/settings/configs/settings-v2.js +1 -1
- package/dist/esm/sticky/settings/configs/ui-v2.js +1 -1
- package/dist/types/index.d.ts +8 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("./ImageListCarousel.js"),r=require("@gem-sdk/system"),s=require("../../hooks/useFeatureImagePostPurchase.js"),a=require("../../hooks/useSlideCarousel.js"),u=require("../../common/styles.js");exports.default=i=>{let{styles:o,setting:l,gallery:c}=i,d={...l,...o},{ftNavigation:m="none",ftSpacing:n="xtight",layoutType:g,ftAspectRatio:j,ftObjectFit:y,ftWidth:p}=d,{idxActive:x}=s.useFeatureImagePostPurchase({gallery:c}),{itemSlideList:h}=a.useSlideCarousel({layoutType:g}),q=r.createStyle(u.getFeatureImageStyle({ftWidth:p}));return e.jsx("div",{style:q,children:e.jsx(t.default,{...i,productImages:c,aspectRatio:j,objectFit:y,spacing:n,navigation:m,vertical:!1,border:"none",itemPerSlide:h,idxActive:x,type:"feature-image"})})};
|
package/dist/cjs/post-purchase/product/components/product-image/carousel-post-purchase/Arrow.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";var s=require("react/jsx-runtime"),e=require("@gem-sdk/system"),r=require("../../../hooks/useNavigationCarouselPostPurchase.js"),a=require("../../../common/classes.js");exports.ArrowPostPurchase=t=>{let{type:o,navigation:i,vertical:u,hidden:l=!1}=t,{imgSrc:
|
|
2
|
+
"use strict";var s=require("react/jsx-runtime"),e=require("@gem-sdk/system"),r=require("../../../hooks/useNavigationCarouselPostPurchase.js"),a=require("../../../common/classes.js");exports.ArrowPostPurchase=t=>{let{type:o,navigation:i,vertical:u,hidden:l=!1,carouselType:c,productImages:n}=t,{imgSrc:g,handleClick:m,disabled:P}=r.useNavigationCarouselPostPurchase({type:o,vertical:u,productImages:n,carouselType:c}),h=e.createClass(a.getNavigationClass());return"none"===i||l?null:s.jsx("button",{className:h,disabled:P,onClick:m,children:s.jsx("img",{src:g,alt:`gp-arrow-${o}`})})};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";var e=require("react/jsx-runtime"),r=require("react"),s=require("../../../../common/helper.js"),t=require("@gem-sdk/system"),a=require("./Arrow.js"),o=require("./CarouselPostPurchase.js"),u=require("../../../hooks/useCarousel.js"),c=require("../../../common/classes.js"),i=require("../../../common/styles.js");exports.CarouselWrapperPostPurchase=({styles:l,setting:n,productImages:m,objectFit:
|
|
2
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),s=require("../../../../common/helper.js"),t=require("@gem-sdk/system"),a=require("./Arrow.js"),o=require("./CarouselPostPurchase.js"),u=require("../../../hooks/useCarousel.js"),c=require("../../../common/classes.js"),i=require("../../../common/styles.js");exports.CarouselWrapperPostPurchase=({styles:l,setting:n,productImages:m,objectFit:p="cover",aspectRatio:g,itemPerSlide:h=1,spacing:j,navigation:P="none",vertical:d=!1,border:y="none",idxActive:q,type:v})=>{let x={...l,...n},{layoutType:C}=x||{},{setMoveToIdx:I,setMaxIdx:f}=u.useCarousel(),w=s.postPurchaseSpacing[j||"none"]??"0px",b="one-col"===C,A=t.createClass(c.getImageListClass()),S=t.createStyle(i.getImageListStyle({gap:w,vertical:d}));return r.useEffect(()=>{let e=m.length-Number(h||0);f(e)},[m.length,h,f]),r.useEffect(()=>{(q||0===q)&&1===h&&I(q)},[q,h,I]),e.jsxs("div",{className:A,style:S,children:[e.jsx(a.ArrowPostPurchase,{type:"prev",productImages:m,navigation:P,carouselType:v,vertical:d,hidden:b}),e.jsx(o.CarouselPostPurchase,{productImages:m,itemPerRow:h,border:y,aspectRatio:g,objectFit:p,vertical:d}),e.jsx(a.ArrowPostPurchase,{type:"next",productImages:m,navigation:P,carouselType:v,vertical:d,hidden:b})]})};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../ImageListGrid.js"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../ImageListGrid.js"),s=require("../ImageListCarousel.js"),r=require("@gem-sdk/system"),i=require("../../../hooks/useProductImagePostPurchase.js"),a=require("../../../common/classes.js");exports.default=o=>{let{setting:u,styles:l,gallery:c}=o,d={...u,...l},{isImageListCarousel:m}=i.useProductImagePostPurchase({imageList:c,setting:u}),g=r.createClass(a.getOnlyFeatureLayoutClass());return e.jsx("div",{className:g,children:m?e.jsx(s.default,{...o,productImages:c,aspectRatio:d?.ilAspectRatio,objectFit:d.ilObjectFit,spacing:d.ilSpacing,navigation:d?.ilNavigation,vertical:d?.layoutType!=="bottom-center",border:d?.ilBorder,itemPerSlide:d?.ilItemPerSlide,type:"images-list"}):e.jsx(t.default,{...o,productImages:c})})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react"),r=require("../constants/index.js"),
|
|
1
|
+
"use strict";var e=require("react"),r=require("../constants/index.js"),t=require("./useCarousel.js"),s=require("@gem-sdk/core");exports.useNavigationCarouselPostPurchase=u=>{let{moveToIdx:a,maxIdx:o,setMoveToIdx:i}=t.useCarousel(),l=s.useProductStore(e=>e.setProductFeaturedImage),{type:c,vertical:d}=u,n="next"==c?a>=o:0===a,P=e.useMemo(()=>r.BUTTON_URL_MAP_POST_PURCHASE[c][d?"vertical":"horizontal"][n?"disabled":"enabled"],[c,d,n]);return{imgSrc:P,handleClick:()=>{let e="next"===c?a+1:a-1;if(i(e),"feature-image"===u.carouselType){let r=u.productImages?.[e];r&&l(r)}},disabled:n}};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const e=e=>e.trim()?(e.startsWith("#el-")?e.replace("#el-","#"):e).replace(/^#/,"").trim():"",t=({value:t})=>e(t?.link??""),r=({value:e})=>t({value:e}).length>0,i=({value:e})=>{let r=t({value:e});if(!r)return null;let i=r.replace(/\\/g,"\\\\").replace(/"/g,'\\"'),l=window.CSS?.escape?window.CSS.escape(r):i;return document.querySelector(`[data-id="${i}"], #${l}`)},l=({value:e})=>{let t=i({value:e});if(!t)return;let r=t.getBoundingClientRect();if(0===r.width&&0===r.height)return;let l=window.innerHeight,n=r.top+window.scrollY,o=r.height>l;return o?{triggerY:n,ready:r.top<=0&&r.bottom>0}:{triggerY:n+r.height-l,ready:r.top>=0&&r.bottom<=l}};exports.getScrollPercent=()=>{let e=document.documentElement,t=e.scrollHeight-window.innerHeight;return t<=0?100:window.scrollY/t*100},exports.getSectionElement=i,exports.getSectionId=t,exports.getSectionTrigger=l,exports.hasSectionValue=r,exports.isVisibleBetweenSections=({showFrom:e,hideFrom:t})=>{let i=r({value:e}),n=r({value:t});if(!i&&!n)return!0;let o=i?l({value:e}):void 0,g=n?l({value:t}):void 0;if(o?.ready&&g?.ready)return!0;let c=window.scrollY;if(i&&!o)return!1;let u=o?.triggerY??-1/0,d=g?.triggerY??1/0;return i&&!n?c>=u:!i&&n?c<d:u===d||(u<d?c>=u&&c<d:c<d||c>=u)};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("@gem-sdk/core");require("react/jsx-runtime"),require("react");var t=require("../../common/const.js"),l=require("../../helpers.js"),r=require("../settings/configs/translate.js");const
|
|
1
|
+
"use strict";var e=require("@gem-sdk/core");require("react/jsx-runtime"),require("react");var t=require("../../common/const.js"),l=require("../../helpers.js"),r=require("../settings/configs/translate.js"),a=require("./helper.js");const o=e=>"top"==e?"sticky":"fixed",s=(e,t,l,r)=>{let s={[`--top${e}`]:"auto",[`--${l+e}`]:"0",[`--pos${e}`]:o(l)};switch(t){case"after-first-cart-button":case"after-first-scroll":s[`--d${e}`]="none";break;case"always":s[`--d${e}`]="block";break;case"between-sections":s[`--d${e}`]=a.hasSectionValue({value:r})?"none":"block"}return s},i=(e,t,l)=>({...s("",e?.desktop,t?.desktop,l),...s("-tablet",e?.tablet??e?.desktop,t?.tablet??t?.desktop,l),...s("-mobile",e?.mobile??e?.tablet??e?.desktop,t?.mobile??t?.tablet??t?.desktop,l)}),p=(e,t)=>({[`--left${t}`]:"top"==e?"0":"50%",[`--t${t}`]:"top"==e?"unset":"translateX(-50%)"}),b=e=>({...p(e?.desktop,""),...p(e?.tablet??e?.desktop,"-tablet"),...p(e?.mobile??e?.tablet??e?.desktop,"-mobile")}),n=e=>{let t={};return["--pt","--pb","--pr","--pl","--pt-mobile","--pb-mobile","--pr-mobile","--pl-mobile","--pt-tablet","--pb-tablet","--pr-tablet","--pl-tablet"].forEach(l=>{e?.[l]&&(t[l]=e[l])}),t},c=e=>{let t={...e};return["--pt","--pb","--pr","--pl","--pt-mobile","--pb-mobile","--pr-mobile","--pl-mobile","--pt-tablet","--pb-tablet","--pr-tablet","--pl-tablet"].forEach(e=>{delete t?.[e]}),t};exports.displayConditionStyle=i,exports.filterStyles=c,exports.getContainerStyles=e=>{let{position:l,display:r,showFrom:a}=e;return{margin:"0 auto",...b(l),...i(r,l,a),"z-index":t.ELEMENT_Z_INDEX.STICKY}},exports.getContentStyles=({setting:t,style:a,uid:o,pageContext:s,type:i="React"})=>{let{background:p}=t||{},b="Liquid"===i?l.getBackgroundTranslated({background:p,uid:o,enableTranslate:!!r.Sticky?.background?.id,pageContext:s,isTranslateVideo:!1}):p;return{...e.makeStyle({m:"0 auto"}),...n(a),...c(a),...e.getStyleBackgroundByDevice(b||p),...e.getGradientImageBgrStyleByDevice(b||p)}},exports.getDisplayStyle=s,exports.getStylePadding=n;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("@gem-sdk/system"),a=require("../common/styles.js"),r=require("../common/classes.js");exports.default=({children:i,builderAttrs:l,setting:d,style:n,builderProps:o,advanced:p,pageContext:c})=>{let{width:g,position:m,display:y,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("@gem-sdk/system"),a=require("../common/styles.js"),r=require("../common/classes.js");exports.default=({children:i,builderAttrs:l,setting:d,style:n,builderProps:o,advanced:p,pageContext:c})=>{let{width:g,position:m,display:y,scrollPercent:u,showFrom:$,hideFrom:k,preloadBgImage:f,background:S,isScrollToTop:b}=d??{},v=p?.d,C=s.createStyle({...e.makeStyleResponsive("w",g),...a.getContainerStyles({position:m,display:y,showFrom:$})}),R=s.createStyle(a.getContentStyles({setting:d,style:n,uid:o?.uid,pageContext:c??{},type:"Liquid"})),j=s.createClass(r.getContainerClasses({uid:o?.uid,isScrollToTop:b,cssClass:p?.cssClass,isLiquid:!0})),q=s.createStateOrContext({uid:o?.uid,setting:{display:{desktop:y?.desktop,tablet:y?.tablet??y?.desktop,mobile:y?.mobile??y?.tablet??y?.desktop},scrollPercent:u,showFrom:$,hideFrom:k},advanced:{d:v}}),I=`.drawer-page-content {
|
|
2
2
|
transform: none !important;
|
|
3
3
|
-webkit-transform: none !important;
|
|
4
4
|
}`;return e.template`
|
|
5
|
-
${e.RenderIf(!!
|
|
5
|
+
${e.RenderIf(!!f,`${e.RenderIf(!!S?.desktop?.image?.src,`<link rel="preload" href="${S?.desktop?.image?.src}" as="image" />`)}${e.RenderIf(!!S?.tablet?.image?.src,`<link rel="preload" href="${S?.tablet?.image?.src}" as="image" />`)}${e.RenderIf(!!S?.mobile?.image?.src,`<link rel="preload" href="${S?.mobile?.image?.src}" as="image" />`)}`)}
|
|
6
6
|
<gp-sticky
|
|
7
7
|
id="${o?.uid}"
|
|
8
8
|
data-id="${o?.uid}"
|
|
9
|
-
class="${
|
|
10
|
-
style="${
|
|
9
|
+
class="${j} ${t.getSettingPreloadData("gps-lazy")}"
|
|
10
|
+
style="${C}"
|
|
11
11
|
>
|
|
12
|
-
<script gp-data type="application/json">${JSON.stringify(
|
|
13
|
-
<style>${
|
|
14
|
-
<div ${{...l}} style="${{...
|
|
12
|
+
<script gp-data type="application/json">${JSON.stringify(q)}</script>
|
|
13
|
+
<style>${I}</style>
|
|
14
|
+
<div ${{...l}} style="${{...R}}">
|
|
15
15
|
${i}
|
|
16
16
|
</div>
|
|
17
17
|
</gp-sticky>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("react");exports.default=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("react"),o=require("../common/helper.js");exports.default=i=>{let{width:s,position:n,display:l,scrollPercent:r,showFrom:a,hideFrom:c}=i??{},d=e.makeStyleResponsive("w",s),b=e.usePageStore(e=>"interaction"===e.sidebarMode),u=e.useCurrentDevice(),p=e.useEditorMode(),[m,k]=t.useState(!1),f=e.useStickyStore(e=>e.getFirstVisibleElement(u)),w=({position:e,device:t})=>({[`--left${t}`]:"top"==e?"0":"50%",[`--t${t}`]:"top"==e?"unset":"translateX(-50%)"}),v=t.useMemo(()=>({...w({position:n?.desktop,device:""}),...w({position:n?.tablet??n?.desktop,device:"-tablet"}),...w({position:n?.mobile??n?.tablet??n?.desktop,device:"-mobile"})}),[n?.desktop,n?.mobile,n?.tablet]),S=t.useMemo(()=>{if(b&&n?.[u]==="top")return"40px"},[u,b,n]),[h,E]=t.useState(null),V=a?.link,g=c?.link;t.useEffect(()=>{if(E(null),"edit"===p)return;let e=[l?.desktop,l?.tablet,l?.mobile],t=e.some(e=>"after-first-scroll"===e||"between-sections"===e);if(!t)return;let i=()=>({isScrollPercentReached:o.getScrollPercent()>=(r??0),isBetweenSectionsVisible:o.isVisibleBetweenSections({showFrom:{link:V},hideFrom:{link:g}})}),s=()=>{let e=i();E(t=>t&&t.isScrollPercentReached===e.isScrollPercentReached&&t.isBetweenSectionsVisible===e.isBetweenSectionsVisible?t:e)};s();let n=0,a=()=>{n||(n=requestAnimationFrame(()=>{n=0,s()}))};return window.addEventListener("scroll",a,{passive:!0}),window.addEventListener("resize",a),window.addEventListener("orientationchange",a),()=>{n&&cancelAnimationFrame(n),window.removeEventListener("scroll",a),window.removeEventListener("resize",a),window.removeEventListener("orientationchange",a)}},[p,l?.desktop,l?.tablet,l?.mobile,V,g,r]);let M=t.useMemo(()=>{let e=({displayValue:e})=>{switch(e){case"after-first-cart-button":return m?"block":"none";case"after-first-scroll":if(!h)return"none";return h.isScrollPercentReached?"block":"none";case"between-sections":if(!h)return o.hasSectionValue({value:a})?"none":"block";return h.isBetweenSectionsVisible?"block":"none";default:return"block"}},t=l?.desktop,i=l?.tablet??t,s=l?.mobile??i;return{"--d":e({displayValue:t}),"--d-tablet":e({displayValue:i}),"--d-mobile":e({displayValue:s})}},[l?.desktop,l?.mobile,l?.tablet,g,V,h,m]),x=t.useMemo(()=>({"--top":S??"auto","--top-tablet":S??"auto","--top-mobile":S??"auto",[`--${n?.desktop}`]:S??"0px",[`--${n?.tablet??n?.desktop}-tablet`]:S??"0px",[`--${n?.mobile??n?.tablet??n?.desktop}-mobile`]:S??"0px"}),[S,n?.desktop,n?.mobile,n?.tablet]),y=({position:e})=>"top"==e?"sticky":"fixed",P=t.useMemo(()=>({"--pos":y({position:n?.desktop}),"--pos-tablet":y({position:n?.tablet??n?.desktop}),"--pos-mobile":y({position:n?.mobile??n?.tablet??n?.desktop})}),[n?.desktop,n?.mobile,n?.tablet]);return t.useEffect(()=>{if(!f)return;let e=new IntersectionObserver(([e])=>{e&&k(e.isIntersecting||e.boundingClientRect.top<=0)});return e.observe(f),()=>e.disconnect()},[f]),t.useEffect(()=>{k(!1)},[u]),{w:d,displayStyle:x,positionStyle:P,getCSSAlign:v,makeDisplaySettingStyles:M}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";exports.StickySettingsV2=[{id:"setting",controls:[{id:"fullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!0},tablet:{default:!0},mobile:{default:!0}}},{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,isRowWith:!0,devices:{desktop:{default:"100%"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"1200px",showValue:!0}]},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#dddddd",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",preload:!1,loop:!0}}}},{id:"preloadBgImage",type:"toggle",label:"Preload Image",default:!1},{id:"position",label:"Layout",type:"layout-selector",iconViewBox:"0 0 76 48",itemPerRow:2,itemSpacing:"large",enableItemBackground:!0,enableItemOpacity:!0,options:[{label:"Bottom",value:"bottom",iconName:"gp-sticky-position-bottom"},{label:"Top",value:"top",iconName:"gp-sticky-position-top"}],devices:{desktop:{default:"bottom"}}},{id:"display",label:"Display",type:"select",devices:{desktop:{default:"always"}},options:[{label:"Always show",value:"always"},{label:"After first cart button",value:"after-first-cart-button"}]},{id:"isScrollToTop",type:"toggle",default:!1}]}];
|
|
1
|
+
"use strict";exports.StickySettingsV2=[{id:"setting",controls:[{id:"fullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!0},tablet:{default:!0},mobile:{default:!0}}},{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,isRowWith:!0,devices:{desktop:{default:"100%"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"1200px",showValue:!0}]},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#dddddd",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",preload:!1,loop:!0}}}},{id:"preloadBgImage",type:"toggle",label:"Preload Image",default:!1},{id:"position",label:"Layout",type:"layout-selector",iconViewBox:"0 0 76 48",itemPerRow:2,itemSpacing:"large",enableItemBackground:!0,enableItemOpacity:!0,options:[{label:"Bottom",value:"bottom",iconName:"gp-sticky-position-bottom"},{label:"Top",value:"top",iconName:"gp-sticky-position-top"}],devices:{desktop:{default:"bottom"}}},{id:"display",label:"Display",type:"select",devices:{desktop:{default:"always"}},options:[{label:"Always show",value:"always"},{label:"After first cart button",value:"after-first-cart-button"},{label:"After scrolling down",value:"after-first-scroll"},{label:"Between sections",value:"between-sections"}]},{id:"scrollPercent",type:"input:unit",units:["%"],min:0,max:100,placeholder:"0%",isNumber:!0},{id:"showFrom",type:"pick-link",optionConfig:{"scroll-to":{popoverLabel:"Show Sticky ATC start from",title:"",hideScrollToTop:!0}},default:{type:"scroll-to",link:""},isHiddenOpenLinkSelect:!0,hiddenOptions:{"stay-on-page":!0,"open-page":!0,"open-url":!0,"open-popup":!0,"go-to-sales-page":!0}},{id:"hideFrom",type:"pick-link",optionConfig:{"scroll-to":{popoverLabel:"Hide Sticky ATC start from",title:"",hideScrollToTop:!0}},default:{type:"scroll-to",link:""},isHiddenOpenLinkSelect:!0,hiddenOptions:{"stay-on-page":!0,"open-page":!0,"open-url":!0,"open-popup":!0,"go-to-sales-page":!0}},{id:"isScrollToTop",type:"toggle",default:!1}]}];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";exports.SettingUIV2=[{label:"Layout",controls:[{setting:{id:"position"},layout:"vertical"}]},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"width"},label:"Width"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{type:"custom",top:"16px",bottom:"16px",left:"24px",right:"24px"}}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preloadBgImage"}]},controlChangeTrigger:{settings:[{action:{controlId:"preloadBgImage",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",controlConfig:{id:"border-advanced",type:"border-v2",linkWithSetting:{name:"border",field:"normal"},compoDefaultValue:{color:"line-3",border:"solid",width:"1px",borderWidth:"1px"}}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Display option",controls:[{label:"Condition",setting:{id:"display"}}]}];
|
|
1
|
+
"use strict";exports.SettingUIV2=[{label:"Layout",controls:[{setting:{id:"position"},layout:"vertical"}]},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"width"},label:"Width"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{type:"custom",top:"16px",bottom:"16px",left:"24px",right:"24px"}}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preloadBgImage"}]},controlChangeTrigger:{settings:[{action:{controlId:"preloadBgImage",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",controlConfig:{id:"border-advanced",type:"border-v2",linkWithSetting:{name:"border",field:"normal"},compoDefaultValue:{color:"line-3",border:"solid",width:"1px",borderWidth:"1px"}}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Display option",controls:[{label:"Condition",setting:{id:"display"}},{label:"Page scrolled",conditionDisplay:"display === 'after-first-scroll'",setting:{id:"scrollPercent"}},{label:"Show from",conditionDisplay:"display === 'between-sections'",setting:{id:"showFrom"}},{label:"Hide from",conditionDisplay:"display === 'between-sections'",setting:{id:"hideFrom"}}]}];
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as e}from"react/jsx-runtime";import t from"./ImageListCarousel.js";import{createStyle as o}from"@gem-sdk/system";import{useFeatureImagePostPurchase as r}from"../../hooks/useFeatureImagePostPurchase.js";import{useSlideCarousel as s}from"../../hooks/useSlideCarousel.js";import{getFeatureImageStyle as i}from"../../common/styles.js";let m=m=>{let{styles:a,setting:
|
|
2
|
+
import{jsx as e}from"react/jsx-runtime";import t from"./ImageListCarousel.js";import{createStyle as o}from"@gem-sdk/system";import{useFeatureImagePostPurchase as r}from"../../hooks/useFeatureImagePostPurchase.js";import{useSlideCarousel as s}from"../../hooks/useSlideCarousel.js";import{getFeatureImageStyle as i}from"../../common/styles.js";let m=m=>{let{styles:a,setting:u,gallery:l}=m,n={...u,...a},{ftNavigation:p="none",ftSpacing:c="xtight",layoutType:d,ftAspectRatio:g,ftObjectFit:f,ftWidth:j}=n,{idxActive:h}=r({gallery:l}),{itemSlideList:v}=s({layoutType:d}),x=o(i({ftWidth:j}));return e("div",{style:x,children:e(t,{...m,productImages:l,aspectRatio:g,objectFit:f,spacing:c,navigation:p,vertical:!1,border:"none",itemPerSlide:v,idxActive:h,type:"feature-image"})})};export{m as default};
|
package/dist/esm/post-purchase/product/components/product-image/carousel-post-purchase/Arrow.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as o}from"react/jsx-runtime";import{createClass as r}from"@gem-sdk/system";import{useNavigationCarouselPostPurchase as s}from"../../../hooks/useNavigationCarouselPostPurchase.js";import{getNavigationClass as e}from"../../../common/classes.js";let t=t=>{let{type:m,navigation:a,vertical:i,hidden:l=!1}=t,{imgSrc:
|
|
2
|
+
import{jsx as o}from"react/jsx-runtime";import{createClass as r}from"@gem-sdk/system";import{useNavigationCarouselPostPurchase as s}from"../../../hooks/useNavigationCarouselPostPurchase.js";import{getNavigationClass as e}from"../../../common/classes.js";let t=t=>{let{type:m,navigation:a,vertical:i,hidden:l=!1,carouselType:n,productImages:c}=t,{imgSrc:u,handleClick:p,disabled:d}=s({type:m,vertical:i,productImages:c,carouselType:n}),f=r(e());return"none"===a||l?null:o("button",{className:f,disabled:d,onClick:p,children:o("img",{src:u,alt:`gp-arrow-${m}`})})};export{t as ArrowPostPurchase};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useEffect as r}from"react";import{postPurchaseSpacing as t}from"../../../../common/helper.js";import{createClass as m,createStyle as s}from"@gem-sdk/system";import{ArrowPostPurchase as
|
|
2
|
+
import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useEffect as r}from"react";import{postPurchaseSpacing as t}from"../../../../common/helper.js";import{createClass as m,createStyle as s}from"@gem-sdk/system";import{ArrowPostPurchase as a}from"./Arrow.js";import{CarouselPostPurchase as i}from"./CarouselPostPurchase.js";import{useCarousel as p}from"../../../hooks/useCarousel.js";import{getImageListClass as c}from"../../../common/classes.js";import{getImageListStyle as n}from"../../../common/styles.js";let l=({styles:l,setting:u,productImages:d,objectFit:f="cover",aspectRatio:g,itemPerSlide:h=1,spacing:j,navigation:v="none",vertical:y=!1,border:P="none",idxActive:x,type:b})=>{let C={...l,...u},{layoutType:I}=C||{},{setMoveToIdx:k,setMaxIdx:w}=p(),N=t[j||"none"]??"0px",R="one-col"===I,T=m(c()),A=s(n({gap:N,vertical:y}));return r(()=>{let e=d.length-Number(h||0);w(e)},[d.length,h,w]),r(()=>{(x||0===x)&&1===h&&k(x)},[x,h,k]),e("div",{className:T,style:A,children:[o(a,{type:"prev",productImages:d,navigation:v,carouselType:b,vertical:y,hidden:R}),o(i,{productImages:d,itemPerRow:h,border:P,aspectRatio:g,objectFit:f,vertical:y}),o(a,{type:"next",productImages:d,navigation:v,carouselType:b,vertical:y,hidden:R})]})};export{l as CarouselWrapperPostPurchase};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as e}from"react/jsx-runtime";import t from"../ImageListGrid.js";import i from"../ImageListCarousel.js";import{createClass as r}from"@gem-sdk/system";import{useProductImagePostPurchase as o}from"../../../hooks/useProductImagePostPurchase.js";import{getOnlyFeatureLayoutClass as m}from"../../../common/classes.js";let
|
|
2
|
+
import{jsx as e}from"react/jsx-runtime";import t from"../ImageListGrid.js";import i from"../ImageListCarousel.js";import{createClass as r}from"@gem-sdk/system";import{useProductImagePostPurchase as o}from"../../../hooks/useProductImagePostPurchase.js";import{getOnlyFeatureLayoutClass as m}from"../../../common/classes.js";let s=s=>{let{setting:a,styles:l,gallery:c}=s,p={...a,...l},{isImageListCarousel:g}=o({imageList:c,setting:a}),d=r(m());return e("div",{className:d,children:g?e(i,{...s,productImages:c,aspectRatio:p?.ilAspectRatio,objectFit:p.ilObjectFit,spacing:p.ilSpacing,navigation:p?.ilNavigation,vertical:p?.layoutType!=="bottom-center",border:p?.ilBorder,itemPerSlide:p?.ilItemPerSlide,type:"images-list"}):e(t,{...s,productImages:c})})};export{s as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useMemo as e}from"react";import{BUTTON_URL_MAP_POST_PURCHASE as
|
|
1
|
+
import{useMemo as e}from"react";import{BUTTON_URL_MAP_POST_PURCHASE as t}from"../constants/index.js";import{useCarousel as r}from"./useCarousel.js";import{useProductStore as o}from"@gem-sdk/core";let a=a=>{let{moveToIdx:s,maxIdx:i,setMoveToIdx:l}=r(),m=o(e=>e.setProductFeaturedImage),{type:u,vertical:n}=a,c="next"==u?s>=i:0===s,d=e(()=>t[u][n?"vertical":"horizontal"][c?"disabled":"enabled"],[u,n,c]);return{imgSrc:d,handleClick:()=>{let e="next"===u?s+1:s-1;if(l(e),"feature-image"===a.carouselType){let t=a.productImages?.[e];t&&m(t)}},disabled:c}};export{a as useNavigationCarouselPostPurchase};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let e=e=>e.trim()?(e.startsWith("#el-")?e.replace("#el-","#"):e).replace(/^#/,"").trim():"",t=({value:t})=>e(t?.link??""),r=({value:e})=>t({value:e}).length>0,i=({value:e})=>{let r=t({value:e});if(!r)return null;let i=r.replace(/\\/g,"\\\\").replace(/"/g,'\\"'),l=window.CSS?.escape?window.CSS.escape(r):i;return document.querySelector(`[data-id="${i}"], #${l}`)},l=({value:e})=>{let t=i({value:e});if(!t)return;let r=t.getBoundingClientRect();if(0===r.width&&0===r.height)return;let l=window.innerHeight,n=r.top+window.scrollY,o=r.height>l;return o?{triggerY:n,ready:r.top<=0&&r.bottom>0}:{triggerY:n+r.height-l,ready:r.top>=0&&r.bottom<=l}},n=()=>{let e=document.documentElement,t=e.scrollHeight-window.innerHeight;return t<=0?100:window.scrollY/t*100},o=({showFrom:e,hideFrom:t})=>{let i=r({value:e}),n=r({value:t});if(!i&&!n)return!0;let o=i?l({value:e}):void 0,g=n?l({value:t}):void 0;if(o?.ready&&g?.ready)return!0;let c=window.scrollY;if(i&&!o)return!1;let d=o?.triggerY??-1/0,u=g?.triggerY??1/0;return i&&!n?c>=d:!i&&n?c<u:d===u||(d<u?c>=d&&c<u:c<u||c>=d)};export{n as getScrollPercent,i as getSectionElement,t as getSectionId,l as getSectionTrigger,r as hasSectionValue,o as isVisibleBetweenSections};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{getGradientImageBgrStyleByDevice as t,getStyleBackgroundByDevice as e,makeStyle as l}from"@gem-sdk/core";import"react/jsx-runtime";import"react";import{ELEMENT_Z_INDEX as o}from"../../common/const.js";import{getBackgroundTranslated as
|
|
1
|
+
import{getGradientImageBgrStyleByDevice as t,getStyleBackgroundByDevice as e,makeStyle as l}from"@gem-sdk/core";import"react/jsx-runtime";import"react";import{ELEMENT_Z_INDEX as o}from"../../common/const.js";import{getBackgroundTranslated as r}from"../../helpers.js";import{Sticky as a}from"../settings/configs/translate.js";import{hasSectionValue as p}from"./helper.js";let s=t=>"top"==t?"sticky":"fixed",b=(t,e,l,o)=>{let r={[`--top${t}`]:"auto",[`--${l+t}`]:"0",[`--pos${t}`]:s(l)};switch(e){case"after-first-cart-button":case"after-first-scroll":r[`--d${t}`]="none";break;case"always":r[`--d${t}`]="block";break;case"between-sections":r[`--d${t}`]=p({value:o})?"none":"block"}return r},i=(t,e,l)=>({...b("",t?.desktop,e?.desktop,l),...b("-tablet",t?.tablet??t?.desktop,e?.tablet??e?.desktop,l),...b("-mobile",t?.mobile??t?.tablet??t?.desktop,e?.mobile??e?.tablet??e?.desktop,l)}),n=(t,e)=>({[`--left${e}`]:"top"==t?"0":"50%",[`--t${e}`]:"top"==t?"unset":"translateX(-50%)"}),m=t=>({...n(t?.desktop,""),...n(t?.tablet??t?.desktop,"-tablet"),...n(t?.mobile??t?.tablet??t?.desktop,"-mobile")}),d=t=>{let{position:e,display:l,showFrom:r}=t;return{margin:"0 auto",...m(e),...i(l,e,r),"z-index":o.STICKY}},c=({setting:o,style:p,uid:s,pageContext:b,type:i="React"})=>{let{background:n}=o||{},m="Liquid"===i?r({background:n,uid:s,enableTranslate:!!a?.background?.id,pageContext:b,isTranslateVideo:!1}):n;return{...l({m:"0 auto"}),...k(p),...f(p),...e(m||n),...t(m||n)}},k=t=>{let e={};return["--pt","--pb","--pr","--pl","--pt-mobile","--pb-mobile","--pr-mobile","--pl-mobile","--pt-tablet","--pb-tablet","--pr-tablet","--pl-tablet"].forEach(l=>{t?.[l]&&(e[l]=t[l])}),e},f=t=>{let e={...t};return["--pt","--pb","--pr","--pl","--pt-mobile","--pb-mobile","--pr-mobile","--pl-mobile","--pt-tablet","--pb-tablet","--pr-tablet","--pl-tablet"].forEach(t=>{delete e?.[t]}),e};export{i as displayConditionStyle,f as filterStyles,d as getContainerStyles,c as getContentStyles,b as getDisplayStyle,k as getStylePadding};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import{makeStyleResponsive as s,RenderIf as e,isLocalEnv as t,baseAssetURL as i,template as r}from"@gem-sdk/core";import{getSettingPreloadData as a}from"../../helpers.js";import{createStyle as l,createClass as d,createStateOrContext as o}from"@gem-sdk/system";import{getContainerStyles as p,getContentStyles as m}from"../common/styles.js";import{getContainerClasses as c}from"../common/classes.js";let n=({children:n,builderAttrs:g,setting:$,style:k,builderProps:y,advanced:f,pageContext:u})=>{let{width:b,position:v,display:S,
|
|
1
|
+
import{makeStyleResponsive as s,RenderIf as e,isLocalEnv as t,baseAssetURL as i,template as r}from"@gem-sdk/core";import{getSettingPreloadData as a}from"../../helpers.js";import{createStyle as l,createClass as d,createStateOrContext as o}from"@gem-sdk/system";import{getContainerStyles as p,getContentStyles as m}from"../common/styles.js";import{getContainerClasses as c}from"../common/classes.js";let n=({children:n,builderAttrs:g,setting:$,style:k,builderProps:y,advanced:f,pageContext:u})=>{let{width:b,position:v,display:S,scrollPercent:j,showFrom:h,hideFrom:E,preloadBgImage:w,background:C,isScrollToTop:q}=$??{},x=f?.d,A=l({...s("w",b),...p({position:v,display:S,showFrom:h})}),G=l(m({setting:$,style:k,uid:y?.uid,pageContext:u??{},type:"Liquid"})),L=d(c({uid:y?.uid,isScrollToTop:q,cssClass:f?.cssClass,isLiquid:!0})),N=o({uid:y?.uid,setting:{display:{desktop:S?.desktop,tablet:S?.tablet??S?.desktop,mobile:S?.mobile??S?.tablet??S?.desktop},scrollPercent:j,showFrom:h,hideFrom:E},advanced:{d:x}}),O=`.drawer-page-content {
|
|
2
2
|
transform: none !important;
|
|
3
3
|
-webkit-transform: none !important;
|
|
4
4
|
}`;return r`
|
|
5
|
-
${e(!!
|
|
5
|
+
${e(!!w,`${e(!!C?.desktop?.image?.src,`<link rel="preload" href="${C?.desktop?.image?.src}" as="image" />`)}${e(!!C?.tablet?.image?.src,`<link rel="preload" href="${C?.tablet?.image?.src}" as="image" />`)}${e(!!C?.mobile?.image?.src,`<link rel="preload" href="${C?.mobile?.image?.src}" as="image" />`)}`)}
|
|
6
6
|
<gp-sticky
|
|
7
7
|
id="${y?.uid}"
|
|
8
8
|
data-id="${y?.uid}"
|
|
9
|
-
class="${
|
|
10
|
-
style="${
|
|
9
|
+
class="${L} ${a("gps-lazy")}"
|
|
10
|
+
style="${A}"
|
|
11
11
|
>
|
|
12
|
-
<script gp-data type="application/json">${JSON.stringify(
|
|
13
|
-
<style>${
|
|
14
|
-
<div ${{...g}} style="${{...
|
|
12
|
+
<script gp-data type="application/json">${JSON.stringify(N)}</script>
|
|
13
|
+
<style>${O}</style>
|
|
14
|
+
<div ${{...g}} style="${{...G}}">
|
|
15
15
|
${n}
|
|
16
16
|
</div>
|
|
17
17
|
</gp-sticky>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{makeStyleResponsive as
|
|
1
|
+
import{makeStyleResponsive as e,usePageStore as t,useCurrentDevice as o,useEditorMode as i,useStickyStore as n}from"@gem-sdk/core";import{useState as l,useMemo as s,useEffect as r}from"react";import{hasSectionValue as a,isVisibleBetweenSections as d,getScrollPercent as b}from"../common/helper.js";let c=c=>{let{width:p,position:m,display:u,scrollPercent:k,showFrom:w,hideFrom:f}=c??{},v=e("w",p),h=t(e=>"interaction"===e.sidebarMode),S=o(),V=i(),[E,g]=l(!1),x=n(e=>e.getFirstVisibleElement(S)),L=({position:e,device:t})=>({[`--left${t}`]:"top"==e?"0":"50%",[`--t${t}`]:"top"==e?"unset":"translateX(-50%)"}),y=s(()=>({...L({position:m?.desktop,device:""}),...L({position:m?.tablet??m?.desktop,device:"-tablet"}),...L({position:m?.mobile??m?.tablet??m?.desktop,device:"-mobile"})}),[m?.desktop,m?.mobile,m?.tablet]),F=s(()=>{if(h&&m?.[S]==="top")return"40px"},[S,h,m]),[R,$]=l(null),B=w?.link,P=f?.link;r(()=>{if($(null),"edit"===V)return;let e=[u?.desktop,u?.tablet,u?.mobile],t=e.some(e=>"after-first-scroll"===e||"between-sections"===e);if(!t)return;let o=()=>({isScrollPercentReached:b()>=(k??0),isBetweenSectionsVisible:d({showFrom:{link:B},hideFrom:{link:P}})}),i=()=>{let e=o();$(t=>t&&t.isScrollPercentReached===e.isScrollPercentReached&&t.isBetweenSectionsVisible===e.isBetweenSectionsVisible?t:e)};i();let n=0,l=()=>{n||(n=requestAnimationFrame(()=>{n=0,i()}))};return window.addEventListener("scroll",l,{passive:!0}),window.addEventListener("resize",l),window.addEventListener("orientationchange",l),()=>{n&&cancelAnimationFrame(n),window.removeEventListener("scroll",l),window.removeEventListener("resize",l),window.removeEventListener("orientationchange",l)}},[V,u?.desktop,u?.tablet,u?.mobile,B,P,k]);let z=s(()=>{let e=({displayValue:e})=>{switch(e){case"after-first-cart-button":return E?"block":"none";case"after-first-scroll":if(!R)return"none";return R.isScrollPercentReached?"block":"none";case"between-sections":if(!R)return a({value:w})?"none":"block";return R.isBetweenSectionsVisible?"block":"none";default:return"block"}},t=u?.desktop,o=u?.tablet??t,i=u?.mobile??o;return{"--d":e({displayValue:t}),"--d-tablet":e({displayValue:o}),"--d-mobile":e({displayValue:i})}},[u?.desktop,u?.mobile,u?.tablet,P,B,R,E]),A=s(()=>({"--top":F??"auto","--top-tablet":F??"auto","--top-mobile":F??"auto",[`--${m?.desktop}`]:F??"0px",[`--${m?.tablet??m?.desktop}-tablet`]:F??"0px",[`--${m?.mobile??m?.tablet??m?.desktop}-mobile`]:F??"0px"}),[F,m?.desktop,m?.mobile,m?.tablet]),I=({position:e})=>"top"==e?"sticky":"fixed",j=s(()=>({"--pos":I({position:m?.desktop}),"--pos-tablet":I({position:m?.tablet??m?.desktop}),"--pos-mobile":I({position:m?.mobile??m?.tablet??m?.desktop})}),[m?.desktop,m?.mobile,m?.tablet]);return r(()=>{if(!x)return;let e=new IntersectionObserver(([e])=>{e&&g(e.isIntersecting||e.boundingClientRect.top<=0)});return e.observe(x),()=>e.disconnect()},[x]),r(()=>{g(!1)},[S]),{w:v,displayStyle:A,positionStyle:j,getCSSAlign:y,makeDisplaySettingStyles:z}};export{c as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let e=[{id:"setting",controls:[{id:"fullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!0},tablet:{default:!0},mobile:{default:!0}}},{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,isRowWith:!0,devices:{desktop:{default:"100%"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"1200px",showValue:!0}]},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#dddddd",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",preload:!1,loop:!0}}}},{id:"preloadBgImage",type:"toggle",label:"Preload Image",default:!1},{id:"position",label:"Layout",type:"layout-selector",iconViewBox:"0 0 76 48",itemPerRow:2,itemSpacing:"large",enableItemBackground:!0,enableItemOpacity:!0,options:[{label:"Bottom",value:"bottom",iconName:"gp-sticky-position-bottom"},{label:"Top",value:"top",iconName:"gp-sticky-position-top"}],devices:{desktop:{default:"bottom"}}},{id:"display",label:"Display",type:"select",devices:{desktop:{default:"always"}},options:[{label:"Always show",value:"always"},{label:"After first cart button",value:"after-first-cart-button"}]},{id:"isScrollToTop",type:"toggle",default:!1}]}];export{e as StickySettingsV2};
|
|
1
|
+
let e=[{id:"setting",controls:[{id:"fullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!0},tablet:{default:!0},mobile:{default:!0}}},{id:"width",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,isRowWith:!0,devices:{desktop:{default:"100%"}},displayOptions:[{label:"Full",value:"100%",showValue:!0},{label:"Default",value:"1200px",showValue:!0}]},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#dddddd",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll",preload:!1,loop:!0}}}},{id:"preloadBgImage",type:"toggle",label:"Preload Image",default:!1},{id:"position",label:"Layout",type:"layout-selector",iconViewBox:"0 0 76 48",itemPerRow:2,itemSpacing:"large",enableItemBackground:!0,enableItemOpacity:!0,options:[{label:"Bottom",value:"bottom",iconName:"gp-sticky-position-bottom"},{label:"Top",value:"top",iconName:"gp-sticky-position-top"}],devices:{desktop:{default:"bottom"}}},{id:"display",label:"Display",type:"select",devices:{desktop:{default:"always"}},options:[{label:"Always show",value:"always"},{label:"After first cart button",value:"after-first-cart-button"},{label:"After scrolling down",value:"after-first-scroll"},{label:"Between sections",value:"between-sections"}]},{id:"scrollPercent",type:"input:unit",units:["%"],min:0,max:100,placeholder:"0%",isNumber:!0},{id:"showFrom",type:"pick-link",optionConfig:{"scroll-to":{popoverLabel:"Show Sticky ATC start from",title:"",hideScrollToTop:!0}},default:{type:"scroll-to",link:""},isHiddenOpenLinkSelect:!0,hiddenOptions:{"stay-on-page":!0,"open-page":!0,"open-url":!0,"open-popup":!0,"go-to-sales-page":!0}},{id:"hideFrom",type:"pick-link",optionConfig:{"scroll-to":{popoverLabel:"Hide Sticky ATC start from",title:"",hideScrollToTop:!0}},default:{type:"scroll-to",link:""},isHiddenOpenLinkSelect:!0,hiddenOptions:{"stay-on-page":!0,"open-page":!0,"open-url":!0,"open-popup":!0,"go-to-sales-page":!0}},{id:"isScrollToTop",type:"toggle",default:!1}]}];export{e as StickySettingsV2};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let o=[{label:"Layout",controls:[{setting:{id:"position"},layout:"vertical"}]},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"width"},label:"Width"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{type:"custom",top:"16px",bottom:"16px",left:"24px",right:"24px"}}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preloadBgImage"}]},controlChangeTrigger:{settings:[{action:{controlId:"preloadBgImage",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",controlConfig:{id:"border-advanced",type:"border-v2",linkWithSetting:{name:"border",field:"normal"},compoDefaultValue:{color:"line-3",border:"solid",width:"1px",borderWidth:"1px"}}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Display option",controls:[{label:"Condition",setting:{id:"display"}}]}];export{o as SettingUIV2};
|
|
1
|
+
let o=[{label:"Layout",controls:[{setting:{id:"position"},layout:"vertical"}]},{label:"Size",hiddenOnMobile:!0,controls:[{setting:{id:"width"},label:"Width"},{label:"Padding",controlConfig:{id:"padding",type:"padding-v2",linkWithSetting:{name:"spacing-setting",field:"padding"},compoDefaultValue:{type:"custom",top:"16px",bottom:"16px",left:"24px",right:"24px"}}}]},{label:"Background",controls:[{setting:{id:"background"},layout:"vertical",options:{updateFields:[{field:"preload",settingId:"preloadBgImage"}]},controlChangeTrigger:{settings:[{action:{controlId:"preloadBgImage",valueFromField:"preload",groupType:"setting",controlType:"setting",removeDevice:!0}}],options:{noRecordHistory:!0}}}]},{label:"Shape",hiddenOnMobile:!0,controls:[{label:"Border",controlConfig:{id:"border-advanced",type:"border-v2",linkWithSetting:{name:"border",field:"normal"},compoDefaultValue:{color:"line-3",border:"solid",width:"1px",borderWidth:"1px"}}},{label:"Corner",setting:{id:"rounded",state:"normal"}},{label:"Shadow",setting:{id:"boxShadow",state:"normal"},options:{updateFields:[{field:"normal.enable",settingId:"hasBoxShadow",state:"normal"}]},controlChangeTrigger:{settings:[{condition:"boxShadow.normal.enable === true",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!0}},{condition:"boxShadow.normal.enable === false",source:["boxShadow","hasBoxShadow"],action:{controlId:"hasBoxShadow",groupType:"advanced",controlType:"advanced",state:"normal",newValue:!1}}],options:{noRecordHistory:!0}}}]},{label:"Display option",controls:[{label:"Condition",setting:{id:"display"}},{label:"Page scrolled",conditionDisplay:"display === 'after-first-scroll'",setting:{id:"scrollPercent"}},{label:"Show from",conditionDisplay:"display === 'between-sections'",setting:{id:"showFrom"}},{label:"Hide from",conditionDisplay:"display === 'between-sections'",setting:{id:"hideFrom"}}]}];export{o as SettingUIV2};
|
package/dist/types/index.d.ts
CHANGED
|
@@ -6095,9 +6095,16 @@ declare const shopPayInstallmentSetting: {
|
|
|
6095
6095
|
};
|
|
6096
6096
|
|
|
6097
6097
|
type Position = 'top' | 'bottom';
|
|
6098
|
-
type DisplayOptionValue = 'always' | 'after-first-scroll' | 'after-first-cart-button' | 'meet-section';
|
|
6098
|
+
type DisplayOptionValue = 'always' | 'after-first-scroll' | 'after-first-cart-button' | 'between-sections' | 'meet-section';
|
|
6099
|
+
type SectionLinkValue = {
|
|
6100
|
+
link?: string;
|
|
6101
|
+
type?: 'scroll-to';
|
|
6102
|
+
};
|
|
6099
6103
|
type StickySettingProps = {
|
|
6100
6104
|
display: ObjectDevices<DisplayOptionValue>;
|
|
6105
|
+
scrollPercent?: number;
|
|
6106
|
+
showFrom?: SectionLinkValue;
|
|
6107
|
+
hideFrom?: SectionLinkValue;
|
|
6101
6108
|
fullWidth?: ObjectDevices<boolean>;
|
|
6102
6109
|
width?: ObjectDevices<string>;
|
|
6103
6110
|
background: ObjectDevices<BackgroundMedia>;
|
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.13",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"i18n:extract": "rollup -c ./scripts/rollup.config.settings.mjs && node ./scripts/translate/extract-texts-to-locales.js && node ./scripts/translate/en-keys-usage.js"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@gem-sdk/core": "19.1.0-staging.
|
|
29
|
+
"@gem-sdk/core": "19.1.0-staging.12",
|
|
30
30
|
"@gem-sdk/styles": "19.1.0-staging.9",
|
|
31
31
|
"@gem-sdk/system": "19.1.0-staging.9",
|
|
32
32
|
"@types/react-transition-group": "^4.4.12",
|