@gem-sdk/components 17.0.0-dev.113 → 17.0.0-dev.114

package/dist/esm/sticky/components/Sticky.liquid.js

@@ -1,20 +1,19 @@
-import{makeStyleResponsive as e,RenderIf as s,isLocalEnv as t,baseAssetURL as i,template as a}from"@gem-sdk/core";import{getSettingPreloadData as r}from"../../helpers.js";import{createStyle as d,createClass as l,createStateOrContext as o}from"@gem-sdk/system";import{getContainerStyles as m,getContentStyles as p}from"../common/styles.js";import{getContainerClasses as c}from"../common/classes.js";let g=({children:g,builderAttrs:n,setting:$,style:k,builderProps:f,advanced:y,pageContext:u})=>{let{width:b,position:v,display:S,preloadBgImage:h,background:j,isScrollToTop:E}=$??{},w=y?.d,C=d({...e("w",b),...m({position:v,display:S})}),q=d(p({setting:$,style:k,uid:f?.uid,pageContext:u??{},type:"Liquid"})),x=l(c({uid:f?.uid,isScrollToTop:E,cssClass:y?.cssClass,isLiquid:!0})),A=o({uid:f?.uid,setting:{display:{desktop:S?.desktop,tablet:S?.tablet??S?.desktop,mobile:S?.mobile??S?.tablet??S?.desktop}},advanced:{d:w}}),G=`.drawer-page-content {
+import{makeStyleResponsive as s,RenderIf as e,isLocalEnv as t,baseAssetURL as i,template as r}from"@gem-sdk/core";import{getSettingPreloadData as a}from"../../helpers.js";import{createStyle as l,createClass as d,createStateOrContext as o}from"@gem-sdk/system";import{getContainerStyles as p,getContentStyles as m}from"../common/styles.js";import{getContainerClasses as c}from"../common/classes.js";let n=({children:n,builderAttrs:g,setting:$,style:k,builderProps:y,advanced:f,pageContext:u})=>{let{width:b,position:v,display:S,preloadBgImage:j,background:h,isScrollToTop:E}=$??{},w=f?.d,C=l({...s("w",b),...p({position:v,display:S})}),q=l(m({setting:$,style:k,uid:y?.uid,pageContext:u??{},type:"Liquid"})),x=d(c({uid:y?.uid,isScrollToTop:E,cssClass:f?.cssClass,isLiquid:!0})),A=o({uid:y?.uid,setting:{display:{desktop:S?.desktop,tablet:S?.tablet??S?.desktop,mobile:S?.mobile??S?.tablet??S?.desktop}},advanced:{d:w}}),G=`.drawer-page-content {
        transform: none !important;
       -webkit-transform: none !important;
-  }`;return a`
-    ${s(!!h,`${s(!!j?.desktop?.image?.src,`<link rel="preload" href="${j?.desktop?.image?.src}" as="image" />`)}${s(!!j?.tablet?.image?.src,`<link rel="preload" href="${j?.tablet?.image?.src}" as="image" />`)}${s(!!j?.mobile?.image?.src,`<link rel="preload" href="${j?.mobile?.image?.src}" as="image" />`)}`)}
+  }`;return r`
+    ${e(!!j,`${e(!!h?.desktop?.image?.src,`<link rel="preload" href="${h?.desktop?.image?.src}" as="image" />`)}${e(!!h?.tablet?.image?.src,`<link rel="preload" href="${h?.tablet?.image?.src}" as="image" />`)}${e(!!h?.mobile?.image?.src,`<link rel="preload" href="${h?.mobile?.image?.src}" as="image" />`)}`)}
     <gp-sticky
-    data-id="${f?.uid}"
-      gp-data='${JSON.stringify(A)}'
-      id="${f?.uid}"
-      data-id="${f?.uid}"
-      class="${x} ${r("gps-lazy")}"
+      id="${y?.uid}"
+      data-id="${y?.uid}"
+      class="${x} ${a("gps-lazy")}"
       style="${C}"
     >
+      <script gp-data type="application/json">${JSON.stringify(A)}</script>
       <style>${G}</style>
-      <div ${{...n}} style="${{...q}}">
-        ${g}
+      <div ${{...g}} style="${{...q}}">
+        ${n}
       </div>
     </gp-sticky>
-    ${s(t,`<script ${r('class="gps-link" delay',"src")}="{{ 'gp-sticky-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${r('class="gps-link" delay',"src")}="${i}/assets-v2/gp-sticky-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
-  `};export{g as default};
+    ${e(t,`<script ${a('class="gps-link" delay',"src")}="{{ 'gp-sticky-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${a('class="gps-link" delay',"src")}="${i}/assets-v2/gp-sticky-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
+  `};export{n as default};

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

@@ -1,33 +1,34 @@
-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 C,getStyleTagClasses as S,getTabParentListClasses as T,getTabListClasses as k,getWrapperContentClasses as A,getContainContentClasses as I,getTextClasses as K,getItemClasses as E}from"../common/classes.js";let N=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({...C({setting:P})}),H=S({panelWidth:L,builderProps:V}),Q=n({...T()}),X=m({...f(P)}),Y=n({...k({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({...A()}),ei=n({...I()}),el=m({...x()}),ea=c({...y({uid:V?.uid||""})}),ed=n({...K()});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 C,getStyleTagClasses as S,getTabParentListClasses as T,getTabListClasses as k,getWrapperContentClasses as A,getContainContentClasses as I,getTextClasses as K,getItemClasses as E}from"../common/classes.js";let N=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({...C({setting:P})}),H=S({panelWidth:L,builderProps:V}),Q=n({...T()}),X=m({...f(P)}),Y=n({...k({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({...A()}),ti=n({...I()}),tl=m({...x()}),ta=c({...u({uid:V?.uid||""})}),tr=n({...K()});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}">
-              ${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`
+              ${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},translateSetting:g?.childItem?.id})}
+        ${$({className:tr,styles:{typo:J,typography:_,textAlign:W},setting:{text:l,htmlTag:"div",excludeFlex:!0,isForceValue:!0},translateSetting:g?.childItem?.id})}
       </li>
     `}).join("")}
             </ul>
           </div>
-          <div class="${es}">
+          <div class="${ts}">
             <div
-              ${{...ea}}
-              class="${ei}"
-              style="${el}"
+              ${{...ta}}
+              class="${ti}"
+              style="${tl}"
             >
-              ${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})}`:""}))}
+              ${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})}`:""}))}
             </div>
           </div>
         </div>

package/dist/esm/text/components/Text.liquid.js

@@ -1,9 +1,9 @@
 import{template as t}from"@gem-sdk/core";import{createAttr as o,createStyle as e,createClass as s,createContent as i}from"@gem-sdk/system";import{getAttr as r,getTextAttr as m}from"../common/attrs.js";import{getStyle as l,getContainerStyle as p,getTextStyle as n}from"../common/styles.js";import{getClasses as a,getTextClasses as d}from"../common/classes.js";import{getDisplayText as c}from"../common/helpers.js";let $=({id:$,styles:g,builderAttrs:u,style:f,setting:y,advanced:x,builderProps:j,className:v,isText:q,pageContext:h,translateSetting:k,elementAttrs:C})=>{let{htmlTag:L="div",excludeFlex:T}=y??{},I=o({...$&&{id:$},...r({uid:j?.uidInteraction??j?.uid??""}),...u}),O=o({...m(),...C}),_=e({...l(g,f)}),b=e({...p(g,y)}),w=e({...n({styles:g,setting:y,builderProps:j,pageContext:h??{},type:"Liquid"})}),z=s({...a({setting:y,advanced:x,builderProps:j})}),A=s({"gp-flex":!T}),B=s({...d({styles:g,setting:y,className:v}),...q&&{"gp-text":!0}}),D=c({type:"Liquid",styles:g,setting:y,builderProps:j,pageContext:h??{},translateSetting:k}),E=i(D);return t`
     {% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
     <div ${{...I}}
-        class="${z}"
-        style="${_}"
-      >
+      class="${z}"
+      style="${_}"
+    >
       <div class="${A}" style="${b}">
         <${L}
           ${{...O}}

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 b=b=>{let{title:h,id:u,lazy:v,aspectRatio:S,autoplay:j,muted:w,thumbnailLink:x,poster:E,translatedVideoUrl:k}=b,{iframeSrc:I}=y(b),L=!v,N=b.thumbnail,A=r({id:u,thumbnail:x,lazy:v,iframeSrc:I,title:h,autoplay:j,muted:w,style:b?.vimeoStyleIframe||"",translatedVideoUrl:k}),T=a({...f(S)}),V=a({...n(S,"")}),C=m({...p(N,S)}),G=m({...c(L)}),M=m({...d(L)}),O=m({...g()});return e`
-    <gp-lite-vimeo-embed gp-data='${JSON.stringify(A)}'>
+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 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 b=b=>{let{title:h,id:u,lazy:v,aspectRatio:j,autoplay:S,muted:w,thumbnailLink:x,poster:E,translatedVideoUrl:k}=b,{iframeSrc:I}=y(b),L=!v,N=b.thumbnail,A=r({id:u,thumbnail:x,lazy:v,iframeSrc:I,title:h,autoplay:S,muted:w,style:b?.vimeoStyleIframe||"",translatedVideoUrl:k}),T=a({...g(j)}),V=a({...f(j,"")}),C=m({...p(N,j)}),G=m({...c(L)}),M=m({...d(L)}),O=m({...n()});return e`
+    <gp-lite-vimeo-embed>
+      <script gp-data type="application/json">${JSON.stringify(A)}</script>
       <article
         aria-hidden
         class="${C}"

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

@@ -1,5 +1,6 @@
 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)}'>
+    <gp-lite-youtube-embed>
+      <script gp-data type="application/json">${JSON.stringify(T)}</script>
       <article
         aria-hidden
         class="${B}"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/components",
-  "version": "17.0.0-dev.113",
+  "version": "17.0.0-dev.114",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",
@@ -26,7 +26,7 @@
     "i18n:extract": "rollup -c ./scripts/rollup.config.settings.mjs && node ./scripts/translate/extract-texts-to-locales.js && node ./scripts/translate/en-keys-usage.js"
   },
   "devDependencies": {
-    "@gem-sdk/core": "17.0.0-dev.111",
+    "@gem-sdk/core": "17.0.0-dev.114",
     "@gem-sdk/styles": "17.0.0-dev.108",
     "@gem-sdk/system": "17.0.0-dev.93",
     "@types/react-transition-group": "^4.4.12",