@gem-sdk/components 17.0.0-dev.126 → 17.0.0-dev.128

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.
@@ -1,33 +1,33 @@
1
- "use strict";var e=require("@gem-sdk/system"),o=require("@gem-sdk/core"),t=require("./helpers.js");exports.getStyle=(s,r="liquid")=>{let{uid:a,vertical:i,showArrow:l,gapToEachSize:n,left:p,arrowBackgroundColor:g,arrowButtonSize:c,rootId:d,arrowBorder:m,arrowCorner:S,arrowCustomColor:$,arrowIconSize:y,arrowShadow:C}=s,b=o.makeStyle({bg:o.getSingleColorVariable(g)}),h=o.makeStyle({c:o.getSingleColorVariable($)}),u=o.getResponsiveStyleShadowWithoutState(C,"box-shadow",C),w=t.getResponsiveSetting(m||{}),v=t.getResponsiveSetting(S||{}),k=o.getPaddingGlobalSize(c),R=t.getResponsiveSetting(y||{}),x=t.getResponsiveSetting(l||{}),q=o.makeStyle({v:"hidden"}),f=t.getResponsiveWidth(c),z=t.getResponsiveHeight(c),B=o.makeStyleResponsive("w",R,"px"),A=o.makeStyleResponsive("h",R,"px"),P=o.makeStyleResponsive("d",t.getArrowDisplayStyle(x)),V=o.makeStyle(t.getArrowPositionStyle({vertical:i,arrowType:x,gapToEachSize:n??"",left:!!p})),W={...b,...P,...V,...f,...z,...k,...u,..."liquid"===r?q:{}},j={...h,...B,...A},D="react"===r?e.createStyleReact(W):e.createStyle(W),E="react"===r?e.createStyleReact(j):e.createStyle(j),G=`
2
- ${d?"."+d:""}.gp-carousel-arrow-${a} {
3
- ${o.composeCornerCss(v.desktop)}
1
+ "use strict";var e=require("@gem-sdk/system"),t=require("@gem-sdk/core"),o=require("./helpers.js");exports.getStyle=(s,r="liquid")=>{let{uid:i,vertical:n,showArrow:a,gapToEachSize:l,left:p,arrowBackgroundColor:d,arrowButtonSize:g,rootId:m,arrowBorder:c,arrowCorner:S,arrowCustomColor:y,arrowIconSize:C,arrowShadow:$}=s,b=t.makeStyle({bg:t.getSingleColorVariable(d)}),h=t.makeStyle({c:t.getSingleColorVariable(y)}),v=t.getResponsiveStyleShadowWithoutState($,"box-shadow",$),k=o.getResponsiveSetting(c||{}),R=o.getResponsiveSetting(S||{}),u=t.getPaddingGlobalSize(g),w=o.getResponsiveSetting(C||{}),x=o.getResponsiveSetting(a||{}),q=t.makeStyle({v:"hidden"}),f=o.getResponsiveWidth(g),z=o.getResponsiveHeight(g),B=t.makeStyleResponsive("w",w,"px"),A=t.makeStyleResponsive("h",w,"px"),P=t.makeStyleResponsive("d",o.getArrowDisplayStyle(x)),V=t.makeStyle(o.getArrowPositionStyle({vertical:n,arrowType:x,gapToEachSize:l??"",left:!!p})),W={...b,...P,...V,...f,...z,...u,...v,..."liquid"===r?q:{}},j={...h,...B,...A},D="react"===r?e.createStyleReact(W):e.createStyle(W),E="react"===r?e.createStyleReact(j):e.createStyle(j),G=`button${m?"."+m:""}.gp-carousel-arrow-${i}`,H=`
2
+ ${G} {
3
+ ${t.composeCornerCss(R.desktop)}
4
4
  }
5
- ${d?"."+d:""}.gp-carousel-arrow-${a}::before {
5
+ ${G}::before {
6
6
  content: '';
7
7
  height: 100%;
8
8
  width: 100%;
9
9
  position: absolute;
10
10
  pointer-events: none;
11
11
  z-index: 10;
12
- ${o.composeBorderCss(w.desktop)}
13
- ${o.composeCornerCss(v.desktop)}
12
+ ${t.composeBorderCss(k.desktop)}
13
+ ${t.composeCornerCss(R.desktop)}
14
14
  }
15
15
  @media only screen and (max-width: 1024px) and (min-width: 768px) {
16
- ${d?"."+d:""}.gp-carousel-arrow-${a} {
17
- ${o.composeCornerCss(v.tablet)}
16
+ ${G} {
17
+ ${t.composeCornerCss(R.tablet)}
18
18
  }
19
- ${d?"."+d:""}.gp-carousel-arrow-${a}::before {
20
- ${o.composeBorderCss(w.tablet)}
21
- ${o.composeCornerCss(v.tablet)}
19
+ ${G}::before {
20
+ ${t.composeBorderCss(k.tablet)}
21
+ ${t.composeCornerCss(R.tablet)}
22
22
  }
23
23
  }
24
24
  @media only screen and (max-width: 768px) {
25
- ${d?"."+d:""}.gp-carousel-arrow-${a} {
26
- ${o.composeCornerCss(v.mobile)}
25
+ ${G} {
26
+ ${t.composeCornerCss(R.mobile)}
27
27
  }
28
- ${d?"."+d:""}.gp-carousel-arrow-${a}::before {
29
- ${o.composeBorderCss(w.mobile)}
30
- ${o.composeCornerCss(v.mobile)}
28
+ ${G}::before {
29
+ ${t.composeBorderCss(k.mobile)}
30
+ ${t.composeCornerCss(R.mobile)}
31
31
  }
32
32
  }
33
- `;return{buttonStyle:D,buttonContentStyle:E,innerBorderCss:G}};
33
+ `;return{buttonStyle:D,buttonContentStyle:E,innerBorderCss:H}};
@@ -1,13 +1,13 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../../text/components/Text.liquid.js"),l=require("@gem-sdk/system"),a=require("../common/classes.js"),i=require("../common/styles.js"),r=require("../common/helpers.js");exports.default=c=>{let{builderProps:o,builderAttrs:n,style:p,setting:d,styles:g,pageContext:y}=c,u=o?.builderData?.advanced,$=l.createClass({[o?.uid??""]:!0}),m=l.createClass(a.getClassWraplistIcon()),S=l.createClass(a.getClassColListIcon()),v=l.createClass(a.getClassWrapItemIcon({builderProps:o})),I=l.createClass(a.getClassWrapIcon()),C=l.createClass(a.getClassIcon()),f=l.createClass(a.getClassTextItem({setting:d})),q=l.createStyle(i.getStyleContainerIconlistMain({styles:g,style:p,type:"liquid",advanced:u})),j=l.createStyle(i.getStyleWraplistIcon({styles:g,uid:o?.uid??"",pageContext:y,type:"Liquid"})),x=l.createStyle(i.getStyleColListIcon({styles:g})),T=l.createStyle(i.getStyleWrapIcon({styles:g,setting:d})),W=l.createStyle(i.getStyleWrapItemIcon({styles:g})),h=l.createStyle(i.getStyleIcon({styles:g,setting:d})),k=i.getStyleTypoText({setting:d}),A=l.createAttr({...n}),E=r.getTextIconNotFound("liquid"),L=r.getvalueMap({setting:d});return e.template`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@gem-sdk/core"),t=require("../../helpers.js"),s=require("../../text/components/Text.liquid.js"),l=require("@gem-sdk/system"),a=require("../common/classes.js"),i=require("../common/styles.js"),r=require("../common/helpers.js");exports.default=c=>{let{builderProps:o,builderAttrs:n,style:p,setting:d,styles:g,pageContext:y}=c,u=o?.builderData?.advanced,$=l.createClass({[o?.uid??""]:!0}),m=l.createClass(a.getClassWraplistIcon()),S=l.createClass(a.getClassColListIcon()),v=l.createClass(a.getClassWrapItemIcon({builderProps:o})),I=l.createClass(a.getClassWrapIcon()),C=l.createClass(a.getClassIcon()),q=l.createClass(a.getClassTextItem({setting:d})),f=l.createStyle(i.getStyleContainerIconlistMain({styles:g,style:p,type:"liquid",advanced:u})),j=l.createStyle(i.getStyleWraplistIcon({styles:g,uid:o?.uid??"",pageContext:y,type:"Liquid"})),x=l.createStyle(i.getStyleColListIcon({styles:g})),T=l.createStyle(i.getStyleWrapIcon({styles:g,setting:d})),W=l.createStyle(i.getStyleWrapItemIcon({styles:g})),h=l.createStyle(i.getStyleIcon({styles:g,setting:d})),k=i.getStyleTypoText({setting:d}),A=l.createAttr({...n}),E=r.getTextIconNotFound("liquid"),L=r.getvalueMap({setting:d});return e.template`
2
2
  {% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
3
3
  <gp-icon-list
4
4
  ${{...A}}
5
5
  ${{...o}}
6
6
  data-id="${o?.uid}"
7
- style="${q}"
7
+ style="${f}"
8
8
  className="${$}"
9
9
  >
10
- <script gp-data type="application/json">${JSON.stringify(e.dataStringify({position:g?.position,iconWidth:d?.iconWidth}).replaceAll("'","&#039;"))}</script>
10
+ <script gp-data type="application/json">${e.dataStringify({position:g?.position,iconWidth:d?.iconWidth}).replaceAll("'","&#039;")}</script>
11
11
  ${l.If(!L||!L.length,e.template`<div>${E}</div>`,e.template`
12
12
  <div class="${m}" style="${j}">
13
13
  <div class="${S}" style="${x}">
@@ -26,7 +26,7 @@
26
26
  ${t}
27
27
  </span>
28
28
  </div>
29
- ${s.default({setting:{text:a?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:k,className:f})}
29
+ ${s.default({setting:{text:a?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:k,className:q})}
30
30
  </div>`}).join(" ")}
31
31
  </div>
32
32
  </div>`)}
@@ -1,33 +1,33 @@
1
- import{createStyleReact as e,createStyle as o}from"@gem-sdk/system";import{makeStyle as r,getSingleColorVariable as t,getResponsiveStyleShadowWithoutState as a,getPaddingGlobalSize as i,makeStyleResponsive as l,composeCornerCss as p,composeBorderCss as d}from"@gem-sdk/core";import{getResponsiveWidth as s,getResponsiveHeight as $,getArrowDisplayStyle as n,getArrowPositionStyle as m,getResponsiveSetting as c}from"./helpers.js";let b=(b,g="liquid")=>{let{uid:w,vertical:h,showArrow:u,gapToEachSize:x,left:f,arrowBackgroundColor:k,arrowButtonSize:y,rootId:q,arrowBorder:v,arrowCorner:z,arrowCustomColor:S,arrowIconSize:j,arrowShadow:E}=b,T=r({bg:t(k)}),A=r({c:t(S)}),B=a(E,"box-shadow",E),C=c(v||{}),D=c(z||{}),F=i(y),G=c(j||{}),H=c(u||{}),I=r({v:"hidden"}),J=s(y),K=$(y),L=l("w",G,"px"),M=l("h",G,"px"),N=l("d",n(H)),O=r(m({vertical:h,arrowType:H,gapToEachSize:x??"",left:!!f})),P={...T,...N,...O,...J,...K,...F,...B,..."liquid"===g?I:{}},Q={...A,...L,...M},R="react"===g?e(P):o(P),U="react"===g?e(Q):o(Q),V=`
2
- ${q?"."+q:""}.gp-carousel-arrow-${w} {
3
- ${p(D.desktop)}
1
+ import{createStyleReact as e,createStyle as t}from"@gem-sdk/system";import{makeStyle as o,getSingleColorVariable as i,getResponsiveStyleShadowWithoutState as r,getPaddingGlobalSize as d,makeStyleResponsive as n,composeCornerCss as a,composeBorderCss as l}from"@gem-sdk/core";import{getResponsiveWidth as m,getResponsiveHeight as p,getArrowDisplayStyle as $,getArrowPositionStyle as s,getResponsiveSetting as b}from"./helpers.js";let h=(h,x="liquid")=>{let{uid:c,vertical:f,showArrow:g,gapToEachSize:w,left:u,arrowBackgroundColor:k,arrowButtonSize:y,rootId:q,arrowBorder:v,arrowCorner:z,arrowCustomColor:S,arrowIconSize:j,arrowShadow:E}=h,T=o({bg:i(k)}),A=o({c:i(S)}),B=r(E,"box-shadow",E),C=b(v||{}),D=b(z||{}),F=d(y),G=b(j||{}),H=b(g||{}),I=o({v:"hidden"}),J=m(y),K=p(y),L=n("w",G,"px"),M=n("h",G,"px"),N=n("d",$(H)),O=o(s({vertical:f,arrowType:H,gapToEachSize:w??"",left:!!u})),P={...T,...N,...O,...J,...K,...F,...B,..."liquid"===x?I:{}},Q={...A,...L,...M},R="react"===x?e(P):t(P),U="react"===x?e(Q):t(Q),V=`button${q?"."+q:""}.gp-carousel-arrow-${c}`,W=`
2
+ ${V} {
3
+ ${a(D.desktop)}
4
4
  }
5
- ${q?"."+q:""}.gp-carousel-arrow-${w}::before {
5
+ ${V}::before {
6
6
  content: '';
7
7
  height: 100%;
8
8
  width: 100%;
9
9
  position: absolute;
10
10
  pointer-events: none;
11
11
  z-index: 10;
12
- ${d(C.desktop)}
13
- ${p(D.desktop)}
12
+ ${l(C.desktop)}
13
+ ${a(D.desktop)}
14
14
  }
15
15
  @media only screen and (max-width: 1024px) and (min-width: 768px) {
16
- ${q?"."+q:""}.gp-carousel-arrow-${w} {
17
- ${p(D.tablet)}
16
+ ${V} {
17
+ ${a(D.tablet)}
18
18
  }
19
- ${q?"."+q:""}.gp-carousel-arrow-${w}::before {
20
- ${d(C.tablet)}
21
- ${p(D.tablet)}
19
+ ${V}::before {
20
+ ${l(C.tablet)}
21
+ ${a(D.tablet)}
22
22
  }
23
23
  }
24
24
  @media only screen and (max-width: 768px) {
25
- ${q?"."+q:""}.gp-carousel-arrow-${w} {
26
- ${p(D.mobile)}
25
+ ${V} {
26
+ ${a(D.mobile)}
27
27
  }
28
- ${q?"."+q:""}.gp-carousel-arrow-${w}::before {
29
- ${d(C.mobile)}
30
- ${p(D.mobile)}
28
+ ${V}::before {
29
+ ${l(C.mobile)}
30
+ ${a(D.mobile)}
31
31
  }
32
32
  }
33
- `;return{buttonStyle:R,buttonContentStyle:U,innerBorderCss:V}};export{b as getStyle};
33
+ `;return{buttonStyle:R,buttonContentStyle:U,innerBorderCss:W}};export{h as getStyle};
@@ -1,35 +1,35 @@
1
- import{dataStringify as s,template as i,RenderIf as t,isLocalEnv as e,baseAssetURL as l}from"@gem-sdk/core";import{getSettingPreloadData as o}from"../../helpers.js";import r from"../../text/components/Text.liquid.js";import{createClass as p,createStyle as a,createAttr as d,If as n}from"@gem-sdk/system";import{getClassWraplistIcon as c,getClassColListIcon as m,getClassWrapItemIcon as $,getClassWrapIcon as u,getClassIcon as g,getClassTextItem as y}from"../common/classes.js";import{getStyleContainerIconlistMain as v,getStyleWraplistIcon as f,getStyleColListIcon as j,getStyleWrapIcon as h,getStyleWrapItemIcon as S,getStyleIcon as q,getStyleTypoText as x}from"../common/styles.js";import{getvalueMap as k,getTextIconTranslations as E,getTextIconNotFound as N}from"../common/helpers.js";let A=A=>{let{builderProps:O,builderAttrs:T,style:V,setting:_,styles:w,pageContext:C}=A,G=O?.builderData?.advanced,I=p({[O?.uid??""]:!0}),L=p(c()),W=p(m()),b=p($({builderProps:O})),D=p(u()),F=p(g()),J=p(y({setting:_})),M=a(v({styles:w,style:V,type:"liquid",advanced:G})),P=a(f({styles:w,uid:O?.uid??"",pageContext:C,type:"Liquid"})),R=a(j({styles:w})),z=a(h({styles:w,setting:_})),B=a(S({styles:w})),H=a(q({styles:w,setting:_})),K=x({setting:_}),Q=d({...T}),U=N("liquid"),X=k({setting:_});return i`
1
+ import{dataStringify as s,template as i,RenderIf as t,isLocalEnv as e,baseAssetURL as l}from"@gem-sdk/core";import{getSettingPreloadData as o}from"../../helpers.js";import r from"../../text/components/Text.liquid.js";import{createClass as p,createStyle as a,createAttr as d,If as c}from"@gem-sdk/system";import{getClassWraplistIcon as n,getClassColListIcon as m,getClassWrapItemIcon as $,getClassWrapIcon as u,getClassIcon as g,getClassTextItem as v}from"../common/classes.js";import{getStyleContainerIconlistMain as y,getStyleWraplistIcon as f,getStyleColListIcon as j,getStyleWrapIcon as h,getStyleWrapItemIcon as q,getStyleIcon as x,getStyleTypoText as S}from"../common/styles.js";import{getvalueMap as k,getTextIconTranslations as E,getTextIconNotFound as A}from"../common/helpers.js";let N=N=>{let{builderProps:T,builderAttrs:V,style:_,setting:w,styles:C,pageContext:G}=N,I=T?.builderData?.advanced,L=p({[T?.uid??""]:!0}),O=p(n()),W=p(m()),b=p($({builderProps:T})),D=p(u()),F=p(g()),M=p(v({setting:w})),P=a(y({styles:C,style:_,type:"liquid",advanced:I})),R=a(f({styles:C,uid:T?.uid??"",pageContext:G,type:"Liquid"})),z=a(j({styles:C})),B=a(h({styles:C,setting:w})),H=a(q({styles:C})),J=a(x({styles:C,setting:w})),K=S({setting:w}),Q=d({...V}),U=A("liquid"),X=k({setting:w});return i`
2
2
  {% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
3
3
  <gp-icon-list
4
4
  ${{...Q}}
5
- ${{...O}}
6
- data-id="${O?.uid}"
7
- style="${M}"
8
- className="${I}"
5
+ ${{...T}}
6
+ data-id="${T?.uid}"
7
+ style="${P}"
8
+ className="${L}"
9
9
  >
10
- <script gp-data type="application/json">${JSON.stringify(s({position:w?.position,iconWidth:_?.iconWidth}).replaceAll("'","&#039;"))}</script>
11
- ${n(!X||!X.length,i`<div>${U}</div>`,i`
12
- <div class="${L}" style="${P}">
13
- <div class="${W}" style="${R}">
14
- ${X?.map((s,t)=>{let e=E({setting:_,builderProps:O,pageContext:C,key:t,type:"liquid"});return i`
10
+ <script gp-data type="application/json">${s({position:C?.position,iconWidth:w?.iconWidth}).replaceAll("'","&#039;")}</script>
11
+ ${c(!X||!X.length,i`<div>${U}</div>`,i`
12
+ <div class="${O}" style="${R}">
13
+ <div class="${W}" style="${z}">
14
+ ${X?.map((s,t)=>{let e=E({setting:w,builderProps:T,pageContext:G,key:t,type:"liquid"});return i`
15
15
  <div
16
16
  key="${t}"
17
17
  data-index="${t}"
18
18
  class="${b}"
19
- style="${B}"
19
+ style="${H}"
20
20
  >
21
- <div class="${D}" style="${z}">
21
+ <div class="${D}" style="${B}">
22
22
  <span
23
23
  class="${F}"
24
- style="${H}"
24
+ style="${J}"
25
25
  >
26
26
  ${s}
27
27
  </span>
28
28
  </div>
29
- ${r({setting:{text:e?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:K,className:J})}
29
+ ${r({setting:{text:e?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:K,className:M})}
30
30
  </div>`}).join(" ")}
31
31
  </div>
32
32
  </div>`)}
33
33
  </gp-icon-list>
34
34
  ${t(e,`<script ${o('class="gps-link" delay',"src")}="{{ 'gp-icon-list-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${o('class="gps-link" delay',"src")}="${l}/assets-v2/gp-icon-list-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
35
- `};export{A as default};
35
+ `};export{N as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/components",
3
- "version": "17.0.0-dev.126",
3
+ "version": "17.0.0-dev.128",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",