@gem-sdk/components 8.0.0-dev.120 → 8.0.0-dev.122

package/dist/esm/tab/components/Tabs.liquid.js

@@ -1,36 +1,37 @@
-import{template as e,WrapRenderChildren as t,RenderChildren as s,RenderIf as i,isLocalEnv as l,baseAssetURL as a}from"@gem-sdk/core";import{getDynamicSourceLocales as d,createSettingId as r,getSettingPreloadData as o}from"../../helpers.js";import{createStateOrContext as p,createAttr as c,createStyle as m,createClass as n}from"@gem-sdk/system";import{getAttr as u,getAttrContent as y}from"../common/attrs.js";import $ from"../../text/components/Text.liquid.js";import{Tabs as g}from"../settings/configs/translate.js";import{getStyleWrapper as v,getTabParentListStyle as f,getTabListStyle as h,getContainContentStyle as x,getItemStyle as b}from"../common/styles.js";import{getClassesWrapper as j,getContainClasses as T,getStyleTagClasses as C,getTabParentListClasses as k,getTabListClasses as A,getWrapperContentClasses as K,getContainContentClasses as S,getTextClasses as I,getItemClasses as E}from"../common/classes.js";let Tabs=N=>{let{builderProps:V,style:q,setting:P,advanced:z,rawChildren:F}=N;delete P?.labelTypoV2?.attrs?.color;let{cssClass:G}=z??{},{panelWidth:L,childItem:O,labelAlign:W,labelTypo:_,labelTypoV2:J}=P??{},M=p({setting:P,builderProps:V}),R=void 0;P&&!P?.labelWidth&&(P.labelWidth={desktop:"200px"});let U=c({...u({uid:V?.uid||""})}),w=m({...v({setting:P,style:q,uid:V?.uid,pageContext:N.pageContext,type:"Liquid"})}),B=n({...j({builderProps:V,advancedCssClass:G})}),D=n({...T({setting:P})}),H=C({panelWidth:L,builderProps:V}),Q=n({...k()}),X=m({...f(P)}),Y=n({...A({setting:P})}),Z=m({...h(P)}),ee=e=>n({...E({setting:P,isNotLiquid:!1,isActive:e,currentDevice:R})}),et=e=>m({...b(P,e)}),es=n({...K()}),ei=n({...S()}),el=m({...x()}),ea=c({...y({uid:V?.uid||""})}),ed=n({...I()}),er=()=>O?.map(e=>e?.replaceAll("'","&#039;"))?.map((t,s)=>{let i=(P?.activeKey??0)<0||(P?.activeKey??0)>=(P?.childItem??[]).length?0===s:s===P?.activeKey,l=d({val:t,uid:V?.uid,settingId:r({id:g?.childItem?.id,index:s}),pageContext:N.pageContext,isCapitalize:P?.labelTypoV2?.attrs?.transform==="capitalize"});return e`
+import{template as t,WrapRenderChildren as e,RenderChildren as s,RenderIf as i,isLocalEnv as l,baseAssetURL as a}from"@gem-sdk/core";import{getDynamicSourceLocales as r,createSettingId as d,getSettingPreloadData as o}from"../../helpers.js";import{createStateOrContext as p,createAttr as c,createStyle as m,createClass as n}from"@gem-sdk/system";import{getAttr as y,getAttrContent as u}from"../common/attrs.js";import $ from"../../text/components/Text.liquid.js";import{Tabs as g}from"../settings/configs/translate.js";import{getStyleWrapper as v,getTabParentListStyle as f,getTabListStyle as h,getContainContentStyle as x,getItemStyle as b}from"../common/styles.js";import{getClassesWrapper as j,getContainClasses as T,getStyleTagClasses as C,getTabParentListClasses as k,getTabListClasses as A,getWrapperContentClasses as K,getContainContentClasses as S,getTextClasses as I,getItemClasses as E}from"../common/classes.js";let Tabs=N=>{let{builderProps:V,style:q,setting:P,advanced:z,rawChildren:F}=N;delete P?.labelTypoV2?.attrs?.color;let{cssClass:G}=z??{},{panelWidth:L,childItem:O,labelAlign:W,labelTypo:_,labelTypoV2:J}=P??{},M=p({setting:P,builderProps:V}),R=void 0;P&&!P?.labelWidth&&(P.labelWidth={desktop:"200px"});let U=c({...y({uid:V?.uid||""})}),w=m({...v({setting:P,style:q,uid:V?.uid,pageContext:N.pageContext,type:"Liquid"})}),B=n({...j({builderProps:V,advancedCssClass:G})}),D=n({...T({setting:P})}),H=C({panelWidth:L,builderProps:V}),Q=n({...k()}),X=m({...f(P)}),Y=n({...A({setting:P})}),Z=m({...h(P)}),tt=t=>n({...E({setting:P,isNotLiquid:!1,isActive:t,currentDevice:R})}),te=t=>m({...b(P,t)}),ts=n({...K()}),ti=n({...S()}),tl=m({...x()}),ta=c({...u({uid:V?.uid||""})}),tr=n({...I()}),td=()=>O?.map(t=>t?.replaceAll("'","&#039;"))?.map((e,s)=>{let i=(P?.activeKey??0)<0||(P?.activeKey??0)>=(P?.childItem??[]).length?0===s:s===P?.activeKey,l=r({val:e,uid:V?.uid,settingId:d({id:g?.childItem?.id,index:s}),pageContext:N.pageContext,isCapitalize:P?.labelTypoV2?.attrs?.transform==="capitalize"});return t`
       <li
         aria-hidden
-        class="${ee(i)}"
-        style="${et(i)}"
+        class="${tt(i)}"
+        style="${te(i)}"
         key="${V?.uid}"
 
       >
-        ${$({className:ed,styles:{typo:J,typography:_,textAlign:W},setting:{text:l,htmlTag:"div",excludeFlex:!0,isForceValue:!0}})}
+        ${$({className:tr,styles:{typo:J,typography:_,textAlign:W},setting:{text:l,htmlTag:"div",excludeFlex:!0,isForceValue:!0}})}
       </li>
-    `}).join(""),eo=()=>t({uid:V?.uid||"",customProps:F?.[0].customProps},F?.map((t,i)=>{let l=(P?.activeKey??0)<0||(P?.activeKey??0)>=(P?.childItem??[]).length?0===i:i===P?.activeKey;return t?e`${s({...t,parentUid:V?.uid,isActive:l})}`:""})),ep=()=>i(l,`<script ${o('class="gps-link" delay',"src")}="{{ 'gp-tab-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${o('class="gps-link" delay',"src")}="${a}/assets-v2/gp-tab-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return e`
+    `}).join(""),to=()=>e({uid:V?.uid||"",customProps:F?.[0].customProps},F?.map((e,i)=>{let l=(P?.activeKey??0)<0||(P?.activeKey??0)>=(P?.childItem??[]).length?0===i:i===P?.activeKey;return e?t`${s({...e,parentUid:V?.uid,isActive:l})}`:""})),tp=()=>i(l,`<script ${o('class="gps-link" delay',"src")}="{{ 'gp-tab-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${o('class="gps-link" delay',"src")}="${a}/assets-v2/gp-tab-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return t`
     <gp-tab
       ${{...U}}
       style="${w}"
       class="${B}"
-      gp-data='${JSON.stringify(M)?.replaceAll("'","&#039;")}'>
+    >
+      <script gp-data type="application/json">${JSON.stringify(M)?.replaceAll("'","&#039;")}</script>
         <style>${H}</style>
         <div class="${D}">
           <div class="${Q}" style="${X}">
             <ul class="${Y}" style="${Z}">
-              ${er()}
+              ${td()}
             </ul>
           </div>
-          <div class="${es}">
+          <div class="${ts}">
             <div
-              ${{...ea}}
-              class="${ei}"
-              style="${el}"
+              ${{...ta}}
+              class="${ti}"
+              style="${tl}"
             >
-              ${eo()}
+              ${to()}
             </div>
           </div>
         </div>
     </gp-tab>
-    ${ep()}
+    ${tp()}
   `};export{Tabs as default};

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

@@ -1,5 +1,6 @@
-import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as i}from"@gem-sdk/core";import{getSettingPreloadData as l}from"../../helpers.js";import{createStateOrContext as r,createStyle as a,createClass as m,If as o}from"@gem-sdk/system";import{getArticleVimeoClasses as p,getImageVimeoClasses as c,getButtonVimeoClasses as d,getIframeVimeoClasses as g}from"../common/classes.js";import{getIframeVimeoStyle as f,getArticleVimeoStyle as n}from"../common/styles.js";import{getVimeoParams as y}from"../common/helpers.js";import $ from"../../image/components/NextImage.liquid.js";let LiteVimeoEmbed=b=>{let{title:h,id:u,lazy:v,aspectRatio:S,autoplay:j,muted:w,thumbnailLink:E,poster:x,translatedVideoUrl:L}=b,{iframeSrc:k}=y(b),I=!v,N=b.thumbnail,V=r({id:u,thumbnail:E,lazy:v,iframeSrc:k,title:h,autoplay:j,muted:w,style:b?.vimeoStyleIframe||"",translatedVideoUrl:L}),A=a({...f(S)}),T=a({...n(S,"")}),C=m({...p(N,S)}),G=m({...c(I)}),M=m({...d(I)}),O=m({...g()});return e`
-    <gp-lite-vimeo-embed gp-data='${JSON.stringify(V)}'>
+import{template as e,RenderIf as t,isLocalEnv as i,baseAssetURL as s}from"@gem-sdk/core";import{getSettingPreloadData as l}from"../../helpers.js";import{createStateOrContext as r,createStyle as a,createClass as m,If as o}from"@gem-sdk/system";import{getArticleVimeoClasses as p,getImageVimeoClasses as c,getButtonVimeoClasses as d,getIframeVimeoClasses as n}from"../common/classes.js";import{getIframeVimeoStyle as g,getArticleVimeoStyle as f}from"../common/styles.js";import{getVimeoParams as y}from"../common/helpers.js";import $ from"../../image/components/NextImage.liquid.js";let LiteVimeoEmbed=b=>{let{title:h,id:u,lazy:v,aspectRatio:j,autoplay:S,muted:w,thumbnailLink:E,poster:x,translatedVideoUrl:L}=b,{iframeSrc:k}=y(b),I=!v,N=b.thumbnail,V=r({id:u,thumbnail:E,lazy:v,iframeSrc:k,title:h,autoplay:S,muted:w,style:b?.vimeoStyleIframe||"",translatedVideoUrl:L}),A=a({...g(j)}),T=a({...f(j,"")}),C=m({...p(N,j)}),G=m({...c(I)}),M=m({...d(I)}),O=m({...n()});return e`
+    <gp-lite-vimeo-embed>
+      <script gp-data type="application/json">${JSON.stringify(V)}</script>
       <article
         aria-hidden
         class="${C}"
@@ -28,5 +29,5 @@ import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as i}from"@gem-s
           ></iframe>`)}
       </article>
     </gp-lite-vimeo-embed>
-    ${t(s,`<script ${l('class="gps-link" delay',"src")}="{{ 'gp-lite-vimeo-embed-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l('class="gps-link" delay',"src")}="${i}/assets-v2/gp-lite-vimeo-embed-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+    ${t(i,`<script ${l('class="gps-link" delay',"src")}="{{ 'gp-lite-vimeo-embed-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l('class="gps-link" delay',"src")}="${s}/assets-v2/gp-lite-vimeo-embed-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};export{LiteVimeoEmbed as default};

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

@@ -1,4 +1,4 @@
-import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as r}from"@gem-sdk/core";import a from"../../image/components/NextImage.liquid.js";import{getSettingPreloadData as l}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 f,getYoutubeContentClasses as y}from"../common/classes.js";import{getIframeYoutubeStyle as n,getArticleYoutubeStyle as b}from"../common/styles.js";import{getYoutubeParams as g}from"../common/helpers.js";let LiteYouTubeEmbed=$=>{let{style:h,iframeClass:v,wrapperClass:S,title:j,poster:z,translatedVideoUrl:E}=$,w=`gp-video-${$.uid}`,{posterUrl:C,iframeSrc:L}=g($),N=z?.preload,T=i({lazy:$.lazy,style:h,title:j,iframeSrc:L,translatedVideoUrl:E}),k=!$.lazy,x=o({...d(k)}),A=o({...c()}),I=o({...u(N||!1,S)}),M=o({...f(v)}),B=p({...n(h)}),G=p({...b(h,C)}),O=o({...y()}),P=()=>{let t=e`
+import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as r}from"@gem-sdk/core";import a from"../../image/components/NextImage.liquid.js";import{getSettingPreloadData as i}from"../../helpers.js";import{createStateOrContext as l,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 b}from"../common/styles.js";import{getYoutubeParams as g}from"../common/helpers.js";let LiteYouTubeEmbed=$=>{let{style:h,iframeClass:v,wrapperClass:S,title:j,poster:z,translatedVideoUrl:E}=$,w=`gp-video-${$.uid}`,{posterUrl:C,iframeSrc:L}=g($),N=z?.preload,T=l({lazy:$.lazy,style:h,title:j,iframeSrc:L,translatedVideoUrl:E}),k=!$.lazy,x=o({...d(k)}),A=o({...c()}),I=o({...u(N||!1,S)}),M=o({...y(v)}),B=p({...n(h)}),G=p({...b(h,C)}),O=o({...f()}),P=()=>{let t=e`
     <iframe
       id="player-wrapper-${$.uid}"
       class="${M}"
@@ -12,7 +12,8 @@ import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as r}from"@gem-s
   `;return $.isHeroBanner?e`
         <div class="${O}">${t}</div>
       `:t};return e`
-    <gp-lite-youtube-embed gp-data='${JSON.stringify(T)}'>
+    <gp-lite-youtube-embed>
+      <script gp-data type="application/json">${JSON.stringify(T)}</script>
       <article
         aria-hidden
         class="${I}"
@@ -32,5 +33,5 @@ import{template as e,RenderIf as t,isLocalEnv as s,baseAssetURL as r}from"@gem-s
         ${m(k,P())}
       </article>
     </gp-lite-youtube-embed>
-    ${t(s,`<script ${l('class="gps-link" delay',"src")}="{{ 'gp-lite-youtube-embed-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${l('class="gps-link" delay',"src")}="${r}/assets-v2/gp-lite-youtube-embed-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+    ${t(s,`<script ${i('class="gps-link" delay',"src")}="{{ 'gp-lite-youtube-embed-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${i('class="gps-link" delay',"src")}="${r}/assets-v2/gp-lite-youtube-embed-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
   `};export{LiteYouTubeEmbed as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/components",
-  "version": "8.0.0-dev.120",
+  "version": "8.0.0-dev.122",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",
@@ -27,7 +27,7 @@
     "i18n:generate": "node ./scripts/update-locales-to-setting.js"
   },
   "devDependencies": {
-    "@gem-sdk/core": "8.0.0-dev.118",
+    "@gem-sdk/core": "8.0.0-dev.122",
     "@gem-sdk/styles": "8.0.0-dev.115",
     "@gem-sdk/system": "8.0.0-dev.115",
     "@types/react-transition-group": "4.4.12",