@gem-sdk/components 17.0.0-dev.26 → 17.0.0-dev.28

package/dist/cjs/product/components/product-badge/ProductBadge.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),s=require("./utils/common.js");require("./constants.js");var r=require("../../../common/components/NoDataState.js"),a=require("../../../common/components/TooltipHover.js"),l=require("@gem-sdk/system"),n=require("./common/attrs.js"),o=require("./common/classes.js"),c=require("./common/styles.js");exports.default=i=>{let{t:u}=t.useI18nStore(),{setting:d,styles:m,children:g,builderAttrs:C,...y}=i,p=t.useProduct(),j=t.useCurrentVariant(),{moneyFormat:x}=t.useMoneyFormat(),S=t.useCurrentDevice(),{useProductCompareAtPrice:T}=t.useProductBundleDiscount(),v=y?.["bundle-item"],A=t.useEditorMode(),{isEditMode:N}=t.useRenderMode(),h="STATIC"===t.usePageType(),q=s.getBadgeContent({detail:p,currentVariant:j,bundleItem:v,useProductCompareAtPrice:T},d?.displayContent,x),I=s.getIsNoDiscountState({props:i,product:p,currentVariant:j,moneyFormat:x,useProductCompareAtPrice:T}),f=l.createClass({...o.getContainerClasses({mode:A,isInstant:h,product:p,currentVariant:j,props:i})}),b=l.createStyle({...c.getContainerStyle(i)}),W=l.createAttr({...n.getEditTooltipAttrs(i)}),M=l.createClass({...o.getWrapperClasses(i)}),P=l.createClass({...o.getSubWrapperClass(i,S)}),D=l.createStyle({...c.getSubWrapperStyle({props:i,product:p,currentVariant:j,isEditMode:N})}),B=l.createAttr({...n.getSubWrapperAttrs(i,p)}),k=c.getContentStyleInternal(i),w=l.createClass({...o.getTextContainerClasses()}),E=l.createAttr({...n.getContainerAttrs(i)}),_=l.createClass({...o.getTextWrapperClasses()}),F=l.createStyle({...c.getTextBadgeWrapperStyles({setting:d,styles:m})}),H=l.createClass({...o.getTextContentClasses(m)}),O=l.createStyle({...c.getTextContentStyle({setting:d,styles:m})}),R=l.createAttr({...n.getTextContentAttrs()}),V=l.createClass({...o.getImageContainerClasses()}),z=l.createStyle({...c.getImageContainerStyles({setting:d,styles:m})}),G=l.createClass({...o.getImageClasses()}),J=l.createAttr({...n.getImageAttr({setting:d})});return p?e.jsxs("div",{...E,style:b,className:f,children:[l.If(N&&I,e.jsx(a.default,{...W,children:e.jsx(r.default,{...C,elementType:"secondary",description:u("No discount"),rawMode:!0})}),e.jsx("div",{className:M,children:e.jsxs("div",{...B,className:P,style:D,children:[e.jsx("style",{children:k}),l.If(d?.shape!=="image",e.jsx("div",{className:w,children:e.jsx("div",{className:_,style:F,children:e.jsx("pre",{...R,className:H,style:O,children:q})})}),e.jsx("div",{className:V,style:z,children:e.jsx("img",{...J,className:G,alt:""})}))]})})),t.filterToolbarPreview(g,!0)]}):null};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),s=require("./utils/common.js");require("./constants.js");var r=require("../../../common/components/NoDataState.js"),a=require("../../../common/components/TooltipHover.js"),l=require("@gem-sdk/system"),n=require("./common/attrs.js"),o=require("./common/classes.js"),c=require("./common/styles.js");exports.default=i=>{let{t:u}=t.useI18nStore(),{setting:d,styles:m,children:g,builderAttrs:C,...y}=i,p=t.useProduct(),j=t.useCurrentVariant(),{moneyFormat:x}=t.useMoneyFormat(),S=t.useCurrentDevice(),{useProductCompareAtPrice:T}=t.useProductBundleDiscount(),v=y?.["bundle-item"],A=t.useEditorMode(),{isEditMode:N}=t.useRenderMode(),h="STATIC"===t.usePageType(),q=s.getBadgeContent({detail:p,currentVariant:j,bundleItem:v,useProductCompareAtPrice:T},d?.displayContent,x),I=s.getIsNoDiscountState({props:i,product:p,currentVariant:j,moneyFormat:x,useProductCompareAtPrice:T}),f=l.createClass({...o.getContainerClasses({mode:A,isInstant:h,product:p,currentVariant:j,props:i})}),b=l.createStyle({...c.getContainerStyle(i)}),W=l.createAttr({...n.getEditTooltipAttrs(i,N)}),M=l.createClass({...o.getWrapperClasses(i)}),P=l.createClass({...o.getSubWrapperClass(i,S)}),D=l.createStyle({...c.getSubWrapperStyle({props:i,product:p,currentVariant:j,isEditMode:N})}),B=l.createAttr({...n.getSubWrapperAttrs(i,p)}),k=c.getContentStyleInternal(i),w=l.createClass({...o.getTextContainerClasses()}),E=l.createAttr({...n.getContainerAttrs(i)}),_=l.createClass({...o.getTextWrapperClasses()}),F=l.createStyle({...c.getTextBadgeWrapperStyles({setting:d,styles:m})}),H=l.createClass({...o.getTextContentClasses(m)}),O=l.createStyle({...c.getTextContentStyle({setting:d,styles:m})}),R=l.createAttr({...n.getTextContentAttrs()}),V=l.createClass({...o.getImageContainerClasses()}),z=l.createStyle({...c.getImageContainerStyles({setting:d,styles:m})}),G=l.createClass({...o.getImageClasses()}),J=l.createAttr({...n.getImageAttr({setting:d})});return p?e.jsxs("div",{...E,style:b,className:f,children:[l.If(N&&I,e.jsx(a.default,{...W,children:e.jsx(r.default,{...C,elementType:"secondary",description:u("No discount"),rawMode:!0})}),e.jsx("div",{className:M,children:e.jsxs("div",{...B,className:P,style:D,children:[e.jsx("style",{children:k}),l.If(d?.shape!=="image",e.jsx("div",{className:w,children:e.jsx("div",{className:_,style:F,children:e.jsx("pre",{...R,className:H,style:O,children:q})})}),e.jsx("div",{className:V,style:z,children:e.jsx("img",{...J,className:G,alt:""})}))]})})),t.filterToolbarPreview(g,!0)]}):null};

package/dist/cjs/product/components/product-badge/common/attrs.js

@@ -1 +1 @@
-"use strict";var t=require("@gem-sdk/core");exports.getContainerAttrs=t=>{let{builderAttrs:e,builderProps:r}=t;return{...e,"data-id":r?.uid||"",id:`g-product-badge-${r?.uid}`,"gp-data-hidden":"false"}},exports.getEditTooltipAttrs=e=>{let{setting:r}=e,i=r?.positionWithImage==="outside";return{enable:!0,text:t.t("Not be displayed when published"),position:i?"bottom":"right",width:"205px"}},exports.getImageAttr=({setting:t})=>({src:t?.image?.src,alt:t?.image?.alt,loading:"lazy"}),exports.getSubWrapperAttrs=(t,e)=>{let{builderProps:r}=t,i=e?e?.baseID?.replace("gid://shopify/Product/",""):"";return{"data-product-id":i||"",id:r?.uid||""}},exports.getTextContentAttrs=()=>({id:"product-badge-content"});
+"use strict";var t=require("@gem-sdk/core");exports.getContainerAttrs=t=>{let{builderAttrs:e,builderProps:r}=t;return{...e,"data-id":r?.uid||"",id:`g-product-badge-${r?.uid}`,"gp-data-hidden":"false"}},exports.getEditTooltipAttrs=(e,r)=>{let{setting:i}=e,d=i?.positionWithImage==="outside";return{enable:!0,text:r&&t.t("Not be displayed when published"),position:d?"bottom":"right",width:"205px"}},exports.getImageAttr=({setting:t})=>({src:t?.image?.src,alt:t?.image?.alt,loading:"lazy"}),exports.getSubWrapperAttrs=(t,e)=>{let{builderProps:r}=t,i=e?e?.baseID?.replace("gid://shopify/Product/",""):"";return{"data-product-id":i||"",id:r?.uid||""}},exports.getTextContentAttrs=()=>({id:"product-badge-content"});

package/dist/cjs/product/components/product-description/hooks/useGpDescription.js

@@ -1 +1 @@
-"use strict";var e=require("react"),t=require("@gem-sdk/core");exports.useGpDescription=r=>{let s=e.useRef(null),[u,i]=e.useState(!1),[l,n]=e.useState(!1),a=t.useProduct(),c=t.useCurrentDevice(),o=t.getResponsiveValueByScreen(r?.hasLineClamp,c),p=t.getResponsiveValueByScreen(r?.lineClamp,c),{redirectProductShopifyLink:d}=t.useProductShopifyEditLink(),g=t.useEditorMode(),h=e.useCallback(()=>`calc(${p} * 1lh)`,[p]),m=e.useCallback(e=>o&&p&&e||"auto",[o,p]),y=e.useCallback(()=>{s.current&&(s.current.style.maxHeight=u?h():"none",i(e=>!e))},[u,h]);return e.useEffect(()=>{m(h())},[r?.typo?.custom,m,h]),e.useEffect(()=>{let e=s.current;if(i(!1),!e)return;let r=o&&a?.descriptionHtml;r?setTimeout(()=>{let r=e?.scrollHeight??0,s=e?.clientHeight??0,u=window.getComputedStyle(e).getPropertyValue("line-height"),i=parseInt(u,10)||1,l=void 0!==p&&p<Math.round((r??0)/i),a=t.isSafari()?l:s<r;e.style.maxHeight=h(),p&&a?n(()=>!0):n(()=>!1)},100):e.style.maxHeight="none"},[o,p,a?.descriptionHtml,h]),{ref:s,open:u,isShowViewMore:l,handleToggleShowMore:y,mode:g,redirectProductShopifyLink:d}};
+"use strict";var e=require("react"),t=require("@gem-sdk/core");exports.useGpDescription=r=>{let s=e.useRef(null),[u,i]=e.useState(!1),[l,n]=e.useState(!1),a=t.useProduct(),c=t.useCurrentDevice(),o=t.getResponsiveValueByScreen(r?.hasLineClamp,c),p=t.getResponsiveValueByScreen(r?.lineClamp,c),{redirectProductShopifyLink:g}=t.useProductShopifyEditLink(),m=t.useEditorMode(),d=e.useCallback(()=>`calc(${p} * 1lh)`,[p]),h=e.useCallback(e=>o&&p&&e||"auto",[o,p]),y=e.useCallback(()=>{s.current&&(s.current.style.maxHeight=u?d():"none",i(e=>!e))},[u,d]);return e.useEffect(()=>{h(d())},[r?.typo?.custom,h,d]),e.useEffect(()=>{let e=s.current;if(i(!1),!e)return;let r=o&&a?.descriptionHtml;r?setTimeout(()=>{let r=e?.scrollHeight??0,s=e?.clientHeight??0,u=window.getComputedStyle(e).getPropertyValue("line-height"),i=parseInt(u,10)||1,l=p&&r>p*i,a=t.isSafari()?l:s<r;e.style.maxHeight=d(),p&&a?n(()=>!0):n(()=>!1)},100):e.style.maxHeight="none"},[o,p,a?.descriptionHtml,d]),{ref:s,open:u,isShowViewMore:l,handleToggleShowMore:y,mode:m,redirectProductShopifyLink:g}};

package/dist/cjs/video/common/helpers.js

@@ -1 +1 @@
-"use strict";var e=require("@gem-sdk/core"),t=require("../../helpers.js"),o=require("../settings/configs/translate.js");const i=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=|shorts\/)|youtu\.be\/)([^"&?/\s]{11})/i;exports.covertStrParamsToObj=e=>{let t=e.split("&");return t.shift(),t.reduce((e,t)=>{let[o,i]=t.split("=");return"loop"!==o&&(e[o]=i),e},{})},exports.fallbackImageVideoUrl="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",exports.getAspectRatioSettings=(t,o)=>{let i={desktop:t?.desktop?.width,tablet:t?.tablet?.width,mobile:t?.mobile?.width},s={desktop:t?.desktop?.height,tablet:t?.tablet?.height,mobile:t?.mobile?.height},r={desktop:o?.desktop==="custom"?`${e.getResponsiveValueByScreen(i,"desktop")}/${e.getResponsiveValueByScreen(s,"desktop")}`:o?.desktop==="cover"?"unset":o?.desktop,tablet:o?.tablet==="custom"?`${e.getResponsiveValueByScreen(i,"tablet")}/${e.getResponsiveValueByScreen(s,"tablet")}`:o?.tablet==="cover"?"unset":o?.tablet,mobile:o?.mobile==="custom"?`${e.getResponsiveValueByScreen(i,"mobile")}/${e.getResponsiveValueByScreen(s,"mobile")}`:o?.mobile==="cover"?"unset":o?.mobile};return r},exports.getSettingTranslatedVideoAndThumbnail=({setting:i,uid:s,pageContext:r})=>{if(!i||!s)return{};if(r?.isPreviewing)return i;let l=e.cloneDeep(i);if(l.youtubeUrl&&"youtube"===l.type){let e=t.getDynamicSourceLocales({val:l.youtubeUrl,uid:s,settingId:t.createSettingId({id:o.Video?.youtubeUrl?.id}),pageContext:r});l.youtubeUrlTranslated=String(e)}if(l.vimeoUrl&&"vimeo"===l.type){let e=t.getDynamicSourceLocales({val:l.vimeoUrl,uid:s,settingId:t.createSettingId({id:o.Video?.vimeoUrl?.id}),pageContext:r});l.vimeoUrlTranslated=String(e)}if(l.html5Url&&"html5"===l.type){let e=t.getDynamicSourceLocales({val:l.html5Url,uid:s,settingId:t.createSettingId({id:o.Video?.html5Url?.id}),pageContext:r});l.html5Url=String(e)}if(l.poster){let e=t.getDynamicSourceLocales({val:l.poster?.src,uid:s,settingId:o.Video?.poster?.id?`${o.Video.poster.id}_src`:"",pageContext:r});l.poster.src=String(e)}return l},exports.getVimeoParams=e=>{let{id:t,autoplay:o,muted:i,controls:s,loop:r,lazy:l}=e,a=encodeURIComponent(t),p=`?&autoplay=${l?1:o?1:0}&muted=${i?1:0}&loop=${r?1:0}&controls=${s}&autopause=false`,n=`https://player.vimeo.com/video/${a}${p}`;return{videoId:a,params:p,iframeSrc:n}},exports.getVimeoVideoId=e=>e.match(/https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/|video\/)?(\d+)(?:$|\/|\?)/)?.[3],exports.getYoutubeParams=e=>{let{id:t,params:o,muted:i,webp:s,controls:r,adNetwork:l,autoplay:a,lazy:p,thumbnail:n}=e,d=encodeURIComponent(t),u="hqdefault",m=`${o}`||"",c=i?"&mute=1":"",b=s?"webp":"jpg",g=s?"vi_webp":"vi",v=e.thumbnail||`https://i.ytimg.com/${g}/${d}/${u}.${b}`,h=e.noCookie?"https://www.youtube-nocookie.com":"https://www.youtube.com",y=`${h}/embed/${d}?autoplay=${!!p||!!n||a}&state=1${c}${m}&controls=${r?1:0}`;return{videoId:d,posterImp:u,paramsImp:m,mutedImp:c,format:b,vi:g,posterUrl:v,ytUrl:h,iframeSrc:y,adNetworkImp:l||!1}},exports.getYoutubeVideoId=e=>{let t=e.match(i);return t?.[1]??void 0},exports.isSettingLoop=e=>e.includes("loop=1"),exports.makeStyleResponsiveRatio=(e,t)=>({[`--${e}`]:t?.desktop,[`--${e}-tablet`]:t?.tablet,[`--${e}-mobile`]:t?.mobile}),exports.parseTimeVideo=e=>{let t=e.split(":",2);return t.length<=1?parseInt(t[0]||"0"):60*parseInt(t[0]||"0")+parseInt(t[1]||"0")},exports.vimeoVideoRegex=/^(?:http:\/\/|https:\/\/)vimeo\.com\/[\w/]+(?:\?.*)?$/im,exports.youtubeVideoRegex=i;
+"use strict";var e=require("@gem-sdk/core"),t=require("../../helpers.js"),o=require("../settings/configs/translate.js");const i=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=|shorts\/)|youtu\.be\/)([^"&?/\s]{11})/i;exports.covertStrParamsToObj=e=>{let t=e.split("&");return t.shift(),t.reduce((e,t)=>{let[o,i]=t.split("=");return"loop"!==o&&(e[o]=i),e},{})},exports.fallbackImageVideoUrl="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",exports.getAspectRatioSettings=(t,o)=>{let i={desktop:t?.desktop?.width,tablet:t?.tablet?.width,mobile:t?.mobile?.width},s={desktop:t?.desktop?.height,tablet:t?.tablet?.height,mobile:t?.mobile?.height},r={desktop:o?.desktop==="custom"?`${e.getResponsiveValueByScreen(i,"desktop")}/${e.getResponsiveValueByScreen(s,"desktop")}`:o?.desktop==="cover"?"unset":o?.desktop,tablet:o?.tablet==="custom"?`${e.getResponsiveValueByScreen(i,"tablet")}/${e.getResponsiveValueByScreen(s,"tablet")}`:o?.tablet==="cover"?"unset":o?.tablet,mobile:o?.mobile==="custom"?`${e.getResponsiveValueByScreen(i,"mobile")}/${e.getResponsiveValueByScreen(s,"mobile")}`:o?.mobile==="cover"?"unset":o?.mobile};return r},exports.getSettingTranslatedVideoAndThumbnail=({setting:i,uid:s,pageContext:r})=>{if(!i||!s)return{};if(r?.isPreviewing)return i;let l=e.cloneDeep(i);if(l.youtubeUrl&&"youtube"===l.type){let e=t.getDynamicSourceLocales({val:l.youtubeUrl,uid:s,settingId:t.createSettingId({id:o.Video?.youtubeUrl?.id}),pageContext:r});l.youtubeUrlTranslated=String(e)}if(l.vimeoUrl&&"vimeo"===l.type){let e=t.getDynamicSourceLocales({val:l.vimeoUrl,uid:s,settingId:t.createSettingId({id:o.Video?.vimeoUrl?.id}),pageContext:r});l.vimeoUrlTranslated=String(e)}if(l.html5Url&&"html5"===l.type){let e=t.getDynamicSourceLocales({val:l.html5Url,uid:s,settingId:t.createSettingId({id:o.Video?.html5Url?.id}),pageContext:r});l.html5Url=String(e)}if(l.poster){let e=t.getDynamicSourceLocales({val:l.poster?.src,uid:s,settingId:o.Video?.poster?.id?`${o.Video.poster.id}_src`:"",pageContext:r});l.poster.src=String(e)}return l},exports.getVimeoParams=e=>{let{id:t,autoplay:o,muted:i,controls:s,loop:r,lazy:l}=e,a=encodeURIComponent(t),p=`?&autoplay=${l?1:o?1:0}&muted=${i?1:0}&loop=${r?1:0}&controls=${s}&autopause=false`,n=`https://player.vimeo.com/video/${a}${p}`;return{videoId:a,params:p,iframeSrc:n}},exports.getVimeoVideoId=e=>e.match(/https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/|video\/)?(\d+)(?:$|\/|\?)/)?.[3],exports.getYoutubeParams=e=>{let{id:t,params:o,muted:i,webp:s,controls:r,adNetwork:l,autoplay:a,lazy:p,thumbnail:n}=e,d=encodeURIComponent(t),u="hqdefault",m=`${o}`||"",c=i?"&mute=1":"",b=s?"webp":"jpg",g=s?"vi_webp":"vi",v=e.thumbnail||`https://i.ytimg.com/${g}/${d}/${u}.${b}`,h=e.noCookie?"https://www.youtube-nocookie.com":"https://www.youtube.com",y=`${h}/embed/${d}?autoplay=${!!p||!!n&&!a||a}&state=1${c}${m}&controls=${r?1:0}`;return{videoId:d,posterImp:u,paramsImp:m,mutedImp:c,format:b,vi:g,posterUrl:v,ytUrl:h,iframeSrc:y,adNetworkImp:l||!1}},exports.getYoutubeVideoId=e=>{let t=e.match(i);return t?.[1]??void 0},exports.isSettingLoop=e=>e.includes("loop=1"),exports.makeStyleResponsiveRatio=(e,t)=>({[`--${e}`]:t?.desktop,[`--${e}-tablet`]:t?.tablet,[`--${e}-mobile`]:t?.mobile}),exports.parseTimeVideo=e=>{let t=e.split(":",2);return t.length<=1?parseInt(t[0]||"0"):60*parseInt(t[0]||"0")+parseInt(t[1]||"0")},exports.vimeoVideoRegex=/^(?:http:\/\/|https:\/\/)vimeo\.com\/[\w/]+(?:\?.*)?$/im,exports.youtubeVideoRegex=i;

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

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../image/components/NextImage.liquid.js"),a=require("../../helpers.js"),s=require("@gem-sdk/system"),l=require("../common/classes.js"),r=require("../common/styles.js"),i=require("../common/helpers.js");exports.default=o=>{let{style:u,iframeClass:c,wrapperClass:d,title:p,poster:m,translatedVideoUrl:g}=o,n=`gp-video-${o.uid}`,{posterUrl:y,iframeSrc:b}=i.getYoutubeParams(o),f=!!o.thumbnail,$=m?.preload,C=s.createStateOrContext({lazy:o.lazy,hasThumbnail:f,style:u,title:p,iframeSrc:b,translatedVideoUrl:g}),S=!o.lazy&&(!f||!!o.autoplay),v=s.createClass({...l.getButtonYoutubeClasses(S)}),h=s.createClass({...l.getImageYoutubeClasses()}),j=s.createClass({...l.getArticleYoutubeClasses($||!1,d)}),q=s.createClass({...l.getIframeYoutubeClasses(c)}),I=s.createStyle({...r.getIframeYoutubeStyle(u)}),Y=s.createStyle({...r.getArticleYoutubeStyle(u,y)}),x=s.createClass({...l.getYoutubeContentClasses()});return e.template`
-    <gp-lite-youtube-embed gp-data='${JSON.stringify(C)}'>
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../image/components/NextImage.liquid.js"),a=require("../../helpers.js"),s=require("@gem-sdk/system"),l=require("../common/classes.js"),r=require("../common/styles.js"),i=require("../common/helpers.js");exports.default=o=>{let{style:u,iframeClass:c,wrapperClass:d,title:p,poster:m,translatedVideoUrl:g,autoplay:n}=o,y=`gp-video-${o.uid}`,{posterUrl:b,iframeSrc:f}=i.getYoutubeParams(o),$=!!o.thumbnail,C=m?.preload,S=s.createStateOrContext({lazy:o.lazy,hasThumbnail:$,style:u,title:p,iframeSrc:f,translatedVideoUrl:g,autoplay:n}),v=!o.lazy&&(!$||!!o.autoplay),h=s.createClass({...l.getButtonYoutubeClasses(v)}),j=s.createClass({...l.getImageYoutubeClasses()}),q=s.createClass({...l.getArticleYoutubeClasses(C||!1,d)}),I=s.createClass({...l.getIframeYoutubeClasses(c)}),Y=s.createStyle({...r.getIframeYoutubeStyle(u)}),x=s.createStyle({...r.getArticleYoutubeStyle(u,b)}),z=s.createClass({...l.getYoutubeContentClasses()});return e.template`
+    <gp-lite-youtube-embed gp-data='${JSON.stringify(S)}'>
       <article
         aria-hidden
-        class="${j}"
+        class="${q}"
         data-title="${p}"
-        style="${Y}"
+        style="${x}"
       >
-        ${t.default({id:n,src:y,alt:m?.altText,title:m?.imageTitle,priority:m?.preload,enableLazyLoadImage:!0,className:h,isDisableAspectStyle:!0,isNotLazyload:m?.preload})}
-        <button type="button" aria-label="Play" class="${v}">
+        ${t.default({id:y,src:b,alt:m?.altText,title:m?.imageTitle,priority:m?.preload,enableLazyLoadImage:!0,className:j,isDisableAspectStyle:!0,isNotLazyload:m?.preload})}
+        <button type="button" aria-label="Play" class="${h}">
           <svg height="100%" version="1.1" viewBox="0 0 68 48" width="100%">
             <path
               d="M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z"
@@ -16,19 +16,19 @@
             <path d="M 45,24 27,14 27,34" fill="#fff"></path>
           </svg>
         </button>
-        ${s.If(S,(()=>{let t=e.template`
+        ${s.If(v,(()=>{let t=e.template`
     <iframe
       id="player-wrapper-${o.uid}"
-      class="${q}"
-      style="${I}"
+      class="${I}"
+      style="${Y}"
       title="${p}"
       frameborder="0"
       allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
       allowfullscreen
-      src="${b}"
+      src="${f}"
     ></iframe>
   `;return o.isHeroBanner?e.template`
-        <div class="${x}">${t}</div>
+        <div class="${z}">${t}</div>
       `:t})())}
       </article>
     </gp-lite-youtube-embed>

package/dist/esm/product/components/product-badge/ProductBadge.js

@@ -1,2 +1,2 @@
 'use client';
-import{jsxs as e,jsx as s}from"react/jsx-runtime";import{useI18nStore as m,useProduct as o,useCurrentVariant as t,useMoneyFormat as r,useCurrentDevice as l,useProductBundleDiscount as i,useEditorMode as a,useRenderMode as c,usePageType as n,filterToolbarPreview as d}from"@gem-sdk/core";import{getBadgeContent as p,getIsNoDiscountState as y}from"./utils/common.js";import"./constants.js";import f from"../../../common/components/NoDataState.js";import h from"../../../common/components/TooltipHover.js";import{createClass as N,createStyle as j,createAttr as u,If as v}from"@gem-sdk/system";import{getEditTooltipAttrs as g,getSubWrapperAttrs as T,getContainerAttrs as k,getTextContentAttrs as x,getImageAttr as C}from"./common/attrs.js";import{getContainerClasses as S,getWrapperClasses as b,getSubWrapperClass as w,getTextContainerClasses as A,getTextWrapperClasses as B,getTextContentClasses as D,getImageContainerClasses as H,getImageClasses as I}from"./common/classes.js";import{getContainerStyle as M,getSubWrapperStyle as P,getContentStyleInternal as q,getTextBadgeWrapperStyles as z,getTextContentStyle as E,getImageContainerStyles as F}from"./common/styles.js";let G=G=>{let{t:J}=m(),{setting:K,styles:L,children:O,builderAttrs:Q,...R}=G,U=o(),V=t(),{moneyFormat:W}=r(),X=l(),{useProductCompareAtPrice:Y}=i(),Z=R?.["bundle-item"],$=a(),{isEditMode:_}=c(),ee="STATIC"===n(),es=p({detail:U,currentVariant:V,bundleItem:Z,useProductCompareAtPrice:Y},K?.displayContent,W),em=y({props:G,product:U,currentVariant:V,moneyFormat:W,useProductCompareAtPrice:Y}),eo=N({...S({mode:$,isInstant:ee,product:U,currentVariant:V,props:G})}),et=j({...M(G)}),er=u({...g(G)}),el=N({...b(G)}),ei=N({...w(G,X)}),ea=j({...P({props:G,product:U,currentVariant:V,isEditMode:_})}),ec=u({...T(G,U)}),en=q(G),ed=N({...A()}),ep=u({...k(G)}),ey=N({...B()}),ef=j({...z({setting:K,styles:L})}),eh=N({...D(L)}),eN=j({...E({setting:K,styles:L})}),ej=u({...x()}),eu=N({...H()}),ev=j({...F({setting:K,styles:L})}),eg=N({...I()}),eT=u({...C({setting:K})});return U?e("div",{...ep,style:et,className:eo,children:[v(_&&em,s(h,{...er,children:s(f,{...Q,elementType:"secondary",description:J("No discount"),rawMode:!0})}),s("div",{className:el,children:e("div",{...ec,className:ei,style:ea,children:[s("style",{children:en}),v(K?.shape!=="image",s("div",{className:ed,children:s("div",{className:ey,style:ef,children:s("pre",{...ej,className:eh,style:eN,children:es})})}),s("div",{className:eu,style:ev,children:s("img",{...eT,className:eg,alt:""})}))]})})),d(O,!0)]}):null};export{G as default};
+import{jsxs as e,jsx as s}from"react/jsx-runtime";import{useI18nStore as m,useProduct as o,useCurrentVariant as t,useMoneyFormat as r,useCurrentDevice as l,useProductBundleDiscount as i,useEditorMode as a,useRenderMode as c,usePageType as n,filterToolbarPreview as d}from"@gem-sdk/core";import{getBadgeContent as p,getIsNoDiscountState as y}from"./utils/common.js";import"./constants.js";import f from"../../../common/components/NoDataState.js";import h from"../../../common/components/TooltipHover.js";import{createClass as N,createStyle as j,createAttr as u,If as v}from"@gem-sdk/system";import{getEditTooltipAttrs as g,getSubWrapperAttrs as T,getContainerAttrs as k,getTextContentAttrs as x,getImageAttr as C}from"./common/attrs.js";import{getContainerClasses as S,getWrapperClasses as b,getSubWrapperClass as w,getTextContainerClasses as A,getTextWrapperClasses as B,getTextContentClasses as D,getImageContainerClasses as H,getImageClasses as I}from"./common/classes.js";import{getContainerStyle as M,getSubWrapperStyle as P,getContentStyleInternal as q,getTextBadgeWrapperStyles as z,getTextContentStyle as E,getImageContainerStyles as F}from"./common/styles.js";let G=G=>{let{t:J}=m(),{setting:K,styles:L,children:O,builderAttrs:Q,...R}=G,U=o(),V=t(),{moneyFormat:W}=r(),X=l(),{useProductCompareAtPrice:Y}=i(),Z=R?.["bundle-item"],$=a(),{isEditMode:_}=c(),ee="STATIC"===n(),es=p({detail:U,currentVariant:V,bundleItem:Z,useProductCompareAtPrice:Y},K?.displayContent,W),em=y({props:G,product:U,currentVariant:V,moneyFormat:W,useProductCompareAtPrice:Y}),eo=N({...S({mode:$,isInstant:ee,product:U,currentVariant:V,props:G})}),et=j({...M(G)}),er=u({...g(G,_)}),el=N({...b(G)}),ei=N({...w(G,X)}),ea=j({...P({props:G,product:U,currentVariant:V,isEditMode:_})}),ec=u({...T(G,U)}),en=q(G),ed=N({...A()}),ep=u({...k(G)}),ey=N({...B()}),ef=j({...z({setting:K,styles:L})}),eh=N({...D(L)}),eN=j({...E({setting:K,styles:L})}),ej=u({...x()}),eu=N({...H()}),ev=j({...F({setting:K,styles:L})}),eg=N({...I()}),eT=u({...C({setting:K})});return U?e("div",{...ep,style:et,className:eo,children:[v(_&&em,s(h,{...er,children:s(f,{...Q,elementType:"secondary",description:J("No discount"),rawMode:!0})}),s("div",{className:el,children:e("div",{...ec,className:ei,style:ea,children:[s("style",{children:en}),v(K?.shape!=="image",s("div",{className:ed,children:s("div",{className:ey,style:ef,children:s("pre",{...ej,className:eh,style:eN,children:es})})}),s("div",{className:eu,style:ev,children:s("img",{...eT,className:eg,alt:""})}))]})})),d(O,!0)]}):null};export{G as default};

package/dist/esm/product/components/product-badge/common/attrs.js

@@ -1 +1 @@
-import{t}from"@gem-sdk/core";let e=({setting:t})=>({src:t?.image?.src,alt:t?.image?.alt,loading:"lazy"}),d=t=>{let{builderAttrs:e,builderProps:d}=t;return{...e,"data-id":d?.uid||"",id:`g-product-badge-${d?.uid}`,"gp-data-hidden":"false"}},i=e=>{let{setting:d}=e,i=d?.positionWithImage==="outside";return{enable:!0,text:t("Not be displayed when published"),position:i?"bottom":"right",width:"205px"}},r=(t,e)=>{let{builderProps:d}=t,i=e?e?.baseID?.replace("gid://shopify/Product/",""):"";return{"data-product-id":i||"",id:d?.uid||""}},a=()=>({id:"product-badge-content"});export{d as getContainerAttrs,i as getEditTooltipAttrs,e as getImageAttr,r as getSubWrapperAttrs,a as getTextContentAttrs};
+import{t}from"@gem-sdk/core";let e=({setting:t})=>({src:t?.image?.src,alt:t?.image?.alt,loading:"lazy"}),d=t=>{let{builderAttrs:e,builderProps:d}=t;return{...e,"data-id":d?.uid||"",id:`g-product-badge-${d?.uid}`,"gp-data-hidden":"false"}},i=(e,d)=>{let{setting:i}=e,r=i?.positionWithImage==="outside";return{enable:!0,text:d&&t("Not be displayed when published"),position:r?"bottom":"right",width:"205px"}},r=(t,e)=>{let{builderProps:d}=t,i=e?e?.baseID?.replace("gid://shopify/Product/",""):"";return{"data-product-id":i||"",id:d?.uid||""}},a=()=>({id:"product-badge-content"});export{d as getContainerAttrs,i as getEditTooltipAttrs,e as getImageAttr,r as getSubWrapperAttrs,a as getTextContentAttrs};

package/dist/esm/product/components/product-description/hooks/useGpDescription.js

@@ -1 +1 @@
-import{useRef as e,useState as t,useCallback as r,useEffect as l}from"react";import{useProduct as i,useCurrentDevice as o,getResponsiveValueByScreen as n,useProductShopifyEditLink as m,useEditorMode as c,isSafari as p}from"@gem-sdk/core";let s=s=>{let u=e(null),[a,h]=t(!1),[g,d]=t(!1),H=i(),y=o(),x=n(s?.hasLineClamp,y),f=n(s?.lineClamp,y),{redirectProductShopifyLink:C}=m(),w=c(),k=r(()=>`calc(${f} * 1lh)`,[f]),v=r(e=>x&&f&&e||"auto",[x,f]),D=r(()=>{u.current&&(u.current.style.maxHeight=a?k():"none",h(e=>!e))},[a,k]);return l(()=>{v(k())},[s?.typo?.custom,v,k]),l(()=>{let e=u.current;if(h(!1),!e)return;let t=x&&H?.descriptionHtml;t?setTimeout(()=>{let t=e?.scrollHeight??0,r=e?.clientHeight??0,l=window.getComputedStyle(e).getPropertyValue("line-height"),i=parseInt(l,10)||1,o=void 0!==f&&f<Math.round((t??0)/i),n=p()?o:r<t;e.style.maxHeight=k(),f&&n?d(()=>!0):d(()=>!1)},100):e.style.maxHeight="none"},[x,f,H?.descriptionHtml,k]),{ref:u,open:a,isShowViewMore:g,handleToggleShowMore:D,mode:w,redirectProductShopifyLink:C}};export{s as useGpDescription};
+import{useRef as e,useState as t,useCallback as r,useEffect as l}from"react";import{useProduct as i,useCurrentDevice as n,getResponsiveValueByScreen as o,useProductShopifyEditLink as m,useEditorMode as c,isSafari as p}from"@gem-sdk/core";let s=s=>{let u=e(null),[a,g]=t(!1),[h,H]=t(!1),y=i(),d=n(),x=o(s?.hasLineClamp,d),f=o(s?.lineClamp,d),{redirectProductShopifyLink:C}=m(),w=c(),k=r(()=>`calc(${f} * 1lh)`,[f]),D=r(e=>x&&f&&e||"auto",[x,f]),G=r(()=>{u.current&&(u.current.style.maxHeight=a?k():"none",g(e=>!e))},[a,k]);return l(()=>{D(k())},[s?.typo?.custom,D,k]),l(()=>{let e=u.current;if(g(!1),!e)return;let t=x&&y?.descriptionHtml;t?setTimeout(()=>{let t=e?.scrollHeight??0,r=e?.clientHeight??0,l=window.getComputedStyle(e).getPropertyValue("line-height"),i=parseInt(l,10)||1,n=f&&t>f*i,o=p()?n:r<t;e.style.maxHeight=k(),f&&o?H(()=>!0):H(()=>!1)},100):e.style.maxHeight="none"},[x,f,y?.descriptionHtml,k]),{ref:u,open:a,isShowViewMore:h,handleToggleShowMore:G,mode:w,redirectProductShopifyLink:C}};export{s as useGpDescription};

package/dist/esm/video/common/helpers.js

@@ -1 +1 @@
-import{getResponsiveValueByScreen as e,cloneDeep as t}from"@gem-sdk/core";import{getDynamicSourceLocales as o,createSettingId as i}from"../../helpers.js";import{Video as l}from"../settings/configs/translate.js";let s=(t,o)=>{let i={desktop:t?.desktop?.width,tablet:t?.tablet?.width,mobile:t?.mobile?.width},l={desktop:t?.desktop?.height,tablet:t?.tablet?.height,mobile:t?.mobile?.height},s={desktop:o?.desktop==="custom"?`${e(i,"desktop")}/${e(l,"desktop")}`:o?.desktop==="cover"?"unset":o?.desktop,tablet:o?.tablet==="custom"?`${e(i,"tablet")}/${e(l,"tablet")}`:o?.tablet==="cover"?"unset":o?.tablet,mobile:o?.mobile==="custom"?`${e(i,"mobile")}/${e(l,"mobile")}`:o?.mobile==="cover"?"unset":o?.mobile};return s},r=({setting:e,uid:s,pageContext:r})=>{if(!e||!s)return{};if(r?.isPreviewing)return e;let m=t(e);if(m.youtubeUrl&&"youtube"===m.type){let e=o({val:m.youtubeUrl,uid:s,settingId:i({id:l?.youtubeUrl?.id}),pageContext:r});m.youtubeUrlTranslated=String(e)}if(m.vimeoUrl&&"vimeo"===m.type){let e=o({val:m.vimeoUrl,uid:s,settingId:i({id:l?.vimeoUrl?.id}),pageContext:r});m.vimeoUrlTranslated=String(e)}if(m.html5Url&&"html5"===m.type){let e=o({val:m.html5Url,uid:s,settingId:i({id:l?.html5Url?.id}),pageContext:r});m.html5Url=String(e)}if(m.poster){let e=o({val:m.poster?.src,uid:s,settingId:l?.poster?.id?`${l.poster.id}_src`:"",pageContext:r});m.poster.src=String(e)}return m},m=e=>{let{id:t,params:o,muted:i,webp:l,controls:s,adNetwork:r,autoplay:m,lazy:a,thumbnail:d}=e,p=encodeURIComponent(t),n="hqdefault",u=`${o}`||"",b=i?"&mute=1":"",g=l?"webp":"jpg",h=l?"vi_webp":"vi",c=e.thumbnail||`https://i.ytimg.com/${h}/${p}/${n}.${g}`,$=e.noCookie?"https://www.youtube-nocookie.com":"https://www.youtube.com",v=`${$}/embed/${p}?autoplay=${!!a||!!d||m}&state=1${b}${u}&controls=${s?1:0}`;return{videoId:p,posterImp:n,paramsImp:u,mutedImp:b,format:g,vi:h,posterUrl:c,ytUrl:$,iframeSrc:v,adNetworkImp:r||!1}},a=e=>{let{id:t,autoplay:o,muted:i,controls:l,loop:s,lazy:r}=e,m=encodeURIComponent(t),a=`?&autoplay=${r?1:o?1:0}&muted=${i?1:0}&loop=${s?1:0}&controls=${l}&autopause=false`,d=`https://player.vimeo.com/video/${m}${a}`;return{videoId:m,params:a,iframeSrc:d}},d=(e,t)=>({[`--${e}`]:t?.desktop,[`--${e}-tablet`]:t?.tablet,[`--${e}-mobile`]:t?.mobile}),p="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",n=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=|shorts\/)|youtu\.be\/)([^"&?/\s]{11})/i,u=/^(?:http:\/\/|https:\/\/)vimeo\.com\/[\w/]+(?:\?.*)?$/im,b=e=>{let t=e.match(n);return t?.[1]??void 0},g=e=>e.match(/https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/|video\/)?(\d+)(?:$|\/|\?)/)?.[3],h=e=>{let t=e.split(":",2);return t.length<=1?parseInt(t[0]||"0"):60*parseInt(t[0]||"0")+parseInt(t[1]||"0")},c=e=>{let t=e.split("&");return t.shift(),t.reduce((e,t)=>{let[o,i]=t.split("=");return"loop"!==o&&(e[o]=i),e},{})},$=e=>e.includes("loop=1");export{c as covertStrParamsToObj,p as fallbackImageVideoUrl,s as getAspectRatioSettings,r as getSettingTranslatedVideoAndThumbnail,a as getVimeoParams,g as getVimeoVideoId,m as getYoutubeParams,b as getYoutubeVideoId,$ as isSettingLoop,d as makeStyleResponsiveRatio,h as parseTimeVideo,u as vimeoVideoRegex,n as youtubeVideoRegex};
+import{getResponsiveValueByScreen as e,cloneDeep as t}from"@gem-sdk/core";import{getDynamicSourceLocales as o,createSettingId as i}from"../../helpers.js";import{Video as l}from"../settings/configs/translate.js";let s=(t,o)=>{let i={desktop:t?.desktop?.width,tablet:t?.tablet?.width,mobile:t?.mobile?.width},l={desktop:t?.desktop?.height,tablet:t?.tablet?.height,mobile:t?.mobile?.height},s={desktop:o?.desktop==="custom"?`${e(i,"desktop")}/${e(l,"desktop")}`:o?.desktop==="cover"?"unset":o?.desktop,tablet:o?.tablet==="custom"?`${e(i,"tablet")}/${e(l,"tablet")}`:o?.tablet==="cover"?"unset":o?.tablet,mobile:o?.mobile==="custom"?`${e(i,"mobile")}/${e(l,"mobile")}`:o?.mobile==="cover"?"unset":o?.mobile};return s},r=({setting:e,uid:s,pageContext:r})=>{if(!e||!s)return{};if(r?.isPreviewing)return e;let m=t(e);if(m.youtubeUrl&&"youtube"===m.type){let e=o({val:m.youtubeUrl,uid:s,settingId:i({id:l?.youtubeUrl?.id}),pageContext:r});m.youtubeUrlTranslated=String(e)}if(m.vimeoUrl&&"vimeo"===m.type){let e=o({val:m.vimeoUrl,uid:s,settingId:i({id:l?.vimeoUrl?.id}),pageContext:r});m.vimeoUrlTranslated=String(e)}if(m.html5Url&&"html5"===m.type){let e=o({val:m.html5Url,uid:s,settingId:i({id:l?.html5Url?.id}),pageContext:r});m.html5Url=String(e)}if(m.poster){let e=o({val:m.poster?.src,uid:s,settingId:l?.poster?.id?`${l.poster.id}_src`:"",pageContext:r});m.poster.src=String(e)}return m},m=e=>{let{id:t,params:o,muted:i,webp:l,controls:s,adNetwork:r,autoplay:m,lazy:a,thumbnail:d}=e,p=encodeURIComponent(t),n="hqdefault",u=`${o}`||"",b=i?"&mute=1":"",g=l?"webp":"jpg",h=l?"vi_webp":"vi",c=e.thumbnail||`https://i.ytimg.com/${h}/${p}/${n}.${g}`,$=e.noCookie?"https://www.youtube-nocookie.com":"https://www.youtube.com",v=`${$}/embed/${p}?autoplay=${!!a||!!d&&!m||m}&state=1${b}${u}&controls=${s?1:0}`;return{videoId:p,posterImp:n,paramsImp:u,mutedImp:b,format:g,vi:h,posterUrl:c,ytUrl:$,iframeSrc:v,adNetworkImp:r||!1}},a=e=>{let{id:t,autoplay:o,muted:i,controls:l,loop:s,lazy:r}=e,m=encodeURIComponent(t),a=`?&autoplay=${r?1:o?1:0}&muted=${i?1:0}&loop=${s?1:0}&controls=${l}&autopause=false`,d=`https://player.vimeo.com/video/${m}${a}`;return{videoId:m,params:a,iframeSrc:d}},d=(e,t)=>({[`--${e}`]:t?.desktop,[`--${e}-tablet`]:t?.tablet,[`--${e}-mobile`]:t?.mobile}),p="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",n=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=|shorts\/)|youtu\.be\/)([^"&?/\s]{11})/i,u=/^(?:http:\/\/|https:\/\/)vimeo\.com\/[\w/]+(?:\?.*)?$/im,b=e=>{let t=e.match(n);return t?.[1]??void 0},g=e=>e.match(/https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/|video\/)?(\d+)(?:$|\/|\?)/)?.[3],h=e=>{let t=e.split(":",2);return t.length<=1?parseInt(t[0]||"0"):60*parseInt(t[0]||"0")+parseInt(t[1]||"0")},c=e=>{let t=e.split("&");return t.shift(),t.reduce((e,t)=>{let[o,i]=t.split("=");return"loop"!==o&&(e[o]=i),e},{})},$=e=>e.includes("loop=1");export{c as covertStrParamsToObj,p as fallbackImageVideoUrl,s as getAspectRatioSettings,r as getSettingTranslatedVideoAndThumbnail,a as getVimeoParams,g as getVimeoVideoId,m as getYoutubeParams,b as getYoutubeVideoId,$ as isSettingLoop,d as makeStyleResponsiveRatio,h as parseTimeVideo,u as vimeoVideoRegex,n as youtubeVideoRegex};

package/dist/esm/video/components/LiteYouTubeEmbed.liquid.js

@@ -1,13 +1,13 @@
-import{RenderIf as e,isLocalEnv as t,baseAssetURL as s,template as a}from"@gem-sdk/core";import l from"../../image/components/NextImage.liquid.js";import{getSettingPreloadData as r}from"../../helpers.js";import{createStateOrContext as i,createClass as o,createStyle as p,If as m}from"@gem-sdk/system";import{getButtonYoutubeClasses as d,getImageYoutubeClasses as c,getArticleYoutubeClasses as u,getIframeYoutubeClasses as y,getYoutubeContentClasses as f}from"../common/classes.js";import{getIframeYoutubeStyle as n,getArticleYoutubeStyle as g}from"../common/styles.js";import{getYoutubeParams as $}from"../common/helpers.js";let b=b=>{let{style:h,iframeClass:v,wrapperClass:S,title:j,poster:z,translatedVideoUrl:w}=b,C=`gp-video-${b.uid}`,{posterUrl:E,iframeSrc:N}=$(b),k=!!b.thumbnail,x=z?.preload,L=i({lazy:b.lazy,hasThumbnail:k,style:h,title:j,iframeSrc:N,translatedVideoUrl:w}),T=!b.lazy&&(!k||!!b.autoplay),A=o({...d(T)}),I=o({...c()}),M=o({...u(x||!1,S)}),B=o({...y(v)}),G=p({...n(h)}),O=p({...g(h,E)}),P=o({...f()});return a`
-    <gp-lite-youtube-embed gp-data='${JSON.stringify(L)}'>
+import{RenderIf as e,isLocalEnv as t,baseAssetURL as s,template as a}from"@gem-sdk/core";import l from"../../image/components/NextImage.liquid.js";import{getSettingPreloadData as r}from"../../helpers.js";import{createStateOrContext as i,createClass as o,createStyle as p,If as m}from"@gem-sdk/system";import{getButtonYoutubeClasses as d,getImageYoutubeClasses as c,getArticleYoutubeClasses as u,getIframeYoutubeClasses as y,getYoutubeContentClasses as f}from"../common/classes.js";import{getIframeYoutubeStyle as n,getArticleYoutubeStyle as g}from"../common/styles.js";import{getYoutubeParams as $}from"../common/helpers.js";let b=b=>{let{style:h,iframeClass:v,wrapperClass:S,title:j,poster:z,translatedVideoUrl:w,autoplay:C}=b,E=`gp-video-${b.uid}`,{posterUrl:N,iframeSrc:k}=$(b),x=!!b.thumbnail,L=z?.preload,T=i({lazy:b.lazy,hasThumbnail:x,style:h,title:j,iframeSrc:k,translatedVideoUrl:w,autoplay:C}),A=!b.lazy&&(!x||!!b.autoplay),I=o({...d(A)}),M=o({...c()}),B=o({...u(L||!1,S)}),G=o({...y(v)}),O=p({...n(h)}),P=p({...g(h,N)}),_=o({...f()});return a`
+    <gp-lite-youtube-embed gp-data='${JSON.stringify(T)}'>
       <article
         aria-hidden
-        class="${M}"
+        class="${B}"
         data-title="${j}"
-        style="${O}"
+        style="${P}"
       >
-        ${l({id:C,src:E,alt:z?.altText,title:z?.imageTitle,priority:z?.preload,enableLazyLoadImage:!0,className:I,isDisableAspectStyle:!0,isNotLazyload:z?.preload})}
-        <button type="button" aria-label="Play" class="${A}">
+        ${l({id:E,src:N,alt:z?.altText,title:z?.imageTitle,priority:z?.preload,enableLazyLoadImage:!0,className:M,isDisableAspectStyle:!0,isNotLazyload:z?.preload})}
+        <button type="button" aria-label="Play" class="${I}">
           <svg height="100%" version="1.1" viewBox="0 0 68 48" width="100%">
             <path
               d="M66.52,7.74c-0.78-2.93-2.49-5.41-5.42-6.19C55.79,.13,34,0,34,0S12.21,.13,6.9,1.55 C3.97,2.33,2.27,4.81,1.48,7.74C0.06,13.05,0,24,0,24s0.06,10.95,1.48,16.26c0.78,2.93,2.49,5.41,5.42,6.19 C12.21,47.87,34,48,34,48s21.79-0.13,27.1-1.55c2.93-0.78,4.64-3.26,5.42-6.19C67.94,34.95,68,24,68,24S67.94,13.05,66.52,7.74z"
@@ -16,19 +16,19 @@ import{RenderIf as e,isLocalEnv as t,baseAssetURL as s,template as a}from"@gem-s
             <path d="M 45,24 27,14 27,34" fill="#fff"></path>
           </svg>
         </button>
-        ${m(T,(()=>{let e=a`
+        ${m(A,(()=>{let e=a`
     <iframe
       id="player-wrapper-${b.uid}"
-      class="${B}"
-      style="${G}"
+      class="${G}"
+      style="${O}"
       title="${j}"
       frameborder="0"
       allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
       allowfullscreen
-      src="${N}"
+      src="${k}"
     ></iframe>
   `;return b.isHeroBanner?a`
-        <div class="${P}">${e}</div>
+        <div class="${_}">${e}</div>
       `:e})())}
       </article>
     </gp-lite-youtube-embed>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/components",
-  "version": "17.0.0-dev.26",
+  "version": "17.0.0-dev.28",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",