@gem-sdk/components 12.0.0-dev.126 → 12.0.0-dev.127
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/hooks/useCarousel.js +1 -1
- package/dist/cjs/modal/components/Modal.js +1 -1
- package/dist/cjs/modal/components/ZoomButton.js +2 -0
- package/dist/cjs/modal/index.js +1 -1
- package/dist/cjs/product/components/product-images-v3/components/child/ProductImagesLightBoxPreview.js +1 -0
- package/dist/cjs/product/components/product-images-v3/components/lightbox/LightBoxCarousel.js +2 -0
- package/dist/cjs/product/components/product-images-v3/components/lightbox/LightBoxGalleryCarousel.js +2 -0
- package/dist/cjs/product/components/product-images-v3/components/lightbox/LightBoxImageZoom.js +2 -0
- package/dist/cjs/product/components/product-images-v3/components/lightbox/ProductImagesLightBox.js +1 -1
- package/dist/cjs/product/components/product-images-v3/components/lightbox/constants.js +1 -0
- package/dist/cjs/product/components/product-images-v3/composables/getProductImagesClassName.js +1 -1
- package/dist/esm/carousel-v3/hooks/useCarousel.js +1 -1
- package/dist/esm/modal/components/Modal.js +1 -1
- package/dist/esm/modal/components/ZoomButton.js +2 -0
- package/dist/esm/modal/index.js +1 -1
- package/dist/esm/product/components/product-images-v3/components/child/ProductImagesLightBoxPreview.js +1 -0
- package/dist/esm/product/components/product-images-v3/components/lightbox/LightBoxCarousel.js +2 -0
- package/dist/esm/product/components/product-images-v3/components/lightbox/LightBoxGalleryCarousel.js +2 -0
- package/dist/esm/product/components/product-images-v3/components/lightbox/LightBoxImageZoom.js +2 -0
- package/dist/esm/product/components/product-images-v3/components/lightbox/ProductImagesLightBox.js +1 -1
- package/dist/esm/product/components/product-images-v3/components/lightbox/constants.js +1 -0
- package/dist/esm/product/components/product-images-v3/composables/getProductImagesClassName.js +1 -1
- package/dist/types/index.d.ts +12 -0
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var React=require("react"),core=require("@gem-sdk/core"),useTrackPreviewPause=require("./useTrackPreviewPause.js");const useCarousel=(e,t,r,s)=>{let n;let{builderProps:a,moveToIdx:i,styles:o,setting:l,isHiddenArrowWhenDisabled:u=!0,elmRef:c,isEnableCheckHasScrollableContent:d,
|
|
1
|
+
"use strict";var React=require("react"),core=require("@gem-sdk/core"),useTrackPreviewPause=require("./useTrackPreviewPause.js");const useCarousel=(e,t,r,s)=>{let n;let{builderProps:a,moveToIdx:i,styles:o,setting:l,isHiddenArrowWhenDisabled:u=!0,elmRef:c,isEnableCheckHasScrollableContent:d,centerInsufficientSlides:p,onClickArrow:f,onHandleChangeSlideByInteraction:m,onChangeActive:v}=e,[y,g]=React.useState(!0),[R,S]=React.useState(!0),[k,h]=React.useState(!1),{loop:V,navigationEnable:b={desktop:!0},navigationStyle:B}=l??{},[P,w]=React.useState(s),[T,N]=React.useState(l?.defaultCurrentSlider??0),{isFirstPreviewClicked:E}=useTrackPreviewPause.default(l?.runPreview),x=React.useRef(),C=React.useRef(i??0),M=core.useCurrentDevice(),I=core.useEditorMode(),{onListener:O,saveToElementInteractionData:L,getInteractionPreviousData:z,trigger:D}=core.useInteraction(),q=React.useMemo(()=>core.getResponsiveValueByScreen(V,M,!1),[V,M]),H=React.useCallback(()=>{if(!l?.slidesToShow)return null;let e={};return core.DEVICES.forEach(t=>{let r=core.getResponsiveValueByScreen(l?.slidesToShow,t);e[t]=r?"auto"===r?4:Math.floor(r):0}),e},[l?.slidesToShow]),j=React.useCallback(()=>{if(!l?.slidesToShow)return null;let e={};return core.DEVICES.forEach(t=>{let r=core.getResponsiveValueByScreen(l?.slidesToShow,t);e[t]=r?"auto"===r?4:r:0}),e},[l?.slidesToShow]),F=React.useMemo(()=>{let e=j();if(e)return e;let t={};return core.DEVICES.forEach(e=>{let r=core.getResponsiveValueByScreen(l?.sneakPeak,e),s=r?"center"===core.getResponsiveValueByScreen(l?.sneakPeakType,e)?core.getResponsiveValueByScreen(l?.sneakPeakOffsetCenter,e)??0:core.getResponsiveValueByScreen(l?.sneakPeakOffsetForward,e)??0:0,n="center"===core.getResponsiveValueByScreen(l?.sneakPeakType,e)?-2:-1,a=core.getResponsiveValueByScreen(l?.itemNumber,e);t[e]="number"==typeof a?a+s/100*n:"auto"}),t},[j,l?.itemNumber,l?.sneakPeak,l?.sneakPeakOffsetCenter,l?.sneakPeakOffsetForward,l?.sneakPeakType]),$=React.useMemo(()=>{let e=core.getResponsiveValueByScreen(F,M),t=core.getResponsiveValueByScreen(V,M,!1);return t&&Number(e??0)>s||!t&&Number(e??0)>=s},[F,M,V,s]),A=React.useMemo(()=>{let e=core.getResponsiveValueByScreen(b,M),t=core.getResponsiveValueByScreen(B,M);return r&&e&&"none"!==t&&y&&!$},[b,M,B,r,y,$]),U=React.useMemo(()=>{let e=H();return e||l?.itemNumber},[H,l?.itemNumber]),W=React.useCallback(e=>{let t="center"===core.getResponsiveValueByScreen(l?.sneakPeakType,e)?2:1;return"number"==typeof core.getResponsiveValueByScreen(U,e,4)?core.getResponsiveValueByScreen(U,e,4)-t:void 0},[l?.sneakPeakType,U]),G=()=>{let e="auto"===core.getResponsiveValueByScreen(F,M,1)?1:core.getResponsiveValueByScreen(F,M,1);return e??1},J=e=>{let t=e*G();return t>=P-G()&&(t=P-G()),t},K=e=>{let t="edit"===I?{[e]:!1}:l?.enableDrag;return core.getResponsiveValueByScreen(t,e)},Q=(e,t)=>{let n=l?.sneakPeak?.[M]?e:t?e:J(e);if(t){if(s<er){r?.slideTo(n);return}if(r?.realIndex===n)return;if(n===Number(r?.realIndex)+1||0===n&&r?.realIndex===s-1)return r?.slideNext();if(n===Number(r?.realIndex)-1||n===s-1&&r?.realIndex===0)return r?.slidePrev();let e="center"===core.getResponsiveValueByScreen(l?.sneakPeakType,M)&&"number"==typeof core.getResponsiveValueByScreen(l?.itemNumber,M)&&Number(core.getResponsiveValueByScreen(l?.itemNumber,M))%2==0;e?r?.slideToLoopCenterSneakPeek(n):r?.slideToLoop(n)}else r?.slideTo(n);C.current=n};React.useImperativeHandle(t,()=>({nextSlideInteraction:_,previousSlideInteraction:ee,moveToSlideInteraction:et,getSwiper:()=>r}));let X=e=>{D({event:"gp:rollback:select-slide",selector:`[data-id="${a?.uid}"]`,element:c?.current}),D({event:"gp:select-slide",selector:`[data-id="${a?.uid}"]`,data:e,element:c?.current})},Y=e=>{r?.slideTo(e),m&&m(e)},Z=(e,t)=>{let{key:s,data:n,isRollback:a,element:i}=e,o=Math.max(r?.activeIndex??0,0);if(a&&void 0===n)return;if(a){if("specific"===t){let{previousData:e}=z(i,s);Y(Number(e))}else{let e="next"===t?o-1:o+1;Y(e)}return}let l="specific"===t?Math.max(C.current,0):o;L(i,s,l.toString());let u="specific"===t?Number(n):"next"===t?o+1:o-1;Y(u)},_=e=>{Z(e,"next")},ee=e=>{Z(e,"previous")},et=e=>{Z(e,"specific")},er=G(),es=React.useMemo(()=>!!P&&r&&core.getResponsiveValueByScreen(l?.dot,M)&&!$&&s>1,[P,r,l?.dot,M,$,s]),en=core.getResponsiveValueByScreen(l?.vertical,M,!1)?"vertical":"horizontal",ea=e=>{let{swiperWidth:t,slidesPerView:r,itemNumberByDevice:s,centeredSlides:n}=e;if(!n||!s)return 0;let a=t/r,i=(Number(s)-2)/2-1;return-(a/2+i*a)},ei=React.useMemo(()=>{let e=core.getResponsiveValueByScreen(V,M,!1),t=r?.width??0,s={0:"mobile",768:"tablet",1025:"desktop"},n=Number(Object.entries(s).find(([,e])=>e===M)?.[0]??1025),a=Object.entries(s).reduce((e,[r,s])=>{if(!e)return;let n=Number(r),a=core.getResponsiveValueByScreen(l?.sneakPeak,s,!1),o=a&&"center"===core.getResponsiveValueByScreen(l?.sneakPeakType,s),u=core.getResponsiveValueByScreen(l?.itemNumber,s),c=K(s),d=ea({swiperWidth:t,slidesPerView:er,itemNumberByDevice:u,centeredSlides:o}),p=l?.initialSlide||i||0,f={allowTouchMove:c,slidesOffsetBefore:d,slidesOffsetAfter:d,initialSlide:p,centeredSlides:o};return e[n]=f,e},{}),u="center"===core.getResponsiveValueByScreen(l?.sneakPeakType,M)&&"number"==typeof core.getResponsiveValueByScreen(l?.itemNumber,M)&&Number(core.getResponsiveValueByScreen(l?.itemNumber,M))>1;return{speed:o?.playSpeed??500,dir:l?.rtl?"rtl":"ltr",spaceBetween:core.getResponsiveValueByScreen(o?.spacing,M)||0,loop:e,slidesPerView:"auto"===core.getResponsiveValueByScreen(F,M,1)?"auto":er,direction:en,breakpoints:a,isSneakPeekCenter:u,slidesOffsetBefore:a?.[n]?.slidesOffsetBefore,thumbs:{slideThumbActiveClass:"gem-slider-item-active"},loopPreventsSliding:!1,autoplay:{delay:(l?.autoplayTimeout??1)*1e3,pauseOnMouseEnter:l?.pauseOnHover,stopOnLastSlide:!e},...p&&{centerInsufficientSlides:!0}}},[o?.playSpeed,l?.rtl,o?.spacing,M,V,er,l?.sneakPeakType,l?.pauseOnHover,l?.autoplayTimeout,r?.width,P]),eo=React.useCallback(e=>{let t=r&&r.params?.slidesPerView,s=t?r?.slidesPerViewDynamic():1;if(e<=1)return!1;let n="auto"===ei.slidesPerView?s:ei.slidesPerView;if(!q||e<Number(n)||!y)return!1;let a=core.getResponsiveValueByScreen(l?.sneakPeak,M,!1),i=a&&"center"===core.getResponsiveValueByScreen(l?.sneakPeakType,M),o=Number.isNaN(Number(n))?1:Math.ceil(Number(n));i&&o%2==0&&(o+=1);let u=i?Math.max(1,Math.ceil(o/2)):1;return e<o+u},[r,ei.slidesPerView,q,y,l?.sneakPeak,l?.sneakPeakType,M]);React.useEffect(()=>{let e=`[data-id="${a?.uid}"]`;O({event:"gp:change-next-slide",selector:e,elementRef:x},e=>{let{data:t,isRollback:r,uniqueStorageKey:s}=e||{};_({element:x.current,data:t,isRollback:r,key:s})}),O({event:"gp:change-previous-slide",selector:e,elementRef:x},e=>{let{data:t,isRollback:r,uniqueStorageKey:s}=e||{};ee({element:x.current,data:t,isRollback:r,key:s})}),O({event:"gp:change-image-step",selector:e,elementRef:x},e=>{let{data:t,isRollback:r,uniqueStorageKey:s}=e||{};et({element:x.current,data:t,isRollback:r,key:s})}),O({event:"gp:change-index-slide",selector:e},t=>{let r=document.querySelector(e),{data:s,isRollback:n,uniqueStorageKey:a}=t||{};et({element:r,data:s,isRollback:n,key:a})})},[]),React.useEffect(()=>{w(s)},[s]);let el=e=>{"next"===e?r?.slideNext():r?.slidePrev(),f&&(n&&clearTimeout(n),n=setTimeout(()=>f&&f(),500))};return React.useEffect(()=>{if("number"==typeof i){if(C.current=i,r?.params?.loop){r?.slideToLoop(i);return}r?.slideTo(i)}},[r,i,u]),React.useEffect(()=>{if(!r)return;let e=()=>{w(r.slides.length)},t=()=>{v&&v(r.realIndex)},s=()=>{N(r.realIndex),S(r?.translate===0),h(r?.translate<=r?.maxTranslate())};return r.on("transitionEnd",s),r.on("slideChange",e),r.on("slideChangeTransitionStart",t),()=>{r?.off("slideChange",e),r?.off("slideChangeTransitionStart",t),r?.off("transitionEnd",s)}},[ei.loop,r]),React.useEffect(()=>{r?.wrapperEl&&(r.wrapperEl.style.transitionTimingFunction=l?.animationMode??"ease")},[r,l?.animationMode]),React.useEffect(()=>{if(r&&r.autoplay){let e="edit"===I?!!E&&l?.runPreview&&l?.autoplay:l?.autoplay;e?r.autoplay.start():r.autoplay.stop()}},[r,l?.autoplay,I,E,l?.runPreview]),React.useEffect(()=>{let e=e=>{if(a?.uid!==e?.detail.componentUid)return;let t=e?.detail.index||0;r?.slideToLoop(t)};return window.addEventListener("move-to-idx",e),()=>window.removeEventListener("move-to-idx",e)},[r,a?.uid]),React.useEffect(()=>{if(!r)return;let e=r.el;e?.classList?.remove("swiper-horizontal","swiper-vertical");let t=core.getResponsiveValueByScreen(l?.vertical,M)?"swiper-vertical":"swiper-horizontal";e?.classList?.add(t),r?.slides?.forEach(e=>{e.style.width="",e.style.height=""}),r?.update()},[M,l?.vertical,r,r?.params]),React.useEffect(()=>{if(!r||!d)return;let e=()=>{let e=r?.slides?.slice(0,s)||[],t=Number(ei?.spaceBetween||0),n=e.reduce((e,t)=>e+t.offsetHeight,0)+t*(e.length-1),a=e.reduce((e,t)=>e+t.offsetWidth,0)+t*(e.length-1),i=r.params?.direction==="horizontal"?a>(r.width||0):n>(r.height||0);g(i)};return e(),r.on("resize",e),r.on("update",e),r.on("slidesLengthChange",e),r.on("orientationchange",e),()=>{r.off("resize",e),r.off("update",e),r.off("slidesLengthChange",e),r.off("orientationchange",e)}},[r]),{isInfinity:q,sliderSettings:ei,totalSlideItem:P,currentSlide:T,localRef:x,isRenderDots:es,showNavigation:A,isScrollToStart:R,isScrollToEnd:k,handleDotClick:Q,getItemsPerPage:G,handleNextAndPrevSlide:el,dispatchEventSelectSlide:X,getNumberOfFullWidthShow:W,setCurrentSlide:N,shouldDuplicateSlides:eo,setIsScrollToStart:S,setIsScrollToEnd:h,isHideNavigation:$}};exports.useCarousel=useCarousel;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react"),reactDom=require("react-dom"),ChildrenDroppable=require("../../grid/components/ChildrenDroppable.js"),useModalContainer=require("../hooks/useModalContainer.js"),ZoomButton=require("./ZoomButton.js");const Modal=({setting:e,styles:t,children:i,willUnmount:n,closeOnEscape:o,onKeypressEscape:r,keyCodeForClose:l,closeOnClickOutside:s,onClose:a,contentClass:c,wrapperContentClasses:u,disableIframeClickEvent:p,lockBodyScroll:d,zoomButton:g,closeButtonClassName:m})=>{let{open:x}=e??{},h=useModalContainer.default(),f=React.useRef(null),j=React.useRef(null),v=React.useRef(null),{isShowButton:w=!1,isZoomIn:R,onToggleZoom:C}=g??{},b=React.useCallback(e=>{let t=e.code,i="Escape"===t;l?.includes(t),o&&i&&r?.(e)},[o,l,r]);React.useEffect(()=>(document.addEventListener("keydown",b,!1),()=>{document.removeEventListener("keydown",b,!1),n?.()}),[b,n]);let y=React.useCallback(e=>{let t=e.target===f.current,i=e.target===j.current;(s&&t||i)&&(window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:!1}),"*"),a?.())},[s,a]);return(React.useEffect(()=>{window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:x}),"*")},[x]),React.useEffect(()=>{if(!x||!d)return;let{style:e}=document.body;return v.current={overflow:e.overflow,touchAction:e.touchAction},e.overflow="hidden",e.touchAction="none",()=>{let t=v.current;t&&(e.overflow=t.overflow,e.touchAction=t.touchAction,v.current=null)}},[x,d]),h&&x)?reactDom.createPortal(jsxRuntime.jsx(jsxRuntime.Fragment,{children:jsxRuntime.jsx("div",{className:"gp-fixed gp-inset-0 gp-z-50 gp-overflow-y-auto","data-disable-iframe-click-event":p||!1,children:jsxRuntime.jsxs("div",{className:"gp-min-h-screen gp-px-4 gp-text-center",children:[jsxRuntime.jsx("div",{ref:f,className:core.cls("gp-fixed gp-inset-0 gp-bg-black/60 gp-backdrop-blur-sm gp-transition-all gp-duration-100",{"gp-opacity-100":x,"gp-opacity-0":!x}),onClick:y,"aria-hidden":!0}),jsxRuntime.jsx("span",{className:"gp-inline-block gp-h-screen gp-align-middle"}),jsxRuntime.jsxs("div",{className:core.cls("gp-relative gp-my-8 gp-inline-block gp-w-full gp-overflow-hidden gp-rounded gp-bg-white gp-p-6 gp-text-left gp-align-middle gp-shadow-xl gp-transition-all gp-duration-100",{"gp-max-w-2xl":!t?.width,"gp-scale-100 gp-opacity-100":x,"gp-scale-0 gp-opacity-0":!x},c),style:{width:t?.width},children:[jsxRuntime.jsx("div",{className:core.cls("gp-absolute gp-right-[16px] gp-top-[16px] gp-z-10 gp-cursor-pointer",m??""),onClick:y,"aria-hidden":"true",children:jsxRuntime.jsx("svg",{ref:j,width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsxRuntime.jsx("path",{d:"M11.1758 12.0241C11.4101 12.2584 11.79 12.2584 12.0243 12.0241C12.2586 11.7898 12.2586 11.4099 12.0243 11.1755L8.84858 7.9998L12.0243 4.82407C12.2586 4.58975 12.2586 4.20986 12.0243 3.97554C11.79 3.74123 11.4101 3.74123 11.1758 3.97554L8.00005 7.15128L4.82431 3.97554C4.59 3.74123 4.2101 3.74123 3.97578 3.97554C3.74147 4.20986 3.74147 4.58975 3.97578 4.82407L7.15152 7.9998L3.97579 11.1755C3.74147 11.4099 3.74147 11.7898 3.97579 12.0241C4.2101 12.2584 4.59 12.2584 4.82431 12.0241L8.00005 8.84833L11.1758 12.0241Z",fill:"#676767"})})}),w&&jsxRuntime.jsx(ZoomButton.default,{isZoomIn:R,onToggleZoom:C}),jsxRuntime.jsx("div",{className:u,children:core.isEmptyChildren(i)?jsxRuntime.jsx(ChildrenDroppable.default,{}):i})]})]})})}),h):null};exports.default=Modal;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core");require("react");const ZoomButton=({isZoomIn:e,onToggleZoom:t})=>{let C=()=>{t?.()},i=jsxRuntime.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:jsxRuntime.jsx("path",{d:"M6.77246 0C10.5128 0 13.5448 3.03212 13.5449 6.77246C13.5449 8.41757 12.9568 9.9243 11.9814 11.0977L15.8115 14.9277C16.0556 15.1718 16.0555 15.5674 15.8115 15.8115C15.5674 16.0556 15.1718 16.0556 14.9277 15.8115L11.0977 11.9814C9.9243 12.9568 8.41757 13.5449 6.77246 13.5449C3.03212 13.5448 0 10.5128 0 6.77246C9.91359e-05 3.03218 3.03218 9.49436e-05 6.77246 0ZM6.77246 1.25C3.72254 1.25009 1.2501 3.72253 1.25 6.77246C1.25 9.82248 3.72247 12.2948 6.77246 12.2949C8.28607 12.2949 9.65677 11.6854 10.6543 10.6992C10.6614 10.6914 10.6673 10.6823 10.6748 10.6748C10.6824 10.6673 10.6914 10.6614 10.6992 10.6543C11.6854 9.65677 12.2949 8.28607 12.2949 6.77246C12.2948 3.72247 9.82247 1.25 6.77246 1.25ZM6.86328 3.40234C7.2082 3.40251 7.4881 3.68242 7.48828 4.02734V6.23828H9.69824C10.0433 6.23828 10.3231 6.51826 10.3232 6.86328C10.3231 7.20832 10.0433 7.48828 9.69824 7.48828H7.48828V9.69824C7.48828 10.0433 7.20832 10.3231 6.86328 10.3232C6.51822 10.3231 6.23828 10.0433 6.23828 9.69824V7.48828H4.02734C3.68238 7.48815 3.40251 7.20824 3.40234 6.86328C3.40252 6.51834 3.68239 6.23841 4.02734 6.23828H6.23828V4.02734C6.23846 3.6824 6.51833 3.40248 6.86328 3.40234Z",fill:"#AAAAAA"})}),s=jsxRuntime.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:jsxRuntime.jsx("path",{d:"M8.77441 2C12.5157 2 15.5487 5.03247 15.5488 8.77344C15.5488 10.4191 14.9613 11.927 13.9854 13.1006L17.8164 16.9307C18.0602 17.1747 18.0603 17.5704 17.8164 17.8145C17.5724 18.0581 17.1766 18.0582 16.9326 17.8145L13.1016 13.9844C11.9279 14.9598 10.4199 15.5469 8.77441 15.5469C5.03309 15.5468 2 12.5145 2 8.77344C2.00009 5.0325 5.03314 2.00004 8.77441 2ZM8.77441 3.25C5.72333 3.25004 3.25009 5.72302 3.25 8.77344C3.25 11.8239 5.72327 14.2968 8.77441 14.2969C10.2896 14.2969 11.6611 13.6858 12.6592 12.6982C12.6655 12.6913 12.671 12.6835 12.6777 12.6768C12.6843 12.6702 12.6924 12.6644 12.6992 12.6582C13.6874 11.6603 14.2988 10.2887 14.2988 8.77344C14.2987 5.723 11.8255 3.25 8.77441 3.25ZM11.7012 8.23926C12.0463 8.23926 12.3262 8.51908 12.3262 8.86426C12.3259 9.20921 12.0462 9.48926 11.7012 9.48926H6.02832C5.68347 9.48906 5.40358 9.20909 5.40332 8.86426C5.40332 8.5192 5.68331 8.23945 6.02832 8.23926H11.7012Z",fill:"#AAAAAA"})});return jsxRuntime.jsx("button",{type:"button","aria-label":"Toggle zoom mode",className:core.cls("gp-absolute gp-top-[74px] gp-right-4 gp-z-20 gp-flex gp-items-center gp-justify-center gp-text-[#AAAAAA] gp-transition"),onClick:C,children:e?s:i})};exports.default=ZoomButton;
|
package/dist/cjs/modal/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var confirm=require("./components/confirm.js");require("react/jsx-runtime"),require("
|
|
1
|
+
"use strict";var confirm=require("./components/confirm.js");require("react/jsx-runtime"),require("@gem-sdk/core"),require("react"),require("react-dom");var Modal$1=require("./settings/Modal.js");const modalSetting={Modal:Modal$1.default};exports.openConfirm=confirm.openConfirm,exports.modalSetting=modalSetting;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),core=require("@gem-sdk/core"),ProductFeatureVideo=require("../../../product-images-v2/components/child/ProductFeatureVideo.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),NextImage=require("../../../../../image/components/NextImage.js"),MediaIcon=require("./MediaIcon.js"),constants=require("../lightbox/constants.js");const ProductImagesLightBoxPreview=({image:e})=>{let{isEditMode:t}=core.useRenderMode(),r=React.useMemo(()=>!t&&["VIDEO","EXTERNAL_VIDEO"].includes(e?.contentType||""),[t,e?.contentType]),o=React.useMemo(()=>e?{...e,src:r?e.src:productFeaturedImage.isFeatureMedia(e?.contentType)?e?.previewImage:e.src}:constants.DEFAULT_LIGHTBOX_IMAGE_ONLY,[e,r]);return r?jsxRuntime.jsx(ProductFeatureVideo.default,{type:o?.contentType,url:o.src??""}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(NextImage.default,{src:o.src,alt:o.alt,width:o.width,height:o.height,setting:{layout:{desktop:"cover",tablet:"cover",mobile:"cover"}},style:{width:"100%",height:"100%",cursor:"pointer",objectFit:"contain",objectPosition:"center"},className:"gp-h-full gp-w-full gallery-image-only"}),jsxRuntime.jsx(MediaIcon.default,{contentType:o?.contentType??""})]})};exports.default=ProductImagesLightBoxPreview;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react"),Carousel=require("../../../../../carousel-v3/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel-v3/components/item/CarouselItem.js"),ProductImagesLightBoxPreview=require("../child/ProductImagesLightBoxPreview.js"),constants=require("./constants.js");const LightBoxCarousel=({builderPropUID:e,displayImages:t,activeIndex:r,imageActiveIndex:s,onChangeSlide:i})=>{let o=core.useCurrentDevice(),l="mobile"===o,u=React.useMemo(()=>({...constants.LIGHTBOX_CAROUSEL_SETTING,initialSlide:r,defaultCurrentSlider:r}),[r]);return jsxRuntime.jsx("div",{className:core.cls(`gem-slider-item gem-slider-item-${e} gp-relative gp-h-full gp-w-full gp-overflow-hidden gp-cursor-zoom-in gp-flex gp-items-center gp-justify-center`),style:{maxWidth:l?"100vw":"calc(100vw - 150px)",maxHeight:"100vh"},children:jsxRuntime.jsx(Carousel.default,{setting:u,styles:constants.LIGHTBOX_CAROUSEL_STYLES,builderProps:{uid:`${e}-lightbox-main`},moveToIdx:r,isDisableResetSlide:!0,onChangeActive:i,children:t.map(e=>jsxRuntime.jsx(CarouselItem.default,{className:"gp-flex gp-h-full gp-items-center gp-justify-center gp-cursor-zoom-in",children:jsxRuntime.jsx(ProductImagesLightBoxPreview.default,{image:e})},e.id))})})};exports.default=LightBoxCarousel;
|
package/dist/cjs/product/components/product-images-v3/components/lightbox/LightBoxGalleryCarousel.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react"),Carousel=require("../../../../../carousel-v3/components/root/Carousel.js"),CarouselItem=require("../../../../../carousel-v3/components/item/CarouselItem.js"),NextImage=require("../../../../../image/components/NextImage.js"),MediaIcon=require("../../../product-images-v2/components/child/MediaIcon.js"),productFeaturedImage=require("../../common/productFeaturedImage.js"),productGallery=require("../../common/productGallery.js"),getProductImagesAttr=require("../../composables/getProductImagesAttr.js"),getProductImagesStyles=require("../../composables/getProductImagesStyles.js"),constants=require("./constants.js"),getProductImagesClassName=require("../../composables/getProductImagesClassName.js");const LightBoxGalleryCarousel=({builderPropUID:e,displayImages:t,activeIndex:s,onChangeSlide:r})=>{let a=core.useCurrentDevice(),o=React.useRef(!1),[u,n]=React.useState(s);if(React.useEffect(()=>{o.current||(o.current=!0,n(s))},[s]),t.length<=1)return null;let{galleryCarouselStyle:i,galleryCarouselItemStyle:l}=getProductImagesStyles.getProductImagesStyles(constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING),{galleryCarouselSettingAttrs:c}=getProductImagesAttr.getProductImagesAttr(constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING),d=productGallery.getEditorMinHeightClass(a,constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING.position,constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING.navigationPosition);return jsxRuntime.jsx(Carousel.default,{setting:c,styles:{...i},slidesClass:d,builderProps:{uid:`${e}-carousel`},rootClass:"gp-flex gp-justify-center gp-w-fit",moveToIdx:u,isHiddenArrowWhenDisabled:!0,disableMarginAuto:!0,isEnableCheckHasScrollableContent:!0,centerInsufficientSlides:!0,onChangeActive:n,children:t.map((e,t)=>{let a=productFeaturedImage.isFeatureMedia(e.contentType)?e.previewImage:e.src;return jsxRuntime.jsx(CarouselItem.default,{"data-thumb-index":t,contentType:"productImage",className:getProductImagesClassName.galleryItemClasses(t,s,"gp-overflow-hidden gp-rounded-md gp-border gp-transition-all"),onClickItem:()=>r(t),style:l,"data-id":e.id,children:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx(NextImage.default,{draggable:"false",src:a,width:e.width,height:e.height,alt:e.alt,setting:{layout:constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING.layout,qualityPercent:constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING.qualityPercent,qualityType:constants.LIGHTBOX_GALLERY_CAROUSEL_SETTING.qualityType},style:{width:"100%",height:"100%",cursor:"pointer"},className:"product-images-lightbox-gallery-carousel-image"}),jsxRuntime.jsx(MediaIcon.default,{contentType:e?.contentType??""})]})},e.id)})})};exports.default=LightBoxGalleryCarousel;
|
package/dist/cjs/product/components/product-images-v3/components/lightbox/LightBoxImageZoom.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),NextImage=require("../../../../../image/components/NextImage.js");const ZOOM_SCALE=2,LightBoxImageZoom=({image:e})=>{let t=React.useRef(null),r=React.useRef({x:0,y:0,originX:0,originY:0}),n=React.useRef(!1),[i,a]=React.useState({x:0,y:0});React.useEffect(()=>{a({x:0,y:0})},[e]);let o=(e,r)=>{let n=t.current?.getBoundingClientRect();if(!n)return{x:e,y:r};let i=1*n.width/2,a=1*n.height/2;return{x:Math.max(-i,Math.min(i,e)),y:Math.max(-a,Math.min(a,r))}},u=e=>{e.preventDefault(),e.stopPropagation(),n.current=!0,r.current={x:e.clientX,y:e.clientY,originX:i.x,originY:i.y},e.currentTarget.setPointerCapture(e.pointerId)},l=e=>{if(!n.current)return;let t=e.clientX-r.current.x,i=e.clientY-r.current.y,u=o(r.current.originX+t,r.current.originY+i);a(u)},c=e=>{n.current&&(n.current=!1,e.currentTarget.hasPointerCapture(e.pointerId)&&e.currentTarget.releasePointerCapture(e.pointerId))};return e.src?jsxRuntime.jsx("div",{ref:t,className:"gp-h-full gp-w-full gp-overflow-hidden gp-cursor-grab active:gp-cursor-grabbing",onPointerDown:u,onPointerMove:l,onPointerUp:c,onPointerCancel:c,onPointerLeave:c,onDragStart:e=>e.preventDefault(),style:{touchAction:"none"},children:jsxRuntime.jsx("div",{className:"gp-h-full gp-w-full",style:{transform:`translate3d(${i.x}px, ${i.y}px, 0) scale(2)`,transformOrigin:"center center",willChange:"transform"},children:jsxRuntime.jsx(NextImage.default,{src:e.src||"",alt:e.alt||"Product image",draggable:!1,className:"gp-h-full gp-w-full gp-pointer-events-none",style:{objectFit:"contain"}})})}):jsxRuntime.jsx("div",{className:"gp-h-full gp-w-full"})};exports.default=LightBoxImageZoom;
|
package/dist/cjs/product/components/product-images-v3/components/lightbox/ProductImagesLightBox.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react");require("../../../../../modal/components/confirm.js");var Modal=require("../../../../../modal/components/Modal.js"),LightBoxCarousel=require("./LightBoxCarousel.js"),LightBoxGalleryCarousel=require("./LightBoxGalleryCarousel.js"),LightBoxImageZoom=require("./LightBoxImageZoom.js");const ProductImagesLightBox=({builderPropUID:e,productImages:t,open:s,onHandleClose:o})=>{let l=core.useFeaturedImageGlobal(),i=core.useCurrentDevice(),a="mobile"===i,[r,g]=React.useState(!1),[n,u]=React.useState(0),p=React.useMemo(()=>(t||[]).map((e,t)=>({...e,id:e.id||`gp-lightbox-${t}`,src:e.src||e.previewImage,alt:e.alt||"Product image"})),[t]),c=React.useMemo(()=>!["VIDEO","EXTERNAL_VIDEO","MODEL_3D"].includes(p[n]?.contentType||""),[p,n]),m=React.useMemo(()=>{let e=p.findIndex(e=>e.id===l?.id);return e&&e>0?e:0},[p,l]);React.useEffect(()=>{s&&(g(!1),u(m))},[s]);let x=()=>{g(e=>!e)};return jsxRuntime.jsx(Modal.default,{setting:{open:s},styles:{width:"calc(100% + 2rem)"},closeOnClickOutside:!0,closeOnEscape:!0,onKeypressEscape:()=>o(),onClose:()=>{o()},lockBodyScroll:!0,disableIframeClickEvent:!0,contentClass:"!gp--mx-4 !gp-my-auto !gp-h-screen !gp-max-w-none !gp-rounded-none !gp-bg-[#0F0F10] !gp-px-0 !gp-py-0 !gp-text-white",zoomButton:{isShowButton:c,isZoomIn:r,onToggleZoom:x},closeButtonClassName:"gp-top-[34px] gp-text-[#AAAAAA] gp-scale-125",wrapperContentClasses:"gp-flex gp-h-full gp-w-full gp-items-center gp-justify-center",children:jsxRuntime.jsx("div",{className:"gp-relative gp-flex gp-h-full gp-w-full gp-flex-col gp-items-center gp-justify-center",children:r?jsxRuntime.jsx(LightBoxImageZoom.default,{image:p[n]}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"gp-flex gp-flex-1 gp-items-center gp-justify-center gp-overflow-hidden gp-px-0",children:jsxRuntime.jsx(LightBoxCarousel.default,{builderPropUID:e,displayImages:p,activeIndex:n,imageActiveIndex:m,onChangeSlide:u})}),jsxRuntime.jsx("div",{className:"gp-z-20 gp-absolute gp-bottom-2 mobile:gp-bottom-[28px] gp-left-0 gp-right-0 gp-flex gp-justify-center gp-mx-auto",style:{maxWidth:a?"100vw":"calc(100vw - 150px)"},children:jsxRuntime.jsx(LightBoxGalleryCarousel.default,{builderPropUID:e,displayImages:p,activeIndex:n,onChangeSlide:u})})]})})})};exports.default=ProductImagesLightBox;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const LIGHTBOX_GALLERY_CAROUSEL_SETTING={loop:{desktop:!0},corner:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"},shapeForBottom:{desktop:{shape:"square",height:"80px",shapeValue:"1/1",width:"80px",shapeLinked:!0,gap:""},tablet:{shape:"square",height:"80px",shapeValue:"1/1",width:"80px",shapeLinked:!0,gap:""},mobile:{shape:"square",height:"64px",shapeValue:"1/1",width:"64px",shapeLinked:!0,gap:""}},position:{desktop:"bottom-center"},navigationPosition:{desktop:"outside",tablet:"outside",mobile:"none"},borderActive:{borderType:"none",border:"solid",borderWidth:"3px",width:"1px 1px 1px 1px",isCustom:!0,color:"#3C67FF"},layout:{desktop:"cover"},qualityPercent:{desktop:100},qualityType:{desktop:"high"},itemSpacing:{desktop:"8px"},animationMode:"ease-out"},DEFAULT_LIGHTBOX_IMAGE_ONLY={src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",id:"noImageError",width:480,height:480,alt:"no image",contentType:"IMAGE"},LIGHTBOX_CAROUSEL_STYLES={sizeSetting:{desktop:{width:"100%",height:"100%"}}},LIGHTBOX_CAROUSEL_SETTING={slidesToShow:{desktop:1},loop:{desktop:!1},dot:{desktop:!1},navigationEnable:{desktop:!1},speed:320,enableDrag:{desktop:!0},animationMode:"ease-out"};exports.DEFAULT_LIGHTBOX_IMAGE_ONLY=DEFAULT_LIGHTBOX_IMAGE_ONLY,exports.LIGHTBOX_CAROUSEL_SETTING=LIGHTBOX_CAROUSEL_SETTING,exports.LIGHTBOX_CAROUSEL_STYLES=LIGHTBOX_CAROUSEL_STYLES,exports.LIGHTBOX_GALLERY_CAROUSEL_SETTING=LIGHTBOX_GALLERY_CAROUSEL_SETTING;
|
package/dist/cjs/product/components/product-images-v3/composables/getProductImagesClassName.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var system=require("@gem-sdk/system"),classes=require("../common/classes.js"),common=require("../common/common.js");const getProductImagesClassName=s=>{let{setting:e,style:a}=s,l=common.setDefaultWhenUndefineSetting(s),{builderProps:t,advanced:r}=l,
|
|
1
|
+
"use strict";var system=require("@gem-sdk/system"),classes=require("../common/classes.js"),common=require("../common/common.js");const getProductImagesClassName=s=>{let{setting:e,style:a}=s,l=common.setDefaultWhenUndefineSetting(s),{builderProps:t,advanced:r}=l,g=r?.cssClass,m=system.createClass(classes.getWrapperClasses({extraClass:`${t?.uid} ${g??""} `,isAddOverFlowClass:common.checkAddOverFlowClass(a)})),c=system.createClass(classes.getGalleryWrapperClasses({})),C=system.createClass(classes.getGalleryGridWrapperClasses({})),o=s=>system.createClass(classes.getGalleryItemClasses({extraClass:`${s??""}`})),p=system.createClass(classes.getFtImageWithGalleryClasses({extraClass:`gp-product-images-feature--${t?.uid}`})),d=system.createClass(classes.getImageGalleryWrapperClasses({extraClass:`gp-product-images-gallery-${t?.uid}`})),u=system.createClass(classes.getFeaturedImageCarouselClasses({extraClass:`gp-product-images-gallery-${t?.uid}`})),y=system.createClass(classes.getFeaturedImageGalleryClasses({settings:e})),i=system.createClass(classes.getFeaturedImageClasses({setting:e,extraClass:`gp-flex gp-relative gp-product-images-gallery-${t?.uid} gp-overflow-hidden gp-flex gp-w-full gp-items-center gp-justify-center `})),n=s=>system.createClass(classes.getFeaturedCarouselItemClasses({extraClass:`${s??""}`}));return{wrapperClasses:m,productImagesGalleryClasses:c,galleryGridWrapperClasses:C,galleryItemClasses:o,ftImageGalleryClasses:p,imageGalleryWrapperClasses:d,featuredImageCarouselClasses:u,featuredImageGalleryClasses:y,featureImageOnlyOneImageClasses:i,featuredCarouselItemClasses:n}},galleryItemClasses=(s,e,a)=>system.createClass(classes.getGalleryItemClasses({extraClass:`${a??""} ${s===e?"gp-border-[#5EA2FF] gp-border-[3px]":"gp-border-white/20 hover:gp-border-white/60"}`}));exports.galleryItemClasses=galleryItemClasses,exports.getProductImagesClassName=getProductImagesClassName;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useState as e,useRef as t,useMemo as r,useCallback as i,useImperativeHandle as n,useEffect as a}from"react";import{useCurrentDevice as l,useEditorMode as s,useInteraction as o,getResponsiveValueByScreen as u,DEVICES as d}from"@gem-sdk/core";import
|
|
1
|
+
import{useState as e,useRef as t,useMemo as r,useCallback as i,useImperativeHandle as n,useEffect as a}from"react";import{useCurrentDevice as l,useEditorMode as s,useInteraction as o,getResponsiveValueByScreen as u,DEVICES as d}from"@gem-sdk/core";import f from"./useTrackPreviewPause.js";let useCarousel=(p,m,c,k)=>{let h;let{builderProps:b,moveToIdx:y,styles:P,setting:g,isHiddenArrowWhenDisabled:w=!0,elmRef:T,isEnableCheckHasScrollableContent:v,centerInsufficientSlides:N,onClickArrow:x,onHandleChangeSlideByInteraction:S,onChangeActive:C}=p,[O,E]=e(!0),[L,I]=e(!0),[M,z]=e(!1),{loop:V,navigationEnable:B={desktop:!0},navigationStyle:j}=g??{},[F,H]=e(k),[R,$]=e(g?.defaultCurrentSlider??0),{isFirstPreviewClicked:A}=f(g?.runPreview),D=t(),q=t(y??0),U=l(),W=s(),{onListener:G,saveToElementInteractionData:J,getInteractionPreviousData:K,trigger:Q}=o(),X=r(()=>u(V,U,!1),[V,U]),Y=i(()=>{if(!g?.slidesToShow)return null;let e={};return d.forEach(t=>{let r=u(g?.slidesToShow,t);e[t]=r?"auto"===r?4:Math.floor(r):0}),e},[g?.slidesToShow]),Z=i(()=>{if(!g?.slidesToShow)return null;let e={};return d.forEach(t=>{let r=u(g?.slidesToShow,t);e[t]=r?"auto"===r?4:r:0}),e},[g?.slidesToShow]),_=r(()=>{let e=Z();if(e)return e;let t={};return d.forEach(e=>{let r=u(g?.sneakPeak,e),i=r?"center"===u(g?.sneakPeakType,e)?u(g?.sneakPeakOffsetCenter,e)??0:u(g?.sneakPeakOffsetForward,e)??0:0,n="center"===u(g?.sneakPeakType,e)?-2:-1,a=u(g?.itemNumber,e);t[e]="number"==typeof a?a+i/100*n:"auto"}),t},[Z,g?.itemNumber,g?.sneakPeak,g?.sneakPeakOffsetCenter,g?.sneakPeakOffsetForward,g?.sneakPeakType]),ee=r(()=>{let e=u(_,U),t=u(V,U,!1);return t&&Number(e??0)>k||!t&&Number(e??0)>=k},[_,U,V,k]),et=r(()=>{let e=u(B,U),t=u(j,U);return c&&e&&"none"!==t&&O&&!ee},[B,U,j,c,O,ee]),er=r(()=>{let e=Y();return e||g?.itemNumber},[Y,g?.itemNumber]),ei=i(e=>{let t="center"===u(g?.sneakPeakType,e)?2:1;return"number"==typeof u(er,e,4)?u(er,e,4)-t:void 0},[g?.sneakPeakType,er]),en=()=>{let e="auto"===u(_,U,1)?1:u(_,U,1);return e??1},ea=e=>{let t=e*en();return t>=F-en()&&(t=F-en()),t},el=e=>{let t="edit"===W?{[e]:!1}:g?.enableDrag;return u(t,e)},es=(e,t)=>{let r=g?.sneakPeak?.[U]?e:t?e:ea(e);if(t){if(k<ec){c?.slideTo(r);return}if(c?.realIndex===r)return;if(r===Number(c?.realIndex)+1||0===r&&c?.realIndex===k-1)return c?.slideNext();if(r===Number(c?.realIndex)-1||r===k-1&&c?.realIndex===0)return c?.slidePrev();let e="center"===u(g?.sneakPeakType,U)&&"number"==typeof u(g?.itemNumber,U)&&Number(u(g?.itemNumber,U))%2==0;e?c?.slideToLoopCenterSneakPeek(r):c?.slideToLoop(r)}else c?.slideTo(r);q.current=r};n(m,()=>({nextSlideInteraction:ef,previousSlideInteraction:ep,moveToSlideInteraction:em,getSwiper:()=>c}));let eo=e=>{Q({event:"gp:rollback:select-slide",selector:`[data-id="${b?.uid}"]`,element:T?.current}),Q({event:"gp:select-slide",selector:`[data-id="${b?.uid}"]`,data:e,element:T?.current})},eu=e=>{c?.slideTo(e),S&&S(e)},ed=(e,t)=>{let{key:r,data:i,isRollback:n,element:a}=e,l=Math.max(c?.activeIndex??0,0);if(n&&void 0===i)return;if(n){if("specific"===t){let{previousData:e}=K(a,r);eu(Number(e))}else{let e="next"===t?l-1:l+1;eu(e)}return}let s="specific"===t?Math.max(q.current,0):l;J(a,r,s.toString());let o="specific"===t?Number(i):"next"===t?l+1:l-1;eu(o)},ef=e=>{ed(e,"next")},ep=e=>{ed(e,"previous")},em=e=>{ed(e,"specific")},ec=en(),ek=r(()=>!!F&&c&&u(g?.dot,U)&&!ee&&k>1,[F,c,g?.dot,U,ee,k]),eh=u(g?.vertical,U,!1)?"vertical":"horizontal",eb=e=>{let{swiperWidth:t,slidesPerView:r,itemNumberByDevice:i,centeredSlides:n}=e;if(!n||!i)return 0;let a=t/r,l=(Number(i)-2)/2-1;return-(a/2+l*a)},ey=r(()=>{let e=u(V,U,!1),t=c?.width??0,r={0:"mobile",768:"tablet",1025:"desktop"},i=Number(Object.entries(r).find(([,e])=>e===U)?.[0]??1025),n=Object.entries(r).reduce((e,[r,i])=>{if(!e)return;let n=Number(r),a=u(g?.sneakPeak,i,!1),l=a&&"center"===u(g?.sneakPeakType,i),s=u(g?.itemNumber,i),o=el(i),d=eb({swiperWidth:t,slidesPerView:ec,itemNumberByDevice:s,centeredSlides:l}),f=g?.initialSlide||y||0,p={allowTouchMove:o,slidesOffsetBefore:d,slidesOffsetAfter:d,initialSlide:f,centeredSlides:l};return e[n]=p,e},{}),a="center"===u(g?.sneakPeakType,U)&&"number"==typeof u(g?.itemNumber,U)&&Number(u(g?.itemNumber,U))>1;return{speed:P?.playSpeed??500,dir:g?.rtl?"rtl":"ltr",spaceBetween:u(P?.spacing,U)||0,loop:e,slidesPerView:"auto"===u(_,U,1)?"auto":ec,direction:eh,breakpoints:n,isSneakPeekCenter:a,slidesOffsetBefore:n?.[i]?.slidesOffsetBefore,thumbs:{slideThumbActiveClass:"gem-slider-item-active"},loopPreventsSliding:!1,autoplay:{delay:(g?.autoplayTimeout??1)*1e3,pauseOnMouseEnter:g?.pauseOnHover,stopOnLastSlide:!e},...N&&{centerInsufficientSlides:!0}}},[P?.playSpeed,g?.rtl,P?.spacing,U,V,ec,g?.sneakPeakType,g?.pauseOnHover,g?.autoplayTimeout,c?.width,F]),eP=i(e=>{let t=c&&c.params?.slidesPerView,r=t?c?.slidesPerViewDynamic():1;if(e<=1)return!1;let i="auto"===ey.slidesPerView?r:ey.slidesPerView;if(!X||e<Number(i)||!O)return!1;let n=u(g?.sneakPeak,U,!1),a=n&&"center"===u(g?.sneakPeakType,U),l=Number.isNaN(Number(i))?1:Math.ceil(Number(i));a&&l%2==0&&(l+=1);let s=a?Math.max(1,Math.ceil(l/2)):1;return e<l+s},[c,ey.slidesPerView,X,O,g?.sneakPeak,g?.sneakPeakType,U]);a(()=>{let e=`[data-id="${b?.uid}"]`;G({event:"gp:change-next-slide",selector:e,elementRef:D},e=>{let{data:t,isRollback:r,uniqueStorageKey:i}=e||{};ef({element:D.current,data:t,isRollback:r,key:i})}),G({event:"gp:change-previous-slide",selector:e,elementRef:D},e=>{let{data:t,isRollback:r,uniqueStorageKey:i}=e||{};ep({element:D.current,data:t,isRollback:r,key:i})}),G({event:"gp:change-image-step",selector:e,elementRef:D},e=>{let{data:t,isRollback:r,uniqueStorageKey:i}=e||{};em({element:D.current,data:t,isRollback:r,key:i})}),G({event:"gp:change-index-slide",selector:e},t=>{let r=document.querySelector(e),{data:i,isRollback:n,uniqueStorageKey:a}=t||{};em({element:r,data:i,isRollback:n,key:a})})},[]),a(()=>{H(k)},[k]);let eg=e=>{"next"===e?c?.slideNext():c?.slidePrev(),x&&(h&&clearTimeout(h),h=setTimeout(()=>x&&x(),500))};return a(()=>{if("number"==typeof y){if(q.current=y,c?.params?.loop){c?.slideToLoop(y);return}c?.slideTo(y)}},[c,y,w]),a(()=>{if(!c)return;let e=()=>{H(c.slides.length)},t=()=>{C&&C(c.realIndex)},r=()=>{$(c.realIndex),I(c?.translate===0),z(c?.translate<=c?.maxTranslate())};return c.on("transitionEnd",r),c.on("slideChange",e),c.on("slideChangeTransitionStart",t),()=>{c?.off("slideChange",e),c?.off("slideChangeTransitionStart",t),c?.off("transitionEnd",r)}},[ey.loop,c]),a(()=>{c?.wrapperEl&&(c.wrapperEl.style.transitionTimingFunction=g?.animationMode??"ease")},[c,g?.animationMode]),a(()=>{if(c&&c.autoplay){let e="edit"===W?!!A&&g?.runPreview&&g?.autoplay:g?.autoplay;e?c.autoplay.start():c.autoplay.stop()}},[c,g?.autoplay,W,A,g?.runPreview]),a(()=>{let e=e=>{if(b?.uid!==e?.detail.componentUid)return;let t=e?.detail.index||0;c?.slideToLoop(t)};return window.addEventListener("move-to-idx",e),()=>window.removeEventListener("move-to-idx",e)},[c,b?.uid]),a(()=>{if(!c)return;let e=c.el;e?.classList?.remove("swiper-horizontal","swiper-vertical");let t=u(g?.vertical,U)?"swiper-vertical":"swiper-horizontal";e?.classList?.add(t),c?.slides?.forEach(e=>{e.style.width="",e.style.height=""}),c?.update()},[U,g?.vertical,c,c?.params]),a(()=>{if(!c||!v)return;let e=()=>{let e=c?.slides?.slice(0,k)||[],t=Number(ey?.spaceBetween||0),r=e.reduce((e,t)=>e+t.offsetHeight,0)+t*(e.length-1),i=e.reduce((e,t)=>e+t.offsetWidth,0)+t*(e.length-1),n=c.params?.direction==="horizontal"?i>(c.width||0):r>(c.height||0);E(n)};return e(),c.on("resize",e),c.on("update",e),c.on("slidesLengthChange",e),c.on("orientationchange",e),()=>{c.off("resize",e),c.off("update",e),c.off("slidesLengthChange",e),c.off("orientationchange",e)}},[c]),{isInfinity:X,sliderSettings:ey,totalSlideItem:F,currentSlide:R,localRef:D,isRenderDots:ek,showNavigation:et,isScrollToStart:L,isScrollToEnd:M,handleDotClick:es,getItemsPerPage:en,handleNextAndPrevSlide:eg,dispatchEventSelectSlide:eo,getNumberOfFullWidthShow:ei,setCurrentSlide:$,shouldDuplicateSlides:eP,setIsScrollToStart:I,setIsScrollToEnd:z,isHideNavigation:ee}};export{useCarousel};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as e,Fragment as
|
|
2
|
+
import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import{cls as i,isEmptyChildren as r}from"@gem-sdk/core";import{useRef as l,useCallback as n,useEffect as p}from"react";import{createPortal as a}from"react-dom";import d from"../../grid/components/ChildrenDroppable.js";import c from"../hooks/useModalContainer.js";import g from"./ZoomButton.js";let Modal=({setting:s,styles:m,children:u,willUnmount:h,closeOnEscape:f,onKeypressEscape:w,keyCodeForClose:v,closeOnClickOutside:x,onClose:y,contentClass:C,wrapperContentClasses:b,disableIframeClickEvent:k,lockBodyScroll:L,zoomButton:N,closeButtonClassName:M})=>{let{open:A}=s??{},j=c(),Z=l(null),E=l(null),z=l(null),{isShowButton:B=!1,isZoomIn:J,onToggleZoom:O}=N??{},S=n(e=>{let t=e.code,o="Escape"===t;v?.includes(t),f&&o&&w?.(e)},[f,v,w]);p(()=>(document.addEventListener("keydown",S,!1),()=>{document.removeEventListener("keydown",S,!1),h?.()}),[S,h]);let D=n(e=>{let t=e.target===Z.current,o=e.target===E.current;(x&&t||o)&&(window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:!1}),"*"),y?.())},[x,y]);return(p(()=>{window?.parent?.postMessage?.(JSON.stringify({type:"active-modal",value:A}),"*")},[A]),p(()=>{if(!A||!L)return;let{style:e}=document.body;return z.current={overflow:e.overflow,touchAction:e.touchAction},e.overflow="hidden",e.touchAction="none",()=>{let t=z.current;t&&(e.overflow=t.overflow,e.touchAction=t.touchAction,z.current=null)}},[A,L]),j&&A)?a(e(t,{children:e("div",{className:"gp-fixed gp-inset-0 gp-z-50 gp-overflow-y-auto","data-disable-iframe-click-event":k||!1,children:o("div",{className:"gp-min-h-screen gp-px-4 gp-text-center",children:[e("div",{ref:Z,className:i("gp-fixed gp-inset-0 gp-bg-black/60 gp-backdrop-blur-sm gp-transition-all gp-duration-100",{"gp-opacity-100":A,"gp-opacity-0":!A}),onClick:D,"aria-hidden":!0}),e("span",{className:"gp-inline-block gp-h-screen gp-align-middle"}),o("div",{className:i("gp-relative gp-my-8 gp-inline-block gp-w-full gp-overflow-hidden gp-rounded gp-bg-white gp-p-6 gp-text-left gp-align-middle gp-shadow-xl gp-transition-all gp-duration-100",{"gp-max-w-2xl":!m?.width,"gp-scale-100 gp-opacity-100":A,"gp-scale-0 gp-opacity-0":!A},C),style:{width:m?.width},children:[e("div",{className:i("gp-absolute gp-right-[16px] gp-top-[16px] gp-z-10 gp-cursor-pointer",M??""),onClick:D,"aria-hidden":"true",children:e("svg",{ref:E,width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M11.1758 12.0241C11.4101 12.2584 11.79 12.2584 12.0243 12.0241C12.2586 11.7898 12.2586 11.4099 12.0243 11.1755L8.84858 7.9998L12.0243 4.82407C12.2586 4.58975 12.2586 4.20986 12.0243 3.97554C11.79 3.74123 11.4101 3.74123 11.1758 3.97554L8.00005 7.15128L4.82431 3.97554C4.59 3.74123 4.2101 3.74123 3.97578 3.97554C3.74147 4.20986 3.74147 4.58975 3.97578 4.82407L7.15152 7.9998L3.97579 11.1755C3.74147 11.4099 3.74147 11.7898 3.97579 12.0241C4.2101 12.2584 4.59 12.2584 4.82431 12.0241L8.00005 8.84833L11.1758 12.0241Z",fill:"#676767"})})}),B&&e(g,{isZoomIn:J,onToggleZoom:O}),e("div",{className:b,children:r(u)?e(d,{}):u})]})]})})}),j):null};export{Modal as default};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import{jsx as t}from"react/jsx-runtime";import{cls as C}from"@gem-sdk/core";import"react";let ZoomButton=({isZoomIn:e,onToggleZoom:o})=>{let i=()=>{o?.()},l=t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",children:t("path",{d:"M6.77246 0C10.5128 0 13.5448 3.03212 13.5449 6.77246C13.5449 8.41757 12.9568 9.9243 11.9814 11.0977L15.8115 14.9277C16.0556 15.1718 16.0555 15.5674 15.8115 15.8115C15.5674 16.0556 15.1718 16.0556 14.9277 15.8115L11.0977 11.9814C9.9243 12.9568 8.41757 13.5449 6.77246 13.5449C3.03212 13.5448 0 10.5128 0 6.77246C9.91359e-05 3.03218 3.03218 9.49436e-05 6.77246 0ZM6.77246 1.25C3.72254 1.25009 1.2501 3.72253 1.25 6.77246C1.25 9.82248 3.72247 12.2948 6.77246 12.2949C8.28607 12.2949 9.65677 11.6854 10.6543 10.6992C10.6614 10.6914 10.6673 10.6823 10.6748 10.6748C10.6824 10.6673 10.6914 10.6614 10.6992 10.6543C11.6854 9.65677 12.2949 8.28607 12.2949 6.77246C12.2948 3.72247 9.82247 1.25 6.77246 1.25ZM6.86328 3.40234C7.2082 3.40251 7.4881 3.68242 7.48828 4.02734V6.23828H9.69824C10.0433 6.23828 10.3231 6.51826 10.3232 6.86328C10.3231 7.20832 10.0433 7.48828 9.69824 7.48828H7.48828V9.69824C7.48828 10.0433 7.20832 10.3231 6.86328 10.3232C6.51822 10.3231 6.23828 10.0433 6.23828 9.69824V7.48828H4.02734C3.68238 7.48815 3.40251 7.20824 3.40234 6.86328C3.40252 6.51834 3.68239 6.23841 4.02734 6.23828H6.23828V4.02734C6.23846 3.6824 6.51833 3.40248 6.86328 3.40234Z",fill:"#AAAAAA"})}),r=t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",children:t("path",{d:"M8.77441 2C12.5157 2 15.5487 5.03247 15.5488 8.77344C15.5488 10.4191 14.9613 11.927 13.9854 13.1006L17.8164 16.9307C18.0602 17.1747 18.0603 17.5704 17.8164 17.8145C17.5724 18.0581 17.1766 18.0582 16.9326 17.8145L13.1016 13.9844C11.9279 14.9598 10.4199 15.5469 8.77441 15.5469C5.03309 15.5468 2 12.5145 2 8.77344C2.00009 5.0325 5.03314 2.00004 8.77441 2ZM8.77441 3.25C5.72333 3.25004 3.25009 5.72302 3.25 8.77344C3.25 11.8239 5.72327 14.2968 8.77441 14.2969C10.2896 14.2969 11.6611 13.6858 12.6592 12.6982C12.6655 12.6913 12.671 12.6835 12.6777 12.6768C12.6843 12.6702 12.6924 12.6644 12.6992 12.6582C13.6874 11.6603 14.2988 10.2887 14.2988 8.77344C14.2987 5.723 11.8255 3.25 8.77441 3.25ZM11.7012 8.23926C12.0463 8.23926 12.3262 8.51908 12.3262 8.86426C12.3259 9.20921 12.0462 9.48926 11.7012 9.48926H6.02832C5.68347 9.48906 5.40358 9.20909 5.40332 8.86426C5.40332 8.5192 5.68331 8.23945 6.02832 8.23926H11.7012Z",fill:"#AAAAAA"})});return t("button",{type:"button","aria-label":"Toggle zoom mode",className:C("gp-absolute gp-top-[74px] gp-right-4 gp-z-20 gp-flex gp-items-center gp-justify-center gp-text-[#AAAAAA] gp-transition"),onClick:i,children:e?r:l})};export{ZoomButton as default};
|
package/dist/esm/modal/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{openConfirm}from"./components/confirm.js";import"react/jsx-runtime";import"
|
|
1
|
+
export{openConfirm}from"./components/confirm.js";import"react/jsx-runtime";import"@gem-sdk/core";import"react";import"react-dom";import o from"./settings/Modal.js";let modalSetting={Modal:o};export{modalSetting};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{useMemo as r}from"react";import{useRenderMode as c}from"@gem-sdk/core";import i from"../../../product-images-v2/components/child/ProductFeatureVideo.js";import{isFeatureMedia as m}from"../../common/productFeaturedImage.js";import n from"../../../../../image/components/NextImage.js";import s from"./MediaIcon.js";import{DEFAULT_LIGHTBOX_IMAGE_ONLY as p}from"../lightbox/constants.js";let ProductImagesLightBoxPreview=({image:a})=>{let{isEditMode:l}=c(),g=r(()=>!l&&["VIDEO","EXTERNAL_VIDEO"].includes(a?.contentType||""),[l,a?.contentType]),d=r(()=>a?{...a,src:g?a.src:m(a?.contentType)?a?.previewImage:a.src}:p,[a,g]);return g?e(i,{type:d?.contentType,url:d.src??""}):t(o,{children:[e(n,{src:d.src,alt:d.alt,width:d.width,height:d.height,setting:{layout:{desktop:"cover",tablet:"cover",mobile:"cover"}},style:{width:"100%",height:"100%",cursor:"pointer",objectFit:"contain",objectPosition:"center"},className:"gp-h-full gp-w-full gallery-image-only"}),e(s,{contentType:d?.contentType??""})]})};export{ProductImagesLightBoxPreview as default};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import{jsx as e}from"react/jsx-runtime";import{useCurrentDevice as i,cls as r}from"@gem-sdk/core";import{useMemo as t}from"react";import o from"../../../../../carousel-v3/components/root/Carousel.js";import l from"../../../../../carousel-v3/components/item/CarouselItem.js";import m from"../child/ProductImagesLightBoxPreview.js";import{LIGHTBOX_CAROUSEL_SETTING as s,LIGHTBOX_CAROUSEL_STYLES as a}from"./constants.js";let LightBoxCarousel=({builderPropUID:g,displayImages:p,activeIndex:c,imageActiveIndex:n,onChangeSlide:d})=>{let u=i(),f="mobile"===u,h=t(()=>({...s,initialSlide:c,defaultCurrentSlider:c}),[c]);return e("div",{className:r(`gem-slider-item gem-slider-item-${g} gp-relative gp-h-full gp-w-full gp-overflow-hidden gp-cursor-zoom-in gp-flex gp-items-center gp-justify-center`),style:{maxWidth:f?"100vw":"calc(100vw - 150px)",maxHeight:"100vh"},children:e(o,{setting:h,styles:a,builderProps:{uid:`${g}-lightbox-main`},moveToIdx:c,isDisableResetSlide:!0,onChangeActive:d,children:p.map(i=>e(l,{className:"gp-flex gp-h-full gp-items-center gp-justify-center gp-cursor-zoom-in",children:e(m,{image:i})},i.id))})})};export{LightBoxCarousel as default};
|
package/dist/esm/product/components/product-images-v3/components/lightbox/LightBoxGalleryCarousel.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{useCurrentDevice as r}from"@gem-sdk/core";import{useRef as s,useState as i,useEffect as a}from"react";import l from"../../../../../carousel-v3/components/root/Carousel.js";import m from"../../../../../carousel-v3/components/item/CarouselItem.js";import n from"../../../../../image/components/NextImage.js";import c from"../../../product-images-v2/components/child/MediaIcon.js";import{isFeatureMedia as p}from"../../common/productFeaturedImage.js";import{getEditorMinHeightClass as d}from"../../common/productGallery.js";import{getProductImagesAttr as u}from"../../composables/getProductImagesAttr.js";import{getProductImagesStyles as g}from"../../composables/getProductImagesStyles.js";import{LIGHTBOX_GALLERY_CAROUSEL_SETTING as f}from"./constants.js";import{galleryItemClasses as h}from"../../composables/getProductImagesClassName.js";let LightBoxGalleryCarousel=({builderPropUID:y,displayImages:b,activeIndex:j,onChangeSlide:I})=>{let C=r(),x=s(!1),[v,w]=i(j);if(a(()=>{x.current||(x.current=!0,w(j))},[j]),b.length<=1)return null;let{galleryCarouselStyle:P,galleryCarouselItemStyle:T}=g(f),{galleryCarouselSettingAttrs:q}=u(f),A=d(C,f.position,f.navigationPosition);return e(l,{setting:q,styles:{...P},slidesClass:A,builderProps:{uid:`${y}-carousel`},rootClass:"gp-flex gp-justify-center gp-w-fit",moveToIdx:v,isHiddenArrowWhenDisabled:!0,disableMarginAuto:!0,isEnableCheckHasScrollableContent:!0,centerInsufficientSlides:!0,onChangeActive:w,children:b.map((r,s)=>{let i=p(r.contentType)?r.previewImage:r.src;return e(m,{"data-thumb-index":s,contentType:"productImage",className:h(s,j,"gp-overflow-hidden gp-rounded-md gp-border gp-transition-all"),onClickItem:()=>I(s),style:T,"data-id":r.id,children:t(o,{children:[e(n,{draggable:"false",src:i,width:r.width,height:r.height,alt:r.alt,setting:{layout:f.layout,qualityPercent:f.qualityPercent,qualityType:f.qualityType},style:{width:"100%",height:"100%",cursor:"pointer"},className:"product-images-lightbox-gallery-carousel-image"}),e(c,{contentType:r?.contentType??""})]})},r.id)})})};export{LightBoxGalleryCarousel as default};
|
package/dist/esm/product/components/product-images-v3/components/lightbox/LightBoxImageZoom.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import{jsx as e}from"react/jsx-runtime";import{useRef as r,useState as t,useEffect as n}from"react";import i from"../../../../../image/components/NextImage.js";let ZOOM_SCALE=2,LightBoxImageZoom=({image:o})=>{let a=r(null),l=r({x:0,y:0,originX:0,originY:0}),c=r(!1),[g,u]=t({x:0,y:0});n(()=>{u({x:0,y:0})},[o]);let p=(e,r)=>{let t=a.current?.getBoundingClientRect();if(!t)return{x:e,y:r};let n=1*t.width/2,i=1*t.height/2;return{x:Math.max(-n,Math.min(n,e)),y:Math.max(-i,Math.min(i,r))}},s=e=>{e.preventDefault(),e.stopPropagation(),c.current=!0,l.current={x:e.clientX,y:e.clientY,originX:g.x,originY:g.y},e.currentTarget.setPointerCapture(e.pointerId)},m=e=>{if(!c.current)return;let r=e.clientX-l.current.x,t=e.clientY-l.current.y,n=p(l.current.originX+r,l.current.originY+t);u(n)},f=e=>{c.current&&(c.current=!1,e.currentTarget.hasPointerCapture(e.pointerId)&&e.currentTarget.releasePointerCapture(e.pointerId))};return o.src?e("div",{ref:a,className:"gp-h-full gp-w-full gp-overflow-hidden gp-cursor-grab active:gp-cursor-grabbing",onPointerDown:s,onPointerMove:m,onPointerUp:f,onPointerCancel:f,onPointerLeave:f,onDragStart:e=>e.preventDefault(),style:{touchAction:"none"},children:e("div",{className:"gp-h-full gp-w-full",style:{transform:`translate3d(${g.x}px, ${g.y}px, 0) scale(2)`,transformOrigin:"center center",willChange:"transform"},children:e(i,{src:o.src||"",alt:o.alt||"Product image",draggable:!1,className:"gp-h-full gp-w-full gp-pointer-events-none",style:{objectFit:"contain"}})})}):e("div",{className:"gp-h-full gp-w-full"})};export{LightBoxImageZoom as default};
|
package/dist/esm/product/components/product-images-v3/components/lightbox/ProductImagesLightBox.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{useFeaturedImageGlobal as
|
|
2
|
+
import{jsx as e,jsxs as t,Fragment as o}from"react/jsx-runtime";import{useFeaturedImageGlobal as p,useCurrentDevice as l}from"@gem-sdk/core";import{useState as i,useMemo as g,useEffect as r}from"react";import"../../../../../modal/components/confirm.js";import s from"../../../../../modal/components/Modal.js";import n from"./LightBoxCarousel.js";import m from"./LightBoxGalleryCarousel.js";import a from"./LightBoxImageZoom.js";let ProductImagesLightBox=({builderPropUID:c,productImages:d,open:x,onHandleClose:u})=>{let f=p(),h=l(),I="mobile"===h,[y,v]=i(!1),[w,C]=i(0),b=g(()=>(d||[]).map((e,t)=>({...e,id:e.id||`gp-lightbox-${t}`,src:e.src||e.previewImage,alt:e.alt||"Product image"})),[d]),j=g(()=>!["VIDEO","EXTERNAL_VIDEO","MODEL_3D"].includes(b[w]?.contentType||""),[b,w]),B=g(()=>{let e=b.findIndex(e=>e.id===f?.id);return e&&e>0?e:0},[b,f]);r(()=>{x&&(v(!1),C(B))},[x]);let A=()=>{v(e=>!e)};return e(s,{setting:{open:x},styles:{width:"calc(100% + 2rem)"},closeOnClickOutside:!0,closeOnEscape:!0,onKeypressEscape:()=>u(),onClose:()=>{u()},lockBodyScroll:!0,disableIframeClickEvent:!0,contentClass:"!gp--mx-4 !gp-my-auto !gp-h-screen !gp-max-w-none !gp-rounded-none !gp-bg-[#0F0F10] !gp-px-0 !gp-py-0 !gp-text-white",zoomButton:{isShowButton:j,isZoomIn:y,onToggleZoom:A},closeButtonClassName:"gp-top-[34px] gp-text-[#AAAAAA] gp-scale-125",wrapperContentClasses:"gp-flex gp-h-full gp-w-full gp-items-center gp-justify-center",children:e("div",{className:"gp-relative gp-flex gp-h-full gp-w-full gp-flex-col gp-items-center gp-justify-center",children:y?e(a,{image:b[w]}):t(o,{children:[e("div",{className:"gp-flex gp-flex-1 gp-items-center gp-justify-center gp-overflow-hidden gp-px-0",children:e(n,{builderPropUID:c,displayImages:b,activeIndex:w,imageActiveIndex:B,onChangeSlide:C})}),e("div",{className:"gp-z-20 gp-absolute gp-bottom-2 mobile:gp-bottom-[28px] gp-left-0 gp-right-0 gp-flex gp-justify-center gp-mx-auto",style:{maxWidth:I?"100vw":"calc(100vw - 150px)"},children:e(m,{builderPropUID:c,displayImages:b,activeIndex:w,onChangeSlide:C})})]})})})};export{ProductImagesLightBox as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
let LIGHTBOX_GALLERY_CAROUSEL_SETTING={loop:{desktop:!0},corner:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"},shapeForBottom:{desktop:{shape:"square",height:"80px",shapeValue:"1/1",width:"80px",shapeLinked:!0,gap:""},tablet:{shape:"square",height:"80px",shapeValue:"1/1",width:"80px",shapeLinked:!0,gap:""},mobile:{shape:"square",height:"64px",shapeValue:"1/1",width:"64px",shapeLinked:!0,gap:""}},position:{desktop:"bottom-center"},navigationPosition:{desktop:"outside",tablet:"outside",mobile:"none"},borderActive:{borderType:"none",border:"solid",borderWidth:"3px",width:"1px 1px 1px 1px",isCustom:!0,color:"#3C67FF"},layout:{desktop:"cover"},qualityPercent:{desktop:100},qualityType:{desktop:"high"},itemSpacing:{desktop:"8px"},animationMode:"ease-out"},DEFAULT_LIGHTBOX_IMAGE_ONLY={src:"https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",id:"noImageError",width:480,height:480,alt:"no image",contentType:"IMAGE"},LIGHTBOX_CAROUSEL_STYLES={sizeSetting:{desktop:{width:"100%",height:"100%"}}},LIGHTBOX_CAROUSEL_SETTING={slidesToShow:{desktop:1},loop:{desktop:!1},dot:{desktop:!1},navigationEnable:{desktop:!1},speed:320,enableDrag:{desktop:!0},animationMode:"ease-out"};export{DEFAULT_LIGHTBOX_IMAGE_ONLY,LIGHTBOX_CAROUSEL_SETTING,LIGHTBOX_CAROUSEL_STYLES,LIGHTBOX_GALLERY_CAROUSEL_SETTING};
|
package/dist/esm/product/components/product-images-v3/composables/getProductImagesClassName.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{createClass as
|
|
1
|
+
import{createClass as e}from"@gem-sdk/system";import{getWrapperClasses as s,getGalleryWrapperClasses as r,getGalleryGridWrapperClasses as a,getFtImageWithGalleryClasses as t,getImageGalleryWrapperClasses as l,getFeaturedImageCarouselClasses as g,getFeaturedImageGalleryClasses as o,getFeaturedImageClasses as m,getGalleryItemClasses as p,getFeaturedCarouselItemClasses as d}from"../common/classes.js";import{checkAddOverFlowClass as i,setDefaultWhenUndefineSetting as u}from"../common/common.js";let getProductImagesClassName=C=>{let{setting:c,style:x}=C,$=u(C),{builderProps:f,advanced:n}=$,y=n?.cssClass,w=e(s({extraClass:`${f?.uid} ${y??""} `,isAddOverFlowClass:i(x)})),b=e(r({})),h=e(a({})),v=s=>e(p({extraClass:`${s??""}`})),I=e(t({extraClass:`gp-product-images-feature--${f?.uid}`})),j=e(l({extraClass:`gp-product-images-gallery-${f?.uid}`})),F=e(g({extraClass:`gp-product-images-gallery-${f?.uid}`})),A=e(o({settings:c})),N=e(m({setting:c,extraClass:`gp-flex gp-relative gp-product-images-gallery-${f?.uid} gp-overflow-hidden gp-flex gp-w-full gp-items-center gp-justify-center `})),P=s=>e(d({extraClass:`${s??""}`}));return{wrapperClasses:w,productImagesGalleryClasses:b,galleryGridWrapperClasses:h,galleryItemClasses:v,ftImageGalleryClasses:I,imageGalleryWrapperClasses:j,featuredImageCarouselClasses:F,featuredImageGalleryClasses:A,featureImageOnlyOneImageClasses:N,featuredCarouselItemClasses:P}},galleryItemClasses=(s,r,a)=>e(p({extraClass:`${a??""} ${s===r?"gp-border-[#5EA2FF] gp-border-[3px]":"gp-border-white/20 hover:gp-border-white/60"}`}));export{galleryItemClasses,getProductImagesClassName};
|
package/dist/types/index.d.ts
CHANGED
|
@@ -887,6 +887,7 @@ type CarouselProps$1 = BasePropsWrap<CarouselSettingProps$1, CarouselStyleProps$
|
|
|
887
887
|
slidesClass?: string;
|
|
888
888
|
conditionAppendJs?: string;
|
|
889
889
|
isEnableCheckHasScrollableContent?: boolean;
|
|
890
|
+
centerInsufficientSlides?: boolean;
|
|
890
891
|
};
|
|
891
892
|
type CarouselItemProps$1 = {
|
|
892
893
|
parentStyle?: CarouselProps$1['styles'];
|
|
@@ -940,6 +941,7 @@ declare const Carousel$3: React.ForwardRefExoticComponent<_gem_sdk_core.BaseProp
|
|
|
940
941
|
slidesClass?: string | undefined;
|
|
941
942
|
conditionAppendJs?: string | undefined;
|
|
942
943
|
isEnableCheckHasScrollableContent?: boolean | undefined;
|
|
944
|
+
centerInsufficientSlides?: boolean | undefined;
|
|
943
945
|
} & React.RefAttributes<CarouselRef$1>>;
|
|
944
946
|
|
|
945
947
|
declare const CarouselItem$3: React.FC<CarouselItemProps$1>;
|
|
@@ -2375,9 +2377,17 @@ type ModalProps = BaseProps<ModalSettingProps, ModalStyleProps> & {
|
|
|
2375
2377
|
onClose?: () => void;
|
|
2376
2378
|
onKeypressEscape?: (e: KeyboardEvent) => void;
|
|
2377
2379
|
unmount?: boolean;
|
|
2380
|
+
lockBodyScroll?: boolean;
|
|
2378
2381
|
children: React.ReactNode;
|
|
2379
2382
|
disableIframeClickEvent?: boolean;
|
|
2380
2383
|
contentClass?: string;
|
|
2384
|
+
zoomButton?: {
|
|
2385
|
+
isShowButton: boolean;
|
|
2386
|
+
isZoomIn: boolean;
|
|
2387
|
+
onToggleZoom: () => void;
|
|
2388
|
+
};
|
|
2389
|
+
closeButtonClassName?: string;
|
|
2390
|
+
wrapperContentClasses?: string;
|
|
2381
2391
|
};
|
|
2382
2392
|
type ButtonConfig = {
|
|
2383
2393
|
label?: string;
|
|
@@ -6409,6 +6419,7 @@ declare const _default$3: {
|
|
|
6409
6419
|
slidesClass?: string | undefined;
|
|
6410
6420
|
conditionAppendJs?: string | undefined;
|
|
6411
6421
|
isEnableCheckHasScrollableContent?: boolean | undefined;
|
|
6422
|
+
centerInsufficientSlides?: boolean | undefined;
|
|
6412
6423
|
} & React.RefAttributes<CarouselRef$1>>;
|
|
6413
6424
|
CarouselItemV3: React.ComponentType<CarouselItemProps$1>;
|
|
6414
6425
|
Carousel: React.ComponentType<_gem_sdk_core.BaseProps<CarouselSettingProps, CarouselStyleProps, Record<string, any>> & {
|
|
@@ -7374,6 +7385,7 @@ declare const _default$2: {
|
|
|
7374
7385
|
slidesClass?: string | undefined;
|
|
7375
7386
|
conditionAppendJs?: string | undefined;
|
|
7376
7387
|
isEnableCheckHasScrollableContent?: boolean | undefined;
|
|
7388
|
+
centerInsufficientSlides?: boolean | undefined;
|
|
7377
7389
|
} & React.RefAttributes<CarouselRef$1>>;
|
|
7378
7390
|
CarouselItemV3: React.FC<CarouselItemProps$1>;
|
|
7379
7391
|
Carousel: React.ForwardRefExoticComponent<_gem_sdk_core.BaseProps<CarouselSettingProps, CarouselStyleProps, Record<string, any>> & {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gem-sdk/components",
|
|
3
|
-
"version": "12.0.0-dev.
|
|
3
|
+
"version": "12.0.0-dev.127",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@gem-sdk/keen-slider": "^6.8.8",
|
|
44
|
-
"@gem-sdk/swiper": "0.0.
|
|
44
|
+
"@gem-sdk/swiper": "0.0.15-dev.1",
|
|
45
45
|
"node-html-parser": "^6.1.13",
|
|
46
46
|
"react-transition-group": "^4.4.5",
|
|
47
47
|
"react-youtube": "10.1.0"
|