@gem-sdk/components 8.0.0-dev.64 → 8.0.0-dev.66
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/icon-list/common/styles.js +1 -1
- package/dist/cjs/icon-list/components/IconList.js +1 -1
- package/dist/cjs/icon-list/components/IconList.liquid.js +8 -8
- package/dist/cjs/icon-list/index.js +1 -1
- package/dist/cjs/icon-list/settings/configs/settings.js +1 -1
- package/dist/cjs/icon-list-v2/common/styles.js +1 -1
- package/dist/cjs/icon-list-v2/components/IconList.js +1 -1
- package/dist/cjs/icon-list-v2/components/IconList.liquid.js +13 -13
- package/dist/cjs/icon-list-v2/settings/configs/settings.js +1 -1
- package/dist/cjs/image/common/helpers.js +2 -2
- package/dist/cjs/image/components/Image.liquid.js +7 -7
- package/dist/cjs/image/settings/configs/settings.js +1 -1
- package/dist/cjs/image-comparison/common/helpers.js +1 -1
- package/dist/cjs/image-comparison/components/ImageComparison.liquid.js +3 -3
- package/dist/cjs/image-comparison/components/Label.liquid.js +7 -7
- package/dist/cjs/image-comparison/index.js +1 -1
- package/dist/cjs/image-comparison/settings/configs/settings.js +1 -1
- package/dist/cjs/post-purchase/line/index.js +1 -1
- package/dist/cjs/tab/common/styles.js +1 -1
- package/dist/cjs/tab/components/Tabs.js +1 -1
- package/dist/cjs/tab/components/Tabs.liquid.js +6 -6
- package/dist/cjs/tab/settings/configs/settings.js +1 -1
- package/dist/cjs/video/common/helpers.js +1 -1
- package/dist/esm/icon-list/common/styles.js +1 -1
- package/dist/esm/icon-list/components/IconList.js +1 -1
- package/dist/esm/icon-list/components/IconList.liquid.js +8 -8
- package/dist/esm/icon-list/index.js +1 -1
- package/dist/esm/icon-list/settings/configs/settings.js +1 -1
- package/dist/esm/icon-list-v2/common/styles.js +1 -1
- package/dist/esm/icon-list-v2/components/IconList.js +1 -1
- package/dist/esm/icon-list-v2/components/IconList.liquid.js +14 -14
- package/dist/esm/icon-list-v2/settings/configs/settings.js +1 -1
- package/dist/esm/image/common/helpers.js +2 -2
- package/dist/esm/image/components/Image.liquid.js +10 -10
- package/dist/esm/image/settings/configs/settings.js +1 -1
- package/dist/esm/image-comparison/common/helpers.js +1 -1
- package/dist/esm/image-comparison/components/ImageComparison.liquid.js +3 -3
- package/dist/esm/image-comparison/components/Label.liquid.js +7 -7
- package/dist/esm/image-comparison/index.js +1 -1
- package/dist/esm/image-comparison/settings/configs/settings.js +1 -1
- package/dist/esm/post-purchase/line/index.js +1 -1
- package/dist/esm/tab/common/styles.js +1 -1
- package/dist/esm/tab/components/Tabs.js +1 -1
- package/dist/esm/tab/components/Tabs.liquid.js +7 -7
- package/dist/esm/tab/settings/configs/settings.js +1 -1
- package/dist/esm/video/common/helpers.js +1 -1
- package/dist/types/index.d.ts +8 -5
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const TabsSettings=[{id:"setting",controls:[{id:"childItem",label:"Tabs Item",type:"child-item",default:["Tab 1","Tab 2","Tab 3"]},{id:"activeKey",type:"select-custom-options",label:"Order",controlOption:"childItem",default:0},{id:"translate",type:"input",default:"childItem"},{id:"position",type:"layout-selector",label:"Layout",iconViewBox:"0 0 74 48",enableItemBackground:!0,itemPerRow:2,options:[{value:"top",label:"Top",iconName:"gp-tab-top"},{value:"left",label:"Left",iconName:"gp-tab-left"},{value:"right",label:"Right",iconName:"gp-tab-bottom"}],devices:{desktop:{default:"top"}}},{id:"group-header",label:"Tabs Header",type:"group",controls:[{id:"labelTypoV2",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"text-1"}},compoDefaultValue:{custom:{textShadow:{angle:135,blur:"2px",distance:"2px",type:"custom",color:"rgba(18, 18, 18, 0.5)"}}},ignoreReRender:!0},{id:"panelFullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!1}}},{id:"panelWidth",label:"Width",type:"dropdown:input",units:["px","%"],displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}],devices:{desktop:{default:"Auto"}}},{id:"panelAlign",type:"option:value",label:"Alignment",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"panelAlignVertical",type:"option:value",label:"Alignment",options:[{label:"Top",value:"start",type:"align",tooltip:"Align Top",iconName:"gp-align-top"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Bottom",value:"end",type:"align",tooltip:"Align Bottom",iconName:"gp-align-bottom"}],devices:{desktop:{default:"start"}}},{id:"labelWidth",label:"Width",type:"input:unit",units:["px","%"],devices:{desktop:{default:"auto"}}},{id:"padding",type:"padding-v2",devices:{desktop:{}}},{id:"labelAlign",type:"option:value",label:"Text alignment",options:[{label:"Left",value:"left",type:"text"},{label:"Center",value:"center",type:"text"},{label:"Right",value:"right",type:"text"}],devices:{desktop:{default:"left"}}}]},{id:"enableHoverEffect",label:"",type:"toggle",default:!1},{id:"enableActiveEffect",label:"",type:"toggle",default:!0},{id:"behavior-state-group",type:"behavior-state",controls:[{id:"labelBgColor",label:"Background Color",type:"color-picker-v2",default:{active:"bg-1"},compoDefaultValue:{normal:"bg-2",hover:"bg-2",active:"bg-1"}},{id:"labelColor",label:"Text Color",type:"color-picker-v2",default:{normal:"text-1"},compoDefaultValue:{normal:"text-1"}},{id:"borderTab",type:"border",label:"Border",default:{active:{border:"solid",width:"0px 0px 1px 0px",borderWidth:"1px",color:"line-3",position:"bottom",isCustom:!0}}}]},{id:"containWidth",type:"input:unit",placeholder:"Auto",units:["px","%"],devices:{desktop:{default:"100%"}}},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#DDDDDD",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:1200},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"align",label:"Align",type:"option:value",options:[{label:"Left",value:"start",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"end",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"center"}}}]}];exports.TabsSettings=TabsSettings;
|
|
1
|
+
"use strict";const TabsSettings=[{id:"setting",controls:[{id:"childItem",label:"Tabs Item",type:"child-item",default:["Tab 1","Tab 2","Tab 3"]},{id:"activeKey",type:"select-custom-options",label:"Order",controlOption:"childItem",default:0},{id:"translate",type:"input",default:[{id:"childItem"},{id:"background",fields:["image.src"]}]},{id:"position",type:"layout-selector",label:"Layout",iconViewBox:"0 0 74 48",enableItemBackground:!0,itemPerRow:2,options:[{value:"top",label:"Top",iconName:"gp-tab-top"},{value:"left",label:"Left",iconName:"gp-tab-left"},{value:"right",label:"Right",iconName:"gp-tab-bottom"}],devices:{desktop:{default:"top"}}},{id:"group-header",label:"Tabs Header",type:"group",controls:[{id:"labelTypoV2",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"text-1"}},compoDefaultValue:{custom:{textShadow:{angle:135,blur:"2px",distance:"2px",type:"custom",color:"rgba(18, 18, 18, 0.5)"}}},ignoreReRender:!0},{id:"panelFullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!1}}},{id:"panelWidth",label:"Width",type:"dropdown:input",units:["px","%"],displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}],devices:{desktop:{default:"Auto"}}},{id:"panelAlign",type:"option:value",label:"Alignment",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"panelAlignVertical",type:"option:value",label:"Alignment",options:[{label:"Top",value:"start",type:"align",tooltip:"Align Top",iconName:"gp-align-top"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Bottom",value:"end",type:"align",tooltip:"Align Bottom",iconName:"gp-align-bottom"}],devices:{desktop:{default:"start"}}},{id:"labelWidth",label:"Width",type:"input:unit",units:["px","%"],devices:{desktop:{default:"auto"}}},{id:"padding",type:"padding-v2",devices:{desktop:{}}},{id:"labelAlign",type:"option:value",label:"Text alignment",options:[{label:"Left",value:"left",type:"text"},{label:"Center",value:"center",type:"text"},{label:"Right",value:"right",type:"text"}],devices:{desktop:{default:"left"}}}]},{id:"enableHoverEffect",label:"",type:"toggle",default:!1},{id:"enableActiveEffect",label:"",type:"toggle",default:!0},{id:"behavior-state-group",type:"behavior-state",controls:[{id:"labelBgColor",label:"Background Color",type:"color-picker-v2",default:{active:"bg-1"},compoDefaultValue:{normal:"bg-2",hover:"bg-2",active:"bg-1"}},{id:"labelColor",label:"Text Color",type:"color-picker-v2",default:{normal:"text-1"},compoDefaultValue:{normal:"text-1"}},{id:"borderTab",type:"border",label:"Border",default:{active:{border:"solid",width:"0px 0px 1px 0px",borderWidth:"1px",color:"line-3",position:"bottom",isCustom:!0}}}]},{id:"containWidth",type:"input:unit",placeholder:"Auto",units:["px","%"],devices:{desktop:{default:"100%"}}},{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#DDDDDD",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:1200},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"align",label:"Align",type:"option:value",options:[{label:"Left",value:"start",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"end",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"center"}}}]}];exports.TabsSettings=TabsSettings;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var core=require("@gem-sdk/core");const getAspectRatioSettings=(e,t)=>{let o={desktop:e?.desktop?.width,tablet:e?.tablet?.width,mobile:e?.mobile?.width},s={desktop:e?.desktop?.height,tablet:e?.tablet?.height,mobile:e?.mobile?.height},i={desktop:t?.desktop==="custom"?`${core.getResponsiveValueByScreen(o,"desktop")}/${core.getResponsiveValueByScreen(s,"desktop")}`:t?.desktop==="cover"?"unset":t?.desktop,tablet:t?.tablet==="custom"?`${core.getResponsiveValueByScreen(o,"tablet")}/${core.getResponsiveValueByScreen(s,"tablet")}`:t?.tablet==="cover"?"unset":t?.tablet,mobile:t?.mobile==="custom"?`${core.getResponsiveValueByScreen(o,"mobile")}/${core.getResponsiveValueByScreen(s,"mobile")}`:t?.mobile==="cover"?"unset":t?.mobile};return i},getYoutubeParams=e=>{let{id:t,params:o,muted:s,webp:i,controls:
|
|
1
|
+
"use strict";var core=require("@gem-sdk/core");require("react/jsx-runtime"),require("react"),require("next/link");const getAspectRatioSettings=(e,t)=>{let o={desktop:e?.desktop?.width,tablet:e?.tablet?.width,mobile:e?.mobile?.width},s={desktop:e?.desktop?.height,tablet:e?.tablet?.height,mobile:e?.mobile?.height},i={desktop:t?.desktop==="custom"?`${core.getResponsiveValueByScreen(o,"desktop")}/${core.getResponsiveValueByScreen(s,"desktop")}`:t?.desktop==="cover"?"unset":t?.desktop,tablet:t?.tablet==="custom"?`${core.getResponsiveValueByScreen(o,"tablet")}/${core.getResponsiveValueByScreen(s,"tablet")}`:t?.tablet==="cover"?"unset":t?.tablet,mobile:t?.mobile==="custom"?`${core.getResponsiveValueByScreen(o,"mobile")}/${core.getResponsiveValueByScreen(s,"mobile")}`:t?.mobile==="cover"?"unset":t?.mobile};return i},getYoutubeParams=e=>{let{id:t,params:o,muted:s,webp:i,controls:r,adNetwork:a,autoplay:p,lazy:l}=e,m=encodeURIComponent(t),u="hqdefault",d=`${o}`||"",n=s?"&mute=1":"",b=i?"webp":"jpg",c=i?"vi_webp":"vi",g=e.thumbnail||`https://i.ytimg.com/${c}/${m}/${u}.${b}`,v=e.noCookie?"https://www.youtube-nocookie.com":"https://www.youtube.com",V=`${v}/embed/${m}?autoplay=${!!l||p}&state=1${n}${d}&controls=${r?1:0}`,h=a||!1;return{videoId:m,posterImp:u,paramsImp:d,mutedImp:n,format:b,vi:c,posterUrl:g,ytUrl:v,iframeSrc:V,adNetworkImp:h}},getVimeoParams=e=>{let{id:t,autoplay:o,muted:s,controls:i,loop:r,lazy:a}=e,p=encodeURIComponent(t),l=`?&autoplay=${a?1:o?1:0}&muted=${s?1:0}&loop=${r?1:0}&controls=${i}&autopause=false`,m=`https://player.vimeo.com/video/${p}${l}`;return{videoId:p,params:l,iframeSrc:m}},makeStyleResponsiveRatio=(e,t)=>({[`--${e}`]:t?.desktop,[`--${e}-tablet`]:t?.tablet,[`--${e}-mobile`]:t?.mobile}),fallbackImageVideoUrl="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",youtubeVideoRegex=/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=|shorts\/)|youtu\.be\/)([^"&?/\s]{11})/i,vimeoVideoRegex=/^(?:http:\/\/|https:\/\/)vimeo\.com\/[\w/]+(?:\?.*)?$/im,getYoutubeVideoId=e=>{let t=e.match(youtubeVideoRegex);return t?.[1]??void 0},getVimeoVideoId=e=>{let t=/https?:\/\/(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|album\/(\d+)\/video\/|video\/)?(\d+)(?:$|\/|\?)/,o=e.match(t);return o?.[3]},parseTimeVideo=e=>{let t=e.split(":",2);return t.length<=1?parseInt(t[0]||"0"):60*parseInt(t[0]||"0")+parseInt(t[1]||"0")},covertStrParamsToObj=e=>{let t=e.split("&");return t.shift(),t.reduce((e,t)=>{let[o,s]=t.split("=");return"loop"!==o?{...e,[o]:s}:e},{})},isSettingLoop=e=>e.includes("loop=1");exports.covertStrParamsToObj=covertStrParamsToObj,exports.fallbackImageVideoUrl="https://cdn.shopify.com/s/files/1/0703/5214/2562/files/gempages_518090459516502570-3d3a4631-1d7d-4a2f-9ef0-9bbe7220e02d.jpg",exports.getAspectRatioSettings=getAspectRatioSettings,exports.getVimeoParams=getVimeoParams,exports.getVimeoVideoId=getVimeoVideoId,exports.getYoutubeParams=getYoutubeParams,exports.getYoutubeVideoId=getYoutubeVideoId,exports.isSettingLoop=isSettingLoop,exports.makeStyleResponsiveRatio=makeStyleResponsiveRatio,exports.parseTimeVideo=parseTimeVideo,exports.vimeoVideoRegex=vimeoVideoRegex,exports.youtubeVideoRegex=youtubeVideoRegex;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{makeGlobalSize as e,makeStyleResponsive as t,getStyleBackgroundByDevice as i,getGradientBgrStyleByDevice as r,getResponsiveStyleShadowWithoutState as l,composeRadiusResponsive as o,composeBorderResponsive as
|
|
1
|
+
import{makeGlobalSize as e,makeStyleResponsive as t,getStyleBackgroundByDevice as i,getGradientBgrStyleByDevice as r,getResponsiveStyleShadowWithoutState as l,composeRadiusResponsive as o,composeBorderResponsive as a,getGlobalColorResponsiveStyle as d}from"@gem-sdk/core";import{getBackgroundTranslated as s}from"../../helpers.js";let filterStyles=e=>{let t=["--mb","--mb-mobile","--mb-tablet"];return t.forEach(t=>{delete e?.[t]}),e||{}},getContainerStyles=({style:l,styles:o,extraData:a,uid:d,type:g="React",pageContext:m})=>{let{align:n,background:S,globalSize:c,translate:p}=o||{},u=e(c||{desktop:{width:"100%"}}),y="Liquid"===g?s({background:S,uid:d,translate:p,pageContext:m,isTranslateVideo:!1}):S,b={...l,...a?.advancedClasses,...u.width,...t("ta",n),...i(y,{liquid:a?.isLiquid}),...r(y)};return a?.isLiquid?b:filterStyles(b)},getWrapperStyles=e=>{let{alignWrapper:i}=e||{};return{...t("jc",i)}},getItemStyles=i=>{let r=e(i?.itemPadding);return{...r.padding,...l(i?.itemBoxShadow,"box-shadow",i?.itemBoxShadow),...o(i?.itemRounded),...a(i?.itemBorder),...d("bgc",i?.itemBackgroundColor),...d("bgi",i?.itemBackgroundColor),...t("cg",i?.horizontalSpacing)}},getUlStyles=e=>({...t("gg",e?.verticalSpacing)});export{getContainerStyles,getItemStyles,getUlStyles,getWrapperStyles};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsxs as e,Fragment as r,jsx as
|
|
2
|
+
import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import{composeAdvanceStyle as s,isEmptyChildren as t,filterToolbarPreview as i}from"@gem-sdk/core";import{Children as l,isValidElement as m}from"react";import o from"next/head";import{createStyle as d,createClass as c,If as n}from"@gem-sdk/system";import{getContainerStyles as p,getUlStyles as f,getWrapperStyles as g}from"../common/styles.js";import{getUlClasses as h,getWrapperClasses as u}from"../common/classes.js";let IconList=({style:y,setting:k,children:x,styles:b,builderProps:v,advanced:I,pageContext:j})=>{let{preload:C}=k||{},{background:L}=b??{},N=s(I),D=d(p({style:y,styles:b,type:"React",uid:v?.uid??"",pageContext:j,extraData:{advancedClasses:N}})),R=c(h(I?.cssClass)),S=d(f(b)),U=d(g(b)),q=c(u());return e(r,{children:[n(C,e(o,{children:[!!L?.desktop?.image?.src&&a("link",{rel:"preload",href:L.desktop.image.src,as:"image"}),!!L?.tablet?.image?.src&&a("link",{rel:"preload",href:L.tablet.image.src,as:"image"}),!!L?.mobile?.image?.src&&a("link",{rel:"preload",href:L.mobile.image.src,as:"image"})]})),a("div",{className:q,style:U,children:a("div",{"data-id":v?.uid,style:D,children:n(t(x),a("div",{children:"Icons not found"}),e(r,{children:[a("ul",{className:R,style:S,children:l.map(i(x),(e,r)=>m(e)?a(e.type,{...e.props,parentUid:v?.uid,parentStyles:b,dataIndex:r}):null)}),i(x,!0)]}))})})]})};export{IconList as default};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import{composeAdvanceStyle as
|
|
2
|
-
${m(!!
|
|
1
|
+
import{composeAdvanceStyle as e,template as s,WrapRenderChildren as i,RenderChildren as t}from"@gem-sdk/core";import{getStaticLocale as a}from"../../helpers.js";import{createStyle as r,createClass as o,If as m}from"@gem-sdk/system";import{getContainerStyles as d,getUlStyles as l,getWrapperStyles as c}from"../common/styles.js";import{getUlClasses as p,getWrapperClasses as n}from"../common/classes.js";let IconList=({builderProps:$,style:u,setting:g,rawChildren:f,styles:k,advanced:v,pageContext:y})=>{let{preload:L}=g||{},{background:b}=k||{},h=e(v),x=r(d({style:u,styles:k,type:"Liquid",uid:$?.uid??"",pageContext:y,extraData:{advancedClasses:h,isLiquid:!0}})),I=o(p(v?.cssClass)),j=r(l(k)),C=r(c(k)),q=o(n());return s`
|
|
2
|
+
${m(!!L,`${m(!!b?.desktop?.image?.src,`<link rel="preload" href="${b?.desktop?.image?.src}" as="image" />`)}
|
|
3
3
|
${m(!!b?.tablet?.image?.src,`<link rel="preload" href="${b?.tablet?.image?.src}" as="image" />`)}
|
|
4
4
|
${m(!!b?.mobile?.image?.src,`<link rel="preload" href="${b?.mobile?.image?.src}" as="image" />`)}`)}
|
|
5
|
-
<div class="${
|
|
5
|
+
<div class="${q}" style="${C}">
|
|
6
6
|
<div
|
|
7
7
|
data-id="${$?.uid}"
|
|
8
|
-
style="${
|
|
9
|
-
${m(!
|
|
10
|
-
${m(!!
|
|
11
|
-
class="${
|
|
8
|
+
style="${x}">
|
|
9
|
+
${m(!f,s`<div>${a("IconList","icons_not_found")}</div>`)}
|
|
10
|
+
${m(!!f,s`<ul
|
|
11
|
+
class="${I}"
|
|
12
12
|
style="${j}"
|
|
13
13
|
>
|
|
14
|
-
${i({uid:$?.uid??"",customProps:
|
|
14
|
+
${i({uid:$?.uid??"",customProps:f?.[0].customProps},f?.map((e,s)=>{if(e)return t({...e,dataIndex:s,parentUid:$?.uid,parentStyles:k})}))}
|
|
15
15
|
</ul>`)}
|
|
16
16
|
</div>
|
|
17
17
|
</div>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import"react/jsx-runtime";import"@gem-sdk/core";import"react";import"next/head";import"@gem-sdk/system";import t from"./settings/IconList.js";import i from"./settings/IconListItem.js";let iconListSetting={IconList:t,IconListItem:i};export{iconListSetting};
|
|
1
|
+
import"react/jsx-runtime";import"@gem-sdk/core";import"react";import"next/head";import"@gem-sdk/system";import"next/link";import t from"./settings/IconList.js";import i from"./settings/IconListItem.js";let iconListSetting={IconList:t,IconListItem:i};export{iconListSetting};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{itemControlTemplate as e,itemControlTemplateText as t,itemControlTemplateImage as i}from"./items.js";let IconListSettings=[{id:"setting",controls:[{id:"childItem",label:"Item management",type:"child-item",default:["Item 1","Item 2","Item 3"],childTemplate:{default:e,"icon-list-ver1-1-text":t,"icon-list-ver1-2-image":i}},{id:"preload",type:"toggle",label:"Preload",default:!1}]},{id:"style",controls:[{id:"background",type:"background-media",label:"Background Color & Image",devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"bg-2",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"alignWrapper",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"horizontalSpacing",label:"Horizontal Spacing",type:"input:slider",units:["px"],step:1,min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}},{id:"verticalSpacing",label:"Vertical Spacing",type:"input:slider",units:["px"],step:1,min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}},{id:"itemPadding",type:"size-setting",devices:{desktop:{default:{padding:{}}}},hiddenSettings:["shape","gap","height","width"]},{id:"itemBackgroundColor",type:"color-picker-v2",devices:{desktop:{default:"transparent"}},compoDefaultValue:{desktop:{default:"bg-2"}},enableGradient:!0},{id:"itemBorder",type:"border-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{border:"solid",color:"line-1",width:"1px",borderWidth:"1px"}}}},{id:"itemRounded",type:"corner-v2",devices:{desktop:{}},compoDefaultValue:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}}},{id:"itemBoxShadow",type:"shadow-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}}},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{width:"100%",padding:{}}},mobile:{default:{width:"100%"}}},settingConfig:{width:{displayOptions:["full","auto"]}},hiddenSettings:["shape","gap","height"]}]}];export{IconListSettings};
|
|
1
|
+
import{itemControlTemplate as e,itemControlTemplateText as t,itemControlTemplateImage as i}from"./items.js";let IconListSettings=[{id:"setting",controls:[{id:"childItem",label:"Item management",type:"child-item",default:["Item 1","Item 2","Item 3"],childTemplate:{default:e,"icon-list-ver1-1-text":t,"icon-list-ver1-2-image":i}},{id:"preload",type:"toggle",label:"Preload",default:!1}]},{id:"style",controls:[{id:"background",type:"background-media",label:"Background Color & Image",devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"bg-2",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"translate",type:"input",default:[{id:"background",fields:["image.src"]}]},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"alignWrapper",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"horizontalSpacing",label:"Horizontal Spacing",type:"input:slider",units:["px"],step:1,min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}},{id:"verticalSpacing",label:"Vertical Spacing",type:"input:slider",units:["px"],step:1,min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}},{id:"itemPadding",type:"size-setting",devices:{desktop:{default:{padding:{}}}},hiddenSettings:["shape","gap","height","width"]},{id:"itemBackgroundColor",type:"color-picker-v2",devices:{desktop:{default:"transparent"}},compoDefaultValue:{desktop:{default:"bg-2"}},enableGradient:!0},{id:"itemBorder",type:"border-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{border:"solid",color:"line-1",width:"1px",borderWidth:"1px"}}}},{id:"itemRounded",type:"corner-v2",devices:{desktop:{}},compoDefaultValue:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}}},{id:"itemBoxShadow",type:"shadow-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}}},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{width:"100%",padding:{}}},mobile:{default:{width:"100%"}}},settingConfig:{width:{displayOptions:["full","auto"]}},hiddenSettings:["shape","gap","height"]}]}];export{IconListSettings};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{makeStyleResponsive as e,composeBorderResponsive as t,getResponsiveStyleShadowWithoutState as l,composeRadiusResponsive as o,getStyleBackgroundByDevice as r,getResponsiveStylePadding as b,getGradientBgrStyleByDevice as
|
|
1
|
+
import{makeStyleResponsive as e,composeBorderResponsive as t,getResponsiveStyleShadowWithoutState as l,composeRadiusResponsive as o,getStyleBackgroundByDevice as r,getResponsiveStylePadding as b,getGradientBgrStyleByDevice as i,makeGlobalSize as n,makeStyle as a,getSingleColorVariable as s}from"@gem-sdk/core";import{getBackgroundTranslated as p}from"../../helpers.js";let filterStyles=e=>{let t=["--mb","--mb-mobile","--mb-tablet"];return t.forEach(t=>{delete e?.[t]}),e},getStyleContainerIconlistMain=({styles:t,style:l,type:o,advanced:r})=>{let{align:b}=t??{};return{...l="react"===o?filterStyles(l):l,...e("jc",b),...e("d",{desktop:r?.d?.desktop?"flex":"none",tablet:r?.d?.tablet?"flex":"none",mobile:r?.d?.mobile?"flex":"none"})}},getStyleWraplistIcon=({styles:n,translate:a,uid:s,pageContext:c,type:d="React"})=>{let{panelAlign:m,contentBoxPadding:g,contentBoxWidth:y,background:S,contentBoxBorder:I,contentBoxRounded:u,contentBoxShadow:x}=n??{},k="Liquid"===d?p({background:S,uid:s,translate:a,pageContext:c,isTranslateVideo:!1}):S;return{...t(I),...l(x,"box-shadow",x),...o(u),...r(k),...b(g),...e("w",y),...e("jc",m),...i(k,{desktop:!0,tablet:!0,mobile:!0})}},getStyleColListIcon=({styles:t})=>{let{verticalSpacing:l}=t??{};return{...e("rg",l)}},getStyleWrapItemIcon=({styles:t})=>{let{horizontalSpacing:l,position:o}=t??{};return{...e("cg",l),...e("ai",{...o,mobile:o?.mobile=="baseline"?"flex-start":o?.mobile})}},getStyleWrapIcon=({styles:t,setting:l})=>{let{iconBorder:o,backgroundColor:r,iconRounded:b}=t??{},{globalSize:i}=l??{},p=n(i);return{...p.padding,...a({bs:o?.border,bw:o?.width,bc:s(o?.color),bg:s(r),bblr:b?.bblr,bbrr:b?.bbrr,btlr:b?.btlr,btrr:b?.btrr}),...e("top",{desktop:"unset",tablet:"unset",mobile:"unset"}),...e("pos",{desktop:"relative",tablet:"relative",mobile:"relative"})}},getStyleIcon=({styles:e,setting:t})=>{let{iconColor:l}=e||{},{iconWidth:o}=t??{};return{"--c":s(l),"--w":"100%","--h":"100%","--size-desktop":`${o?.desktop}px`,"--size-tablet":`${o?.tablet||o?.desktop}px`,"--size-mobile":`${o?.mobile||o?.tablet||o?.desktop}px`}},getStyleTypoText=({setting:e})=>({typo:e?.textTypo});export{getStyleColListIcon,getStyleContainerIconlistMain,getStyleIcon,getStyleTypoText,getStyleWrapIcon,getStyleWrapItemIcon,getStyleWraplistIcon};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useGetProductId as s}from"../../hooks/useGetProductId.js";import
|
|
2
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useGetProductId as s}from"../../hooks/useGetProductId.js";import i from"../../text/components/Text.js";import{createClass as o,createStyle as r,createAttr as m,If as l}from"@gem-sdk/system";import{getClassWraplistIcon as n,getClassColListIcon as a,getClassWrapItemIcon as c,getClassWrapIcon as d,getClassIcon as p,getClassTextItem as u}from"../common/classes.js";import{getStyleContainerIconlistMain as h,getStyleWraplistIcon as f,getStyleColListIcon as y,getStyleIcon as g,getStyleWrapIcon as j,getStyleWrapItemIcon as v,getStyleTypoText as N}from"../common/styles.js";import{getvalueMap as x,composePostionIconList as I,getTextIconTranslations as L,getTextIconNotFound as k,composeIconWith as w}from"../common/helpers.js";import{useIconLineHeight as S}from"../hooks/useIconLineHeight.js";let IconListV2=T=>{let{builderProps:W,builderAttrs:$,style:H,setting:V,styles:_,pageContext:q,advanced:C}=T,G=o({[W?.uid??""]:!0}),M=o(n()),P=o(a()),b=o(c({builderProps:W})),z=o(d()),A=o(p()),B=o(u({setting:V})),D=r(h({styles:_,style:H,type:"react",advanced:C})),E=r(f({styles:_,uid:W?.uid??"",pageContext:q})),F=r(y({styles:_})),J=r(g({styles:_,setting:V})),K=N({setting:V}),O=m({...$}),Q=k("react"),R=x({setting:V}),{ref:U,lineHeight:X}=S({iconWidth:w(V?.iconWidth)}),Y=I(X,_?.position,V?.iconWidth),{refContainer:Z,productID:ee}=s(),et=r({...j({styles:_,setting:V}),...Y.content}),es=r({...v({styles:_}),...Y.wrapper});return e("div",{...O,...W,"data-id":W?.uid,style:D,className:G,ref:Z,children:l(!R||!R.length,e("div",{children:Q}),e("div",{className:M,style:E,children:e("div",{className:P,style:F,children:R?.map((s,o)=>{let r=L({setting:V,builderProps:W,pageContext:q,key:o,type:"react"});return t("div",{"data-index":o,className:b,style:es,children:[e("div",{className:z,style:et,children:e("span",{style:J,className:A,dangerouslySetInnerHTML:{__html:s}})}),e(i,{setting:{text:r?.toString(),htmlTag:"div",options:{useState:!0,uniqueId:`${W?.uid}-${o}-${ee}`,productID:ee,customClass:{wrapper:"gp-w-full"}}},styles:K,className:B,ref:U})]},o)})})}))})};export{IconListV2 as default};
|
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import{template as s,dataStringify 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 a,createStyle as d,createAttr as p,If as
|
|
1
|
+
import{template as s,dataStringify 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 a,createStyle as d,createAttr as p,If as n}from"@gem-sdk/system";import{getClassWraplistIcon as c,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 V}from"../common/helpers.js";let IconListV2=A=>{let{builderProps:I,builderAttrs:L,style:N,setting:T,styles:_,pageContext:w}=A,{translate:C}=T??{},G=I?.builderData?.advanced,O=a({[I?.uid??""]:!0}),W=a(c()),b=a(m()),D=a($({builderProps:I})),F=a(u()),M=a(g()),P=a(v({setting:T})),R=d(y({styles:_,style:N,type:"liquid",advanced:G})),z=d(f({styles:_,translate:C,uid:I?.uid??"",pageContext:w,type:"Liquid"})),B=d(j({styles:_,setting:T})),H=d(h({styles:_,setting:T})),J=d(q({styles:_})),K=d(x({styles:_,setting:T})),Q=S({setting:T}),U=p({...L}),X=V("liquid"),Y=k({setting:T});return s`
|
|
2
2
|
{% assign locationOrigin = request.origin | append: routes.root_url | split: '/' | join: '/' %}
|
|
3
3
|
<gp-icon-list
|
|
4
|
-
${{...
|
|
4
|
+
${{...U}}
|
|
5
5
|
${{...I}}
|
|
6
6
|
data-id="${I?.uid}"
|
|
7
|
-
style="${
|
|
7
|
+
style="${R}"
|
|
8
8
|
className="${O}"
|
|
9
|
-
gp-data='${i({position:
|
|
9
|
+
gp-data='${i({position:_?.position,iconWidth:T?.iconWidth}).replaceAll("'","'")}'
|
|
10
10
|
>
|
|
11
|
-
${
|
|
12
|
-
<div class="${W}" style="${
|
|
13
|
-
<div class="${b}" style="${
|
|
14
|
-
${
|
|
11
|
+
${n(!Y||!Y.length,s`<div>${X}</div>`,s`
|
|
12
|
+
<div class="${W}" style="${z}">
|
|
13
|
+
<div class="${b}" style="${B}">
|
|
14
|
+
${Y?.map((i,t)=>{let e=E({setting:T,builderProps:I,pageContext:w,key:t,type:"liquid"});return s`
|
|
15
15
|
<div
|
|
16
16
|
key="${t}"
|
|
17
17
|
data-index="${t}"
|
|
18
|
-
class="${
|
|
19
|
-
style="${
|
|
18
|
+
class="${D}"
|
|
19
|
+
style="${J}"
|
|
20
20
|
>
|
|
21
|
-
<div class="${
|
|
21
|
+
<div class="${F}" style="${H}">
|
|
22
22
|
<span
|
|
23
|
-
class="${
|
|
24
|
-
style="${
|
|
23
|
+
class="${M}"
|
|
24
|
+
style="${K}"
|
|
25
25
|
>
|
|
26
26
|
${i}
|
|
27
27
|
</span>
|
|
28
28
|
</div>
|
|
29
|
-
${r({setting:{text:e?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:
|
|
29
|
+
${r({setting:{text:e?.toString(),htmlTag:"div",options:{customClass:{wrapper:"gp-w-full"}},isForceValue:!0},styles:Q,className:P})}
|
|
30
30
|
</div>`}).join(" ")}
|
|
31
31
|
</div>
|
|
32
32
|
</div>`)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{itemControlTemplate as e}from"./items.js";let IconListSettings=[{id:"setting",controls:[{id:"childItem",label:"Item management",type:"child-item",default:["Icon 1","Icon 2"],childTemplate:e,isDisabledDuplicateIncrease:!0},{id:"translate",type:"input",default:"childItem"},{id:"textTypo",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"#FEB91C"}},compoDefaultValue:{attrs:{color:"#FEB91C"}},ignoreReRender:!0,hiddenSetting:{textAlign:!0,textShadow:!0}},{id:"iconSvg",type:"icon",label:"Icon Parent",hideInput:!0,info:"Choose from list or paste any SVG icon",default:'<svg data-name="check-circle-filled" height="20" width="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" data-id="508414807831544168"><path fill="currentColor" strokelinecap="round" strokelinejoin="round" d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z"></path></svg>'},{id:"iconWidth",type:"input:stepper",label:"Icon Width",devices:{desktop:{default:24}},min:0},{id:"childConfig",type:"child-icon",label:"",default:[,,,].fill('<svg height="20" width="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" data-id="508414807831544168"><path fill="currentColor" strokelinecap="round" strokelinejoin="round" d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z"></path></svg>')},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{padding:{type:"custom",top:"0px",bottom:"0px",left:"0px",right:"0px"}}}},hiddenShowMore:!0,hiddenSettings:["shape","width","height","gap"]},{id:"iconType",type:"option:illustration",enableTooltip:!0,label:"Icon type",options:[{label:"Matching icons",value:"matching",svgName:"gp-item-list-matching-icon"},{label:"Different icons",value:"different",svgName:"gp-item-list-different-icon"}],default:"matching"}]},{id:"style",controls:[{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#DDDDDD",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"iconColor",type:"color-picker-v2",label:"Icon color",default:"text-1",compoDefaultValue:"text-1"},{id:"backgroundColor",type:"color-picker-v2",label:"Background color",default:"transparent",compoDefaultValue:"bg-1"},{id:"iconBorder",label:"Border",type:"border-v2",default:{},compoDefaultValue:{border:"solid",width:"1px 1px 1px 1px",position:"bottom",color:"line-3",isCustom:!0,borderWidth:"Mixed"}},{id:"iconRounded",type:"corner-v2",label:"Border Radius",default:{radiusType:"none"},compoDefaultValue:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}},{id:"horizontalSpacing",label:"Horizontal Spacing",type:"input:slider",units:["px"],min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"8px"}}},{id:"position",type:"option:illustration",enableTooltip:!0,label:"Position",options:[{label:"Align center",value:"center",type:"align-pos",svgName:"gp-align-position-center"},{label:"Align top",value:"baseline",type:"align-pos",svgName:"gp-align-position-top"}],devices:{desktop:{default:"center"},tablet:{default:"center"},mobile:{default:"center"}}},{id:"contentBoxWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}],devices:{desktop:{default:"100%"}}},{id:"contentBoxPadding",label:"Padding",type:"padding-v2",devices:{desktop:{}},compoDefaultValue:{desktop:{default:{top:"16px",bottom:"16px",left:"16px",right:"16px"}}}},{id:"contentBoxBorder",label:"Border",type:"border",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{border:"solid",width:"1px 1px 1px 1px",position:"bottom",color:"line-3",isCustom:!0,borderWidth:"Mixed"}}}},{id:"contentBoxRounded",type:"corner-v2",label:"Border Radius",devices:{desktop:{default:{radiusType:"none"}}},compoDefaultValue:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}}},{id:"contentBoxShadow",label:"Shadow",type:"shadow-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}}},{id:"panelAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"verticalSpacing",type:"input:slider",label:"Item gap",units:["px"],min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}}]}];export{IconListSettings};
|
|
1
|
+
import{itemControlTemplate as e}from"./items.js";let IconListSettings=[{id:"setting",controls:[{id:"childItem",label:"Item management",type:"child-item",default:["Icon 1","Icon 2"],childTemplate:e,isDisabledDuplicateIncrease:!0},{id:"translate",type:"input",default:[{id:"childItem"},{id:"background",fields:["image.src"]}]},{id:"textTypo",type:"typography-v2",default:{type:"paragraph-1",attrs:{color:"#FEB91C"}},compoDefaultValue:{attrs:{color:"#FEB91C"}},ignoreReRender:!0,hiddenSetting:{textAlign:!0,textShadow:!0}},{id:"iconSvg",type:"icon",label:"Icon Parent",hideInput:!0,info:"Choose from list or paste any SVG icon",default:'<svg data-name="check-circle-filled" height="20" width="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" data-id="508414807831544168"><path fill="currentColor" strokelinecap="round" strokelinejoin="round" d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z"></path></svg>'},{id:"iconWidth",type:"input:stepper",label:"Icon Width",devices:{desktop:{default:24}},min:0},{id:"childConfig",type:"child-icon",label:"",default:[,,,].fill('<svg height="20" width="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" data-id="508414807831544168"><path fill="currentColor" strokelinecap="round" strokelinejoin="round" d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z"></path></svg>')},{id:"globalSize",type:"size-setting",devices:{desktop:{default:{padding:{type:"custom",top:"0px",bottom:"0px",left:"0px",right:"0px"}}}},hiddenShowMore:!0,hiddenSettings:["shape","width","height","gap"]},{id:"iconType",type:"option:illustration",enableTooltip:!0,label:"Icon type",options:[{label:"Matching icons",value:"matching",svgName:"gp-item-list-matching-icon"},{label:"Different icons",value:"different",svgName:"gp-item-list-different-icon"}],default:"matching"}]},{id:"style",controls:[{id:"background",type:"background-media",ignoreReRender:!0,devices:{desktop:{default:{type:"color",color:"transparent",image:{src:"",width:0,height:0},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}},compoDefaultValue:{desktop:{default:{type:"color",color:"#DDDDDD",image:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/background_settings.jpg",width:1200,height:480},size:"cover",position:{x:50,y:50},repeat:"no-repeat",attachment:"scroll"}}}},{id:"iconColor",type:"color-picker-v2",label:"Icon color",default:"text-1",compoDefaultValue:"text-1"},{id:"backgroundColor",type:"color-picker-v2",label:"Background color",default:"transparent",compoDefaultValue:"bg-1"},{id:"iconBorder",label:"Border",type:"border-v2",default:{},compoDefaultValue:{border:"solid",width:"1px 1px 1px 1px",position:"bottom",color:"line-3",isCustom:!0,borderWidth:"Mixed"}},{id:"iconRounded",type:"corner-v2",label:"Border Radius",default:{radiusType:"none"},compoDefaultValue:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}},{id:"horizontalSpacing",label:"Horizontal Spacing",type:"input:slider",units:["px"],min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"8px"}}},{id:"position",type:"option:illustration",enableTooltip:!0,label:"Position",options:[{label:"Align center",value:"center",type:"align-pos",svgName:"gp-align-position-center"},{label:"Align top",value:"baseline",type:"align-pos",svgName:"gp-align-position-top"}],devices:{desktop:{default:"center"},tablet:{default:"center"},mobile:{default:"center"}}},{id:"contentBoxWidth",type:"dropdown:input",label:"Width",inputType:"number",units:["px","%"],hideUnit:!1,displayOptions:[{label:"Fit content",value:"Auto",showValue:!0},{label:"Full",value:"100%",showValue:!0}],devices:{desktop:{default:"100%"}}},{id:"contentBoxPadding",label:"Padding",type:"padding-v2",devices:{desktop:{}},compoDefaultValue:{desktop:{default:{top:"16px",bottom:"16px",left:"16px",right:"16px"}}}},{id:"contentBoxBorder",label:"Border",type:"border",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{border:"solid",width:"1px 1px 1px 1px",position:"bottom",color:"line-3",isCustom:!0,borderWidth:"Mixed"}}}},{id:"contentBoxRounded",type:"corner-v2",label:"Border Radius",devices:{desktop:{default:{radiusType:"none"}}},compoDefaultValue:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}}},{id:"contentBoxShadow",label:"Shadow",type:"shadow-v2",devices:{desktop:{default:{}}},compoDefaultValue:{desktop:{default:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}}},{id:"panelAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"left"}}},{id:"verticalSpacing",type:"input:slider",label:"Item gap",units:["px"],min:0,max:40,ignoreMax:!0,devices:{desktop:{default:"12px"}}}]}];export{IconListSettings};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{cloneDeep as e,getCornerCSSFromGlobal as t,getAspectRatioGlobalSize as i,makeStyleResponsive as r,DEVICES as a,getResponsiveValueByScreen as l}from"@gem-sdk/core";import{getDynamicSourceLocales as g}from"../../helpers.js";let overwriteDefaultRadius=e=>{let i={...e},r=!0;return i&&Object.keys(i??{}).forEach(e=>{if("bblr"===e||"bbrr"===e||"btlr"===e||"btrr"===e){let t=i[e]??{};"0px"!==t&&(r=!1)}}),r?t(i):{}},getAspectRatio=({styles:e,setting:t})=>{let{srcSet:r,image:a}=t??{},{customAspectRadio:l,shape:g}=e??{},s={desktop:composeAspectRatio({device:"desktop",aspect:e?.aspectRatio,auto:t?.isAdaptive?r?.desktop:a,custom:l}),tablet:composeAspectRatio({device:"tablet",aspect:e?.aspectRatio,auto:t?.isAdaptive?r?.tablet:a,custom:l}),mobile:composeAspectRatio({device:"mobile",aspect:e?.aspectRatio,auto:t?.isAdaptive?r?.mobile:a,custom:l})};return g?i(g):s},composeAspectRatio=({device:e,aspect:t,custom:i,auto:r})=>{let a=t?.[e];return"auto"===a?r?.height?`${r.width}/${r.height}`:void 0:"custom"===a?i?.[e]?.height?`${i?.[e]?.width}/${i?.[e]?.height}`:void 0:a},getResponsiveObjectFit=({layout:e,isDisableObjectFit:t})=>t?{}:r("objf",e),getAspectRatioNextImage=({isDisableAspectStyle:e,aspectRatio:t,objectFits:i,width:r,height:l})=>{if(e)return{};let g={};return a.forEach(e=>{let a=`--objf${"desktop"!==e?`-${e}`:""}`,s=i?.[a]||i?.["--objf"];if(t?.[e]==="auto"&&"contain"===s){g[e]="auto";return}g[e]=t?.[e]!=="auto"&&t?.[e]?t[e]:`${r}/${l}`}),g},safeStringify=e=>JSON.stringify(e||{}).replace(/"/g,"""),shimmer=(e,t)=>`<svg width="${e}" height="${t}" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
2
2
|
<defs>
|
|
3
3
|
<linearGradient id="g-${e}-${t}">
|
|
4
4
|
<stop stop-color="rgba(51, 51, 51, 0)" offset="20%" />
|
|
@@ -9,4 +9,4 @@ import{getCornerCSSFromGlobal as e,getAspectRatioGlobalSize as t,makeStyleRespon
|
|
|
9
9
|
<rect width="${e}" height="${t}" fill="rgba(51, 51, 51, 0)" />
|
|
10
10
|
<rect id="r" width="${e}" height="${t}" fill="url(#g-${e}-${t})" />
|
|
11
11
|
<animate xlink:href="#r" attributeName="x" from="-${e}" to="${e}" dur="1s" repeatCount="indefinite" />
|
|
12
|
-
</svg>`,toBase64=e=>"undefined"==typeof window?Buffer.from(e).toString("base64"):window.btoa(e),createBlurDataURL=(e,t)=>`data:image/svg+xml;base64,${toBase64(shimmer(e,t))}`,IMAGE_PLACEHOLDER="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",FALLBACK_IMAGE="https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",NEXT_IMAGE_CONFIG={DEFAULT_SIZES:"100vw",DEFAULT_ALT:"Alt image",DEFAULT_SRC:"https://cdn.shopify.com/s/files/1/2005/9307/files/placeholder-1.png?v=1751355990",DEFAULT_WIDTH_PROPS:800,DEFAULT_HEIGHT_PROPS:533},getAdaptiveImageData=e=>{let{srcSet:t,fallbackImg:i}=e,r=e=>{let{isLiquid:r}=e??{},a=getImageSrc(t?.desktop,"desktop",!r)||i||FALLBACK_IMAGE,l=getImageSrc(t?.tablet,"tablet",!r)||getImageSrc(t?.desktop,"tablet",!r)||i||FALLBACK_IMAGE,g=getImageSrc(t?.mobile,"mobile",!r)||getImageSrc(t?.tablet,"mobile",!r)||getImageSrc(t?.desktop,"mobile",!r)||i||FALLBACK_IMAGE;return{srcTablet:l,srcMobile:g,srcDesktop:a}};return{getDeviceSource:r}},getSrcSet=(e,t,i)=>e?getSrcSetLiquid(e,t):getSrcSetLink(i),isCannotResizeImage=e=>e.includes("webp")||e.includes("jfif")||e.includes(".svg")||e.includes(".tiff"),getSrcSetLiquid=(e,t)=>{let i=replaceBackupFileKeyFileContent(e);return isCannotResizeImage(e)?"FILE_CONTENT"==t?`{{ '${i}' | file_url }} 768w, {{ '${i}' | file_url }} 1024w, {{ '${i}' | file_url }} 1440w`:`{{ '${e}' | asset_url }} 768w, {{ '${e}' | asset_url }} 1024w, {{ '${e}' | asset_url }} 1440w`:"FILE_CONTENT"==t?`{{ '${i}' | file_img_url: '768x' }} 768w, {{ '${i}' | file_img_url: '1024x' }} 1024w, {{ '${i}' | file_img_url: 'master' }} 1440w`:`{{ '${e}' | asset_img_url: '768x' }} 768w, {{ '${e}' | asset_img_url: '1024x' }} 1024w, {{ '${e}' | asset_img_url: 'master' }} 1440w`},getSrcSetLink=e=>e,getImageSrc=(e,t,i)=>{if(e?.metafieldDefinitionKey)return getImageMetafieldDefinitionKey(e?.metafieldDefinitionKey);let r=e?.backupFilePath??e?.src??"";if(i)r=e?.src||"";else if(e?.backupFileKey){let t=getNewBackupFileKey(e.backupFileKey,e?.src??"");"THEME"!==e.storage&&e.storage?"FILE_CONTENT"===e.storage&&(r=`{{ "${replaceBackupFileKeyFileContent(t)}" | file_url }}`):r=`{{ "${t}" | asset_url }}`}if(t&&r?.includes("cdn.shopify"))switch(t){case"tablet":r=r?.replace(regexReplaceEndDot,"_1024x.");break;case"mobile":r=r?.replace(regexReplaceEndDot,"_768x.")}return r},getImageMetafieldDefinitionKey=e=>`{{${e} | file_url}}`,regexReplaceEndDot=/\.(?=[^.]*$)/,replaceBackupFileKeyFileContent=e=>e.replace(/\.jpeg|\.jfif/g,".jpg"),getNewBackupFileKey=(e,t)=>{let i=t?.match(/\/files\/([^\/]+\.(jpg|jpeg|gif|png|webp|svg))/)?.[1];return i&&i!=e?i:e};function resizeImage(e,t){let i=e.match(/\.webp/g)?.length,r=replaceRegexLastMatch({str:e,reg:/_(pico|icon|thumb|small|compact|medium|large|grande|original|1024x1024|2048x2048|master)+\./g,newString:"."});if(i)return r;let a=replaceRegexLastMatch({str:r,reg:/\.jpg|\.png|\.gif|\.jpeg/g,newString:t,isAdd:!0});return a}let replaceRegexLastMatch=e=>{let t=e.str,i=e.str.match(e.reg)?.length;if(i){let r,a=1;for(;null!==(r=e.reg.exec(e.str));){if(a===i){let i=e.reg.lastIndex,a=i-r[0].length;e.isAdd&&(e.newString="_"+e.newString+r),t=t.slice(0,a)+e.newString+t.slice(i,t.length)}a++}}return t},getItemWidth=(e,t)=>{let i=getCurrentDevice(),r=t?.[i]||"auto";if(!r||"auto"===r||r.includes("%"))return e;let a=Number(r.replace("px",""));return a>e?e:Number(r.replace("px",""))},getImageWidthFollowByQuality=e=>{let{itemWidthParam:t,imageWidthSetting:i,qualityType:r,qualityPercent:
|
|
12
|
+
</svg>`,toBase64=e=>"undefined"==typeof window?Buffer.from(e).toString("base64"):window.btoa(e),createBlurDataURL=(e,t)=>`data:image/svg+xml;base64,${toBase64(shimmer(e,t))}`,IMAGE_PLACEHOLDER="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",FALLBACK_IMAGE="https://cdn.shopify.com/s/assets/no-image-2048-5e88c1b20e087fb7bbe9a3771824e743c244f437e4f8ba93bbf7b11b53f7824c_large.gif",NEXT_IMAGE_CONFIG={DEFAULT_SIZES:"100vw",DEFAULT_ALT:"Alt image",DEFAULT_SRC:"https://cdn.shopify.com/s/files/1/2005/9307/files/placeholder-1.png?v=1751355990",DEFAULT_WIDTH_PROPS:800,DEFAULT_HEIGHT_PROPS:533},getAdaptiveImageData=e=>{let{srcSet:t,fallbackImg:i}=e,r=e=>{let{isLiquid:r}=e??{},a=getImageSrc(t?.desktop,"desktop",!r)||i||FALLBACK_IMAGE,l=getImageSrc(t?.tablet,"tablet",!r)||getImageSrc(t?.desktop,"tablet",!r)||i||FALLBACK_IMAGE,g=getImageSrc(t?.mobile,"mobile",!r)||getImageSrc(t?.tablet,"mobile",!r)||getImageSrc(t?.desktop,"mobile",!r)||i||FALLBACK_IMAGE;return{srcTablet:l,srcMobile:g,srcDesktop:a}};return{getDeviceSource:r}},getSettingTranslatedImageAndSeo=({setting:t,uid:i,pageContext:r})=>{let a=t?.translate?"true":void 0;if(!t||!a)return{};let l=e(t);for(let e in l.srcSet){let t=l.srcSet[e];if(t&&t.src){let l=g({val:t.src,uid:i,settingId:`srcSet_${e}_src`,translate:a,pageContext:r});t.src=String(l)}}let s=g({val:l.alt,uid:i,settingId:"alt",translate:a,pageContext:r});l.alt=String(s);let o=g({val:l.title,uid:i,settingId:"title",translate:a,pageContext:r});return l.title=String(o),l},getSrcSet=(e,t,i)=>e?getSrcSetLiquid(e,t):getSrcSetLink(i),isCannotResizeImage=e=>e.includes("webp")||e.includes("jfif")||e.includes(".svg")||e.includes(".tiff"),getSrcSetLiquid=(e,t)=>{let i=replaceBackupFileKeyFileContent(e);return isCannotResizeImage(e)?"FILE_CONTENT"==t?`{{ '${i}' | file_url }} 768w, {{ '${i}' | file_url }} 1024w, {{ '${i}' | file_url }} 1440w`:`{{ '${e}' | asset_url }} 768w, {{ '${e}' | asset_url }} 1024w, {{ '${e}' | asset_url }} 1440w`:"FILE_CONTENT"==t?`{{ '${i}' | file_img_url: '768x' }} 768w, {{ '${i}' | file_img_url: '1024x' }} 1024w, {{ '${i}' | file_img_url: 'master' }} 1440w`:`{{ '${e}' | asset_img_url: '768x' }} 768w, {{ '${e}' | asset_img_url: '1024x' }} 1024w, {{ '${e}' | asset_img_url: 'master' }} 1440w`},getSrcSetLink=e=>e,getImageSrc=(e,t,i)=>{if(e?.metafieldDefinitionKey)return getImageMetafieldDefinitionKey(e?.metafieldDefinitionKey);let r=e?.backupFilePath??e?.src??"";if(i)r=e?.src||"";else if(e?.backupFileKey){let t=getNewBackupFileKey(e.backupFileKey,e?.src??"");"THEME"!==e.storage&&e.storage?"FILE_CONTENT"===e.storage&&(r=`{{ "${replaceBackupFileKeyFileContent(t)}" | file_url }}`):r=`{{ "${t}" | asset_url }}`}if(t&&r?.includes("cdn.shopify"))switch(t){case"tablet":r=r?.replace(regexReplaceEndDot,"_1024x.");break;case"mobile":r=r?.replace(regexReplaceEndDot,"_768x.")}return r},getImageMetafieldDefinitionKey=e=>`{{${e} | file_url}}`,regexReplaceEndDot=/\.(?=[^.]*$)/,replaceBackupFileKeyFileContent=e=>e.replace(/\.jpeg|\.jfif/g,".jpg"),getNewBackupFileKey=(e,t)=>{let i=t?.match(/\/files\/([^\/]+\.(jpg|jpeg|gif|png|webp|svg))/)?.[1];return i&&i!=e?i:e};function resizeImage(e,t){let i=e.match(/\.webp/g)?.length,r=replaceRegexLastMatch({str:e,reg:/_(pico|icon|thumb|small|compact|medium|large|grande|original|1024x1024|2048x2048|master)+\./g,newString:"."});if(i)return r;let a=replaceRegexLastMatch({str:r,reg:/\.jpg|\.png|\.gif|\.jpeg/g,newString:t,isAdd:!0});return a}let replaceRegexLastMatch=e=>{let t=e.str,i=e.str.match(e.reg)?.length;if(i){let r,a=1;for(;null!==(r=e.reg.exec(e.str));){if(a===i){let i=e.reg.lastIndex,a=i-r[0].length;e.isAdd&&(e.newString="_"+e.newString+r),t=t.slice(0,a)+e.newString+t.slice(i,t.length)}a++}}return t},getItemWidth=(e,t)=>{let i=getCurrentDevice(),r=t?.[i]||"auto";if(!r||"auto"===r||r.includes("%"))return e;let a=Number(r.replace("px",""));return a>e?e:Number(r.replace("px",""))},getImageWidthFollowByQuality=e=>{let{itemWidthParam:t,imageWidthSetting:i,qualityType:r,qualityPercent:a}=e,g=getCurrentDevice(),s=getItemWidth(t,i),o=l(r,g,"finest"),n=l(a,g,100);switch(o){case"finest":default:return"auto";case"high":return Math.round(1.5*s)||1;case"medium":return Math.round(s)||1;case"custom":return Math.round(s*(Number(n)/100))||1}},getWidthOfFeatureImageSetting=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return a.forEach(i=>{let r=l(e,i)?.width||"100%";t[i]=r}),t},getWidthOfImageListSetting=e=>{let t={desktop:"100%",tablet:"100%",mobile:"100%"};return a.forEach(i=>{let r=l(e,i)?.width||"100%";t[i]=r}),t},getWidthOfListImageInDom=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-gallery-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},getWidthOfFeatureImageInDom=e=>{let t=document.querySelectorAll(`.gem-slider-item-${e}.gp-ft-image-item`),i=0;return t.forEach(e=>{e.offsetWidth>i&&(i=e.offsetWidth)}),i},handleSetSrcForProductImageList=e=>{let{shapeByLayout:t,qualityType:i,qualityPercent:r,builderPropUID:a}=e,l=document.querySelectorAll(`.gem-slider-item-${a}.gp-gallery-image-item`),g=getWidthOfImageListSetting(t),s=getWidthOfListImageInDom(a);l.forEach(e=>{handleSetSrcForGalleryImage({item:e,settingWidth:g,width:s,qualityType:i,qualityPercent:r})})},handleSetSrcForFeatureProductImage=e=>{let{ftShape:t,qualityType:i,qualityPercent:r,builderPropUID:a}=e,l=document.querySelectorAll(`.gem-slider-item-${a}.gp-ft-image-item`),g=getWidthOfFeatureImageSetting(t),s=getWidthOfFeatureImageInDom(a);l.forEach(e=>{handleSetSrcForGalleryImage({item:e,settingWidth:g,width:s,qualityType:i,qualityPercent:r})})},handleSetSrcForGalleryImage=e=>{let{item:t,settingWidth:i,width:r,qualityType:a,qualityPercent:l}=e,g=getCurrentDevice(),s=t.querySelector("img");if(s){let e=getImageWidthFollowByQuality({itemWidthParam:r,imageWidthSetting:i,qualityType:a,qualityPercent:l}),t=s.getAttribute("base-src");if(!t)return;let o=getImageSrcByQuality(e,t),n=getImageSrcSet(t,o,g);s.setAttribute("srcset",n)}},getImageSrcByQuality=(e,t)=>"auto"===e?t:resizeImage(t,`${e}x`),getImageSrcSet=(e,t,i)=>`${"mobile"===i&&e!==t?t:resizeImage(e,"768x")} 767w, ${"tablet"===i&&e!==t?t:resizeImage(e,"1024x")} 1023w, ${"desktop"===i&&e!==t?t:resizeImage(e,"1920x")} 1440w`,getCurrentDevice=()=>window.innerWidth<768?"mobile":window.innerWidth>=768&&window.innerWidth<1025?"tablet":"desktop";export{FALLBACK_IMAGE,IMAGE_PLACEHOLDER,NEXT_IMAGE_CONFIG,composeAspectRatio,createBlurDataURL,getAdaptiveImageData,getAspectRatio,getAspectRatioNextImage,getCurrentDevice,getImageSrc,getImageWidthFollowByQuality,getNewBackupFileKey,getResponsiveObjectFit,getSettingTranslatedImageAndSeo,getSrcSet,handleSetSrcForFeatureProductImage,handleSetSrcForProductImageList,isCannotResizeImage,overwriteDefaultRadius,regexReplaceEndDot,replaceBackupFileKeyFileContent,resizeImage,safeStringify,shimmer,toBase64};
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import{template as s}from"@gem-sdk/core";import{createStyle as e,createClass as t,createAttr as i,If as m}from"@gem-sdk/system";import{getLinkData as
|
|
1
|
+
import{template as s}from"@gem-sdk/core";import{createStyle as e,createClass as t,createAttr as i,If as m}from"@gem-sdk/system";import{getLinkData as o}from"../../helpers.js";import r from"./AdaptiveImage.liquid.js";import l from"./NextImage.liquid.js";import{getWrapperStyles as a,getImageStyles as p,getContainerStyles as d}from"../common/styles.js";import{getWrapperClasses as u,getImageClasses as c,getContainerClasses as f}from"../common/classes.js";import{getContainerAttrs as n,getAdaptiveImageAttrs as g,getNextImageAttrs as $,getLinkWrapperAttrs as j,getImageLiquidAttrs as y}from"../common/attrs.js";import{getSettingTranslatedImageAndSeo as q}from"../common/helpers.js";let Image=({style:v,styles:I,setting:h,advanced:L,className:N,pageContext:k,builderAttrs:x,builderProps:W})=>{let A=q({setting:h,uid:W?.uid,pageContext:k}),{imageLink:C,isAdaptive:b,enableImageLink:w}=A??{},{enableLazyLoadImage:z}=k??{},{Wrapper:B,urlData:D}=o({defaultWrap:"div",setting:C,enableImageLink:w,isLiquid:!0}),E=e(a(I)),F=e(p(I,W)),G=e(d(v,I)),H=t(u()),J=t(c(N,I)),K=t(f(W?.uid,L?.cssClass,I?.shape)),M=i(n(x,W?.uid)),O=j({urlData:D,imageLink:C,title:A?.title,isLiquid:!0}),P=g({styles:I,setting:A,isLiquid:!0}),Q=$({styles:I,setting:A}),R=y({pageContext:k,enableLazyLoadImage:z}),S=()=>m(b,r({...R,...P,style:F,className:J}),l({...R,...Q,style:F,className:J})),T=()=>S();return s`
|
|
2
2
|
<div
|
|
3
3
|
role="presentation"
|
|
4
|
-
${{...
|
|
5
|
-
style="${
|
|
6
|
-
class="${
|
|
4
|
+
${{...M}}
|
|
5
|
+
style="${G}"
|
|
6
|
+
class="${K}"
|
|
7
7
|
>
|
|
8
|
-
<${
|
|
9
|
-
${
|
|
10
|
-
style="${
|
|
11
|
-
class="${
|
|
8
|
+
<${B}
|
|
9
|
+
${O}
|
|
10
|
+
style="${E}"
|
|
11
|
+
class="${H}"
|
|
12
12
|
>
|
|
13
|
-
${
|
|
14
|
-
</${
|
|
13
|
+
${T()}
|
|
14
|
+
</${B}>
|
|
15
15
|
</div>
|
|
16
16
|
`};export{Image as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let ImageSettings=[{id:"setting",controls:[{id:"imageStyle",label:"Style",type:"layout-selector",iconViewBox:"0 0 72 72",enableItemBackground:!0,popoverLabel:{en:"Style"},itemPerRow:2,itemSpacing:"large",options:[{label:"Rectangle",value:"rectangle",iconName:"gp-image-rectangle-style"},{label:"Circle",value:"circle",iconName:"gp-image-circle-style"}],default:"rectangle"},{id:"image-info",label:"Image",type:"group",controls:[{id:"image",type:"image-select",label:"Pick Image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_demo.jpg",width:2237,height:1678}},{id:"srcSet",type:"image-select",hide:!0,dynamicSource:!0,devices:{desktop:{default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_demo.jpg",width:2237,height:1678}}}},{id:"isAdaptive",type:"toggle",label:"Adaptive",default:!0,hideOnMode:{mobileOnly:!0}}]},{id:"enableImageLink",type:"toggle",default:!1,compoDefaultValue:!1},{id:"imageLink",type:"pick-link",label:"Pick Link",default:{type:"open-page",link:"",target:"_self"},hiddenOptions:{"stay-on-page":!0}},{id:"seo",type:"group",label:"SEO",controls:[{id:"alt",label:"Alt Text",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: Classic white crewneck t-shirt with minimalist design",default:void 0},{id:"title",label:"Image title",info:"Show title when hover to image",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: White t-shirt",default:void 0}]},{id:"optimize",type:"group",label:"Optimize",hiddenWithGemPages:!0,controls:[{id:"qualityType",type:"select",label:"Quality",devices:{desktop:{default:"high"}},options:[{title:"Finest",value:"finest"},{title:"High",value:"high"},{title:"Medium",value:"medium"},{title:"Custom",value:"custom",tooltip:"You can choose it for advanced page loading optimization."}]},{id:"qualityPercent",type:"input:slider",label:"",units:["%"],showDefaultUnit:!0,min:100,max:400,step:50,useOnlyUnitInit:!0,isNumber:!0,devices:{desktop:{default:100}}},{id:"priority",type:"toggle",label:"Preload",default:!1}]},{id:"isNotLazyload",type:"toggle",default:!1}]},{id:"style",controls:[{id:"shape",type:"size-setting",label:"",devices:{desktop:{default:{shape:"original",shapeLinked:!0,width:"1200px"}}},settingConfig:{width:{displayOptions:["full"]},height:{displayOptions:["full"],units:["px","%"]}},hiddenSettings:["padding","gap"]},{id:"objectFit",type:"option:illustration",enableTooltip:!0,label:"Image scale",options:[{label:"Fill image",value:"cover",type:"image",svgName:"gp-image-cover"},{label:"Fit image",value:"contain",type:"image",svgName:"gp-image-contain"}],devices:{desktop:{default:"cover"}}},{id:"align",label:"Align",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"center"}}},{id:"behavior-state",type:"behavior-state",label:"Behavior State",controls:[{id:"borderImg",type:"border",label:"Border",default:{normal:{borderType:"none",border:"none",width:"1px 1px 1px 1px",borderWidth:"1px",color:"#000000",isCustom:!1}},state:{hover:!0,normal:!0}},{id:"opacity",label:"Overlay Opacity",type:"input:slider",min:0,max:100,step:1,units:["%"],useOnlyUnitInit:!0,default:{normal:0},state:{normal:!0,hover:!0}},{id:"opacityColor",label:"Overlay Color",type:"colorpicker",default:{normal:"#242424"},state:{normal:!0,hover:!0}},{id:"hasBoxShadowImg",type:"toggle",label:"Enable Image Shadow",default:{normal:!1},state:{normal:!0,hover:!0}},{id:"boxShadowImg",type:"boxShadow",label:"Image Shadow",hideOnState:{normal:!0,hover:!0},default:{normal:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45}},state:{normal:!0,hover:!0}}]},{id:"wrapperBorder",type:"border",label:"Border",default:{borderType:"none",border:"none",width:"1px 1px 1px 1px",position:"all",borderWidth:"1px",color:"#000000",isCustom:!0}},{id:"borderRadius",type:"radius-preset",label:"Corner",default:{radiusType:"none"},compoDefaultValue:{bblr:"20px",btrr:"20px",bbrr:"20px",btlr:"20px",radiusType:"rounded"}},{id:"hasActiveShadow",type:"toggle",label:"Enable Button Shadow",default:!1},{id:"shadow",type:"shadow-v2",label:"Button Shadow",default:{type:"none",distance:"10px",blur:"12px",spread:"10px",color:"rgba(18, 18, 18, 0.77)",angle:40}}]}];export{ImageSettings};
|
|
1
|
+
let ImageSettings=[{id:"setting",controls:[{id:"translate",type:"input",default:[{id:"srcSet",fields:["src"]},{id:"alt"},{id:"title"}]},{id:"imageStyle",label:"Style",type:"layout-selector",iconViewBox:"0 0 72 72",enableItemBackground:!0,popoverLabel:{en:"Style"},itemPerRow:2,itemSpacing:"large",options:[{label:"Rectangle",value:"rectangle",iconName:"gp-image-rectangle-style"},{label:"Circle",value:"circle",iconName:"gp-image-circle-style"}],default:"rectangle"},{id:"image-info",label:"Image",type:"group",controls:[{id:"image",type:"image-select",label:"Pick Image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_demo.jpg",width:2237,height:1678}},{id:"srcSet",type:"image-select",hide:!0,dynamicSource:!0,devices:{desktop:{default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_demo.jpg",width:2237,height:1678}}}},{id:"isAdaptive",type:"toggle",label:"Adaptive",default:!0,hideOnMode:{mobileOnly:!0}}]},{id:"enableImageLink",type:"toggle",default:!1,compoDefaultValue:!1},{id:"imageLink",type:"pick-link",label:"Pick Link",default:{type:"open-page",link:"",target:"_self"},hiddenOptions:{"stay-on-page":!0}},{id:"seo",type:"group",label:"SEO",controls:[{id:"alt",label:"Alt Text",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: Classic white crewneck t-shirt with minimalist design",default:void 0},{id:"title",label:"Image title",info:"Show title when hover to image",type:"textarea",minHeight:56,autoHeight:!0,placeholder:"E.g: White t-shirt",default:void 0}]},{id:"optimize",type:"group",label:"Optimize",hiddenWithGemPages:!0,controls:[{id:"qualityType",type:"select",label:"Quality",devices:{desktop:{default:"high"}},options:[{title:"Finest",value:"finest"},{title:"High",value:"high"},{title:"Medium",value:"medium"},{title:"Custom",value:"custom",tooltip:"You can choose it for advanced page loading optimization."}]},{id:"qualityPercent",type:"input:slider",label:"",units:["%"],showDefaultUnit:!0,min:100,max:400,step:50,useOnlyUnitInit:!0,isNumber:!0,devices:{desktop:{default:100}}},{id:"priority",type:"toggle",label:"Preload",default:!1}]},{id:"isNotLazyload",type:"toggle",default:!1}]},{id:"style",controls:[{id:"shape",type:"size-setting",label:"",devices:{desktop:{default:{shape:"original",shapeLinked:!0,width:"1200px"}}},settingConfig:{width:{displayOptions:["full"]},height:{displayOptions:["full"],units:["px","%"]}},hiddenSettings:["padding","gap"]},{id:"objectFit",type:"option:illustration",enableTooltip:!0,label:"Image scale",options:[{label:"Fill image",value:"cover",type:"image",svgName:"gp-image-cover"},{label:"Fit image",value:"contain",type:"image",svgName:"gp-image-contain"}],devices:{desktop:{default:"cover"}}},{id:"align",label:"Align",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"center"}}},{id:"behavior-state",type:"behavior-state",label:"Behavior State",controls:[{id:"borderImg",type:"border",label:"Border",default:{normal:{borderType:"none",border:"none",width:"1px 1px 1px 1px",borderWidth:"1px",color:"#000000",isCustom:!1}},state:{hover:!0,normal:!0}},{id:"opacity",label:"Overlay Opacity",type:"input:slider",min:0,max:100,step:1,units:["%"],useOnlyUnitInit:!0,default:{normal:0},state:{normal:!0,hover:!0}},{id:"opacityColor",label:"Overlay Color",type:"colorpicker",default:{normal:"#242424"},state:{normal:!0,hover:!0}},{id:"hasBoxShadowImg",type:"toggle",label:"Enable Image Shadow",default:{normal:!1},state:{normal:!0,hover:!0}},{id:"boxShadowImg",type:"boxShadow",label:"Image Shadow",hideOnState:{normal:!0,hover:!0},default:{normal:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45}},state:{normal:!0,hover:!0}}]},{id:"wrapperBorder",type:"border",label:"Border",default:{borderType:"none",border:"none",width:"1px 1px 1px 1px",position:"all",borderWidth:"1px",color:"#000000",isCustom:!0}},{id:"borderRadius",type:"radius-preset",label:"Corner",default:{radiusType:"none"},compoDefaultValue:{bblr:"20px",btrr:"20px",bbrr:"20px",btlr:"20px",radiusType:"rounded"}},{id:"hasActiveShadow",type:"toggle",label:"Enable Button Shadow",default:!1},{id:"shadow",type:"shadow-v2",label:"Button Shadow",default:{type:"none",distance:"10px",blur:"12px",spread:"10px",color:"rgba(18, 18, 18, 0.77)",angle:40}}]}];export{ImageSettings};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{getResponsiveValueByScreen as
|
|
1
|
+
import{cloneDeep as t,getResponsiveValueByScreen as e}from"@gem-sdk/core";import{getImageSrc as o,composeAspectRatio as a}from"../../image/common/helpers.js";import{getDynamicSourceLocales as i}from"../../helpers.js";let getAspectRatioData=({styles:t,leftImage:e,rightImage:o})=>{let a=(e?.width??0)/(e?.height??1),i=(o?.width??0)/(o?.height??1),l=a<=i?`${e?.width??0}/${e?.height??1}`:`${o?.width??0}/${o?.height??1}`,r=a<=i?e:o,s=composeResponsiveAspectRatio({aspect:t?.aspectRatio,auto:r,custom:t?.customAspectRadio,defaultRatio:l});return{defaultRatio:l,responsiveAspectRatio:s}},composeResponsiveAspectRatio=({aspect:t,auto:e,custom:o,defaultRatio:i})=>({desktop:a({device:"desktop",aspect:t,auto:e,custom:o})??i,tablet:a({device:"tablet",aspect:t,auto:e,custom:o}),mobile:a({device:"mobile",aspect:t,auto:e,custom:o})}),composeLabelPosition=({input:t,isHorizontal:o})=>{let{device:a,positionHoz:i,positionVer:l}=t,r=o?e(i,a,"hoz-center"):e(l,a,"ver-center"),s={topLeft:"50%",bottomRight:"auto"};return({"hoz-center":{topLeft:"50%",bottomRight:"auto"},top:{topLeft:"8px",bottomRight:"auto"},bottom:{topLeft:"auto",bottomRight:"8px"},"ver-center":{topLeft:"50%",bottomRight:"auto"},left:{topLeft:"8px",bottomRight:"auto"},right:{topLeft:"auto",bottomRight:"8px"}})[r]??s},getLabelPosition=({position:t,labelPositionHoz:e,labelPositionVer:o,isHorizontal:a})=>({desktop:composeLabelPosition({input:{device:"desktop",positionHoz:e,positionVer:o},isHorizontal:a})?.[t??"topLeft"],tablet:composeLabelPosition({input:{device:"tablet",positionHoz:e,positionVer:o},isHorizontal:a})?.[t??"topLeft"],mobile:composeLabelPosition({input:{device:"mobile",positionHoz:e,positionVer:o},isHorizontal:a})?.[t??"topLeft"]}),generateTranslateByDevices=({isHorizontal:t,labelPositionHoz:e,labelPositionVer:o})=>{let a=t?e:o,i={desktop:a?.desktop??"hoz-center",tablet:a?.tablet??a?.desktop??"hoz-center",mobile:a?.mobile??a?.tablet??a?.desktop??"hoz-center"},l={desktop:"translateX(0) translateY(0)",tablet:"translateX(0) translateY(0)",mobile:"translateX(0) translateY(0)"};for(let e in i){let o=i?.[e];o.includes("center")?l[e]=t?"translateX(0) translateY(-50%)":"translateX(-50%) translateY(0)":l[e]="translateX(0) translateY(0)"}return l},getSliderPositionPercentage=t=>{let e="string"==typeof t?parseInt(t??0):t;return(e??50)/100},FLEX_ALIGN={left:"start",center:"center",right:"end",justify:"start"},getData=t=>{let{handle:e=null,hover:a=!1,handleSize:i=40,leftImageAlt:l="",leftImageTitle:r="",leftImageCss:s={},leftImageLabel:n=null,rightImageAlt:p="",rightImageTitle:g="",rightImageCss:c={},rightImageLabel:m=null,sliderLineWidth:u=2,sliderLineColor:d="#ffffff",sliderPositionPercentage:f=.5,vertical:b=!1,componentUid:h="",styles:L={},leftImage:S,rightImage:R,enableLabel:y=!1,qualityType:v,qualityPercent:C}=t,I=!b,P=y&&!!n,$=y&&!!m,A=(S?.width??0)<(R?.width??0)?{...S}:{...R},k=t=>{let{isLiquid:e}=t??{};return e?o(S):S?.src??""},x=t=>{let{isLiquid:e}=t??{};return e?o(R):R?.src??""},{responsiveAspectRatio:z,defaultRatio:X}=getAspectRatioData({leftImage:S,rightImage:R,styles:L});return{styles:L,handle:e,hover:a,handleSize:i,leftImageAlt:l,leftImageTitle:r,leftImageCss:s,leftImageLabel:n,rightImageAlt:p,rightImageTitle:g,rightImageCss:c,rightImageLabel:m,sliderLineWidth:u,sliderLineColor:d,sliderPositionPercentage:f,vertical:b,componentUid:h,tempImage:A,aspectRatio:z,defaultRatio:X,isHorizontal:I,hasLeftLabel:P,hasRightLabel:$,qualityType:v,qualityPercent:C,getLeftImageSrc:k,getRightImageSrc:x}},getImageClipStyle=t=>{let{isHorizontal:e,containerWidth:o,containerHeight:a,sliderPosition:i,type:l}=t,r=e?o*i:a*i;return"left"===l?{clip:e?`rect(auto, ${r}px, auto, auto)`:`rect(auto, auto, ${r}px, auto)`}:{clip:e?`rect(auto, auto, auto, ${r}px)`:`rect(${r}px, auto, auto, auto)`}},getSliderPositionStyle=t=>{let{isHorizontal:e,containerWidth:o,containerHeight:a,sliderPosition:i,handleSize:l}=t,r=e?o*i:a*i,s=l/2;return{[e?"top":"left"]:0,[e?"left":"top"]:`${r-s}px`}},getLabelContainerStyles=t=>({...getImageClipStyle(t)}),getReactStyles=t=>({sliderPosition:getSliderPositionStyle(t),leftImageClip:getImageClipStyle({...t,type:"left"}),rightImageClip:getImageClipStyle({...t,type:"right"}),leftLabelContainer:getLabelContainerStyles({...t,type:"left"}),rightLabelContainer:getLabelContainerStyles({...t,type:"right"})}),getSettingTranslatedImageComparisonAndSeo=({setting:e,uid:o,pageContext:a})=>{let l=e?.translate?"true":void 0;if(!e||!l)return{};let r=t(e);for(let t of["Left","Right"]){let e=`image${t}`,s=r[e];if(s?.src){let t=i({val:s.src,uid:o,settingId:`${e}_src`,translate:l,pageContext:a});r[e].src=String(t)}let n=`alt${t}`,p=i({val:r[n],uid:o,settingId:n,translate:l,pageContext:a});r[n]=String(p);let g=`title${t}`,c=i({val:r[g],uid:o,settingId:g,translate:l,pageContext:a});r[g]=String(c)}return r};export{FLEX_ALIGN,composeLabelPosition,composeResponsiveAspectRatio,generateTranslateByDevices,getAspectRatioData,getData,getImageClipStyle,getLabelContainerStyles,getLabelPosition,getReactStyles,getSettingTranslatedImageComparisonAndSeo,getSliderPositionPercentage,getSliderPositionStyle};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{template as e}from"@gem-sdk/core";import{createClass as t,createStyle as
|
|
2
|
-
<div class="${
|
|
3
|
-
${
|
|
1
|
+
import{template as e}from"@gem-sdk/core";import{createClass as t,createStyle as i}from"@gem-sdk/system";import{getImageComparisonWrapperClasses as r,getImageComparisonWrapperStyles as a}from"../common/classes.js";import{getSettingTranslatedImageComparisonAndSeo as m,getSliderPositionPercentage as l}from"../common/helpers.js";import o from"./CompareImage.liquid.js";let ImageComparison=({setting:s,styles:g,builderProps:d,advanced:n,pageContext:p,...f})=>{let I=m({setting:s,uid:d?.uid,pageContext:p}),{imageLeft:c,altLeft:u,titleLeft:h,imageRight:b,altRight:v,titleRight:y,direction:C,defaultPercentage:L,leftImageLabel:j,rightImageLabel:q,sliderLineWidth:A,hoverToSlide:P,enableLabel:T,preload:$,translate:k,qualityType:x,qualityPercent:D,enableSEOLeft:B,enableSEORight:U}=I??{},W=t(r()),w=i(a());return e`
|
|
2
|
+
<div class="${W}" style="${w}">
|
|
3
|
+
${o({...f,styles:g,preload:$,advanced:n,leftImage:c,leftImageAlt:B?u:"",leftImageTitle:B?h:"",rightImage:b,rightImageAlt:U?v:"",rightImageTitle:U?y:"",leftImageLabel:j??"Before",rightImageLabel:q??"After",sliderLineWidth:A,sliderPositionPercentage:l(L),vertical:"vertical"===C,hover:P,enableLabel:T,qualityType:x,qualityPercent:D,componentUid:d?.uid??"",builderData:d?.builderData,translate:k})}
|
|
4
4
|
</div>
|
|
5
5
|
`};export{ImageComparison as default};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import{template as
|
|
1
|
+
import{template as t}from"@gem-sdk/core";import{getDynamicSourceLocales as e}from"../../helpers.js";import{getLabelCustomCss as s}from"../common/styles.js";let Label=({uid:l,label:a,styles:i,positionId:r,pageContext:o,translateLabel:m,childrenStyle:d,childrenClass:p,containerStyle:$,containerClass:c})=>{let n=s(i,l??""),y=e({uid:l,translate:"true",val:a,pageContext:o,settingId:m,isCapitalize:i?.typo?.attrs?.transform==="capitalize"});return t`
|
|
2
2
|
<div
|
|
3
|
-
id="image-comparison-${
|
|
4
|
-
style="${
|
|
5
|
-
class="${
|
|
3
|
+
id="image-comparison-${r}-label-${l}"
|
|
4
|
+
style="${$}"
|
|
5
|
+
class="${c}"
|
|
6
6
|
>
|
|
7
|
-
<style>${
|
|
8
|
-
<div class="${
|
|
9
|
-
${
|
|
7
|
+
<style>${n}</style>
|
|
8
|
+
<div class="${p}" style="${d}">
|
|
9
|
+
${y}
|
|
10
10
|
</div>
|
|
11
11
|
</div>
|
|
12
12
|
`};export{Label as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import"react/jsx-runtime";import"@gem-sdk/system";import"@gem-sdk/core";import"react";import"./components/Label.js";import m from"./settings/ImageComparison.js";let imageComparisonSetting={ImageComparison:m};export{imageComparisonSetting};
|
|
1
|
+
import"react/jsx-runtime";import"@gem-sdk/system";import"@gem-sdk/core";import"react";import"next/link";import"./components/Label.js";import m from"./settings/ImageComparison.js";let imageComparisonSetting={ImageComparison:m};export{imageComparisonSetting};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let ImageComparisonSettings=[{id:"setting",controls:[{id:"imageTab",label:"",type:"option:value",options:[{label:"First",value:"left"},{label:"Second",value:"right"}],default:"left"},{id:"imageLeft",label:"Left image",type:"group",controls:[{id:"imageLeft",type:"image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_compare_before.png",width:900,height:600},hiddenSetting:{seo:!0,optimizeLCP:!0}}]},{id:"imageRight",label:"Right Image",type:"group",controls:[{id:"imageRight",type:"image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_compare_after.png",width:900,height:600},hiddenSetting:{seo:!0,optimizeLCP:!0}}]},{id:"preload",type:"toggle",label:"Preload",default:!1},{id:"qualityType",type:"select",label:"Quality",devices:{desktop:{default:"high"}},options:[{title:"Finest",value:"finest"},{title:"High",value:"high"},{title:"Medium",value:"medium"},{title:"Custom",value:"custom",tooltip:"You can choose it for advanced page loading optimization."}]},{id:"qualityPercent",type:"input:slider",label:"",units:["%"],min:100,max:400,step:50,useOnlyUnitInit:!0,showDefaultUnit:!0,isNumber:!0,devices:{desktop:{default:100}}},{id:"direction",label:"Layout",type:"layout-selector",iconViewBox:"0 0 72 72",enableItemBackground:!0,itemPerRow:2,itemSpacing:"large",options:[{label:"Horizontal",value:"horizontal",iconName:"gp-image-comparison-horizontal"},{label:"Vertical",value:"vertical",iconName:"gp-image-comparison-vertical"}],default:"horizontal"},{id:"slider-settings",type:"group",label:"Slider",controls:[{id:"hoverToSlide",type:"select",options:[{label:"Drag to move",value:!1},{label:"Hover to move",value:!0}],label:"Behavior",default:!1},{id:"defaultPercentage",label:"Default ratio",type:"input:slider",useOnlyUnitInit:!0,showDefaultUnit:!0,isNumber:!0,units:["%"],hide:!0,min:1,max:100,default:50}]},{id:"enableLabel",type:"toggle",default:!1},{id:"leftImageLabel",label:"First Description",type:"input",default:"Before"},{id:"
|
|
1
|
+
let ImageComparisonSettings=[{id:"setting",controls:[{id:"imageTab",label:"",type:"option:value",options:[{label:"First",value:"left"},{label:"Second",value:"right"}],default:"left"},{id:"imageLeft",label:"Left image",type:"group",controls:[{id:"imageLeft",type:"image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_compare_before.png",width:900,height:600},hiddenSetting:{seo:!0,optimizeLCP:!0}}]},{id:"imageRight",label:"Right Image",type:"group",controls:[{id:"imageRight",type:"image",default:{src:"https://cdn.shopify.com/s/files/1/2005/9307/files/image_compare_after.png",width:900,height:600},hiddenSetting:{seo:!0,optimizeLCP:!0}}]},{id:"preload",type:"toggle",label:"Preload",default:!1},{id:"qualityType",type:"select",label:"Quality",devices:{desktop:{default:"high"}},options:[{title:"Finest",value:"finest"},{title:"High",value:"high"},{title:"Medium",value:"medium"},{title:"Custom",value:"custom",tooltip:"You can choose it for advanced page loading optimization."}]},{id:"qualityPercent",type:"input:slider",label:"",units:["%"],min:100,max:400,step:50,useOnlyUnitInit:!0,showDefaultUnit:!0,isNumber:!0,devices:{desktop:{default:100}}},{id:"direction",label:"Layout",type:"layout-selector",iconViewBox:"0 0 72 72",enableItemBackground:!0,itemPerRow:2,itemSpacing:"large",options:[{label:"Horizontal",value:"horizontal",iconName:"gp-image-comparison-horizontal"},{label:"Vertical",value:"vertical",iconName:"gp-image-comparison-vertical"}],default:"horizontal"},{id:"slider-settings",type:"group",label:"Slider",controls:[{id:"hoverToSlide",type:"select",options:[{label:"Drag to move",value:!1},{label:"Hover to move",value:!0}],label:"Behavior",default:!1},{id:"defaultPercentage",label:"Default ratio",type:"input:slider",useOnlyUnitInit:!0,showDefaultUnit:!0,isNumber:!0,units:["%"],hide:!0,min:1,max:100,default:50}]},{id:"enableLabel",type:"toggle",default:!1},{id:"leftImageLabel",label:"First Description",type:"input",default:"Before"},{id:"rightImageLabel",label:"Second Description",type:"input",default:"After"},{id:"enableSEOLeft",type:"toggle",default:!1},{id:"enableSEORight",type:"toggle",default:!1},{id:"seo",type:"group",label:"SEO",controls:[{id:"seoTab",label:"",type:"option:value",options:[{label:"First",value:"left"},{label:"Second",value:"right"}],default:"left"},{id:"altLeft",label:"First image alt text",type:"textarea",minHeight:76,autoHeight:!0,placeholder:"E.g: image of an iphone",default:"Describes the appearance of the image"},{id:"altRight",label:"Second image alt text",type:"textarea",minHeight:76,autoHeight:!0,placeholder:"E.g: image of an iphone",default:"Describes the appearance of the image"},{id:"titleLeft",label:"First image title",info:"Show title when hover to first image",type:"input",placeholder:"E.g: iphone compare",default:"Title"},{id:"titleRight",label:"Second image title",info:"Show title when hover to second image",type:"input",placeholder:"E.g: iphone compare",default:"Title"}]},{id:"translate",type:"input",default:[{id:"altLeft"},{id:"altRight"},{id:"titleLeft"},{id:"titleRight"},{id:"rightImageLabel"},{id:"leftImageLabel"},{id:"imageLeft",fields:["src"]},{id:"imageRight",fields:["src"]}]}]},{id:"style",controls:[{id:"label-settings",type:"group",label:"Label",controls:[{id:"labelPadding",type:"padding-v2",devices:{desktop:{default:{top:"4px",left:"4px",bottom:"4px",right:"4px",linked:!0}}},compoDefaultValue:{desktop:{default:{top:"4px",left:"4px",bottom:"4px",right:"4px",linked:!0}}}},{id:"labelBackgroundColor",type:"color-picker-v2",devices:{desktop:{default:"rgba(0, 0, 0, 0.60)"}}},{id:"labelPositionHoz",label:"Position",type:"option:value",devices:{desktop:{default:"hoz-center"}},options:[{label:"Top",value:"top",iconName:"gp-justify-content-top"},{label:"Center",value:"hoz-center",iconName:"gp-justify-content-center"},{label:"Bottom",value:"bottom",iconName:"gp-justify-content-bottom"}]},{id:"labelPositionVer",label:"Position",type:"option:value",devices:{desktop:{default:"ver-center"}},options:[{label:"Left",value:"left",iconName:"gp-justify-content-left"},{label:"Center",value:"ver-center",iconName:"gp-justify-content-middle"},{label:"Right",value:"right",iconName:"gp-justify-content-right"}]},{id:"labelTextColor",type:"colorpicker",label:"Text Color",default:"#FFFFFF"},{id:"labelBorder",type:"border-v2",devices:{desktop:{default:{borderType:"none",border:"none",borderWidth:"1px",width:"1px 1px 1px 1px",color:"line-1",isCustom:!0}}},compoDefaultValue:{desktop:{default:{border:"solid",color:"line-1",width:"1px",borderWidth:"1px"}}}},{id:"labelRounded",type:"corner-v2",devices:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}},compoDefaultValue:{desktop:{default:{btrr:"8px",bblr:"8px",bbrr:"8px",btlr:"8px",radiusType:"rounded"}}}},{id:"labelShadow",type:"shadow-v2",devices:{desktop:{}},compoDefaultValue:{desktop:{default:{type:"shadow-1",distance:"4px",blur:"4px",spread:"0px",color:"rgba(18, 18, 18, 0.2)",angle:45,enable:!0}}}}]},{id:"size-settings",type:"group",label:"Size",controls:[{id:"aspectRatio",type:"select",label:"Aspect Ratio",options:[{label:"Original",value:"auto"},{label:"1:1",value:"1"},{label:"3:2",value:"3/2"},{label:"4:3",value:"4/3"},{label:"16:9",value:"16/9"},{label:"21:9",value:"21/9"},{label:"2:3",value:"2/3"},{label:"3:4",value:"3/4"},{label:"9:16",value:"9/16"},{label:"Custom",value:"custom"}],devices:{desktop:{default:"16/9"}}},{id:"customAspectRadio",type:"ratio",min:1,devices:{desktop:{default:{width:"1",height:"1"}}},hide:!0},{id:"imageScale",type:"option:illustration",enableTooltip:!0,label:"Image scale",options:[{label:"Fill image",value:"cover",type:"image",svgName:"gp-image-cover"},{label:"Fit image",value:"contain",type:"image",svgName:"gp-image-contain"}],devices:{desktop:{default:"cover"}}},{id:"fullWidth",label:"Full Width",type:"toggle",devices:{desktop:{default:!0}}},{id:"width",type:"input:unit",emptyOnClear:!0,placeholder:"Auto",min:0,units:["px","%"],hide:!0,devices:{desktop:{default:"100%"}}}]},{id:"typo",type:"typography-combo",default:{type:"paragraph-2"},ignoreReRender:!0,compoDefaultValue:{attrs:{color:"#FFFFFF"}},hiddenSetting:{textAlign:!0}},{id:"transform",label:"Text Transform",type:"select",options:[{value:"default",label:"None"},{value:"capitalize",label:"Capitalize"},{value:"uppercase",label:"Uppercase"},{value:"lowercase",label:"Lowercase"}],default:"default"},{id:"align",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"align",tooltip:"Align left",iconName:"gp-align-left"},{label:"Center",value:"center",type:"align",tooltip:"Align center",iconName:"gp-align-center"},{label:"Right",value:"right",type:"align",tooltip:"Align right",iconName:"gp-align-right"}],devices:{desktop:{default:"center"}}}]}];export{ImageComparisonSettings};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import"react/jsx-runtime";import"@gem-sdk/system";import"@gem-sdk/core";import"./types.js";import t from"./settings/PostPurchaseLine.js";let postPurchaseLineSetting={PostPurchaseLine:t};export{postPurchaseLineSetting};
|
|
1
|
+
import"react/jsx-runtime";import"@gem-sdk/system";import"@gem-sdk/core";import"react";import"next/link";import"./types.js";import t from"./settings/PostPurchaseLine.js";let postPurchaseLineSetting={PostPurchaseLine:t};export{postPurchaseLineSetting};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{getStyleBackgroundByDevice as e,getGradientBgrStyleByDevice as t,makeStyleResponsive as l,makeWidth as r,makeStyle as
|
|
1
|
+
import{getStyleBackgroundByDevice as e,getGradientBgrStyleByDevice as t,makeStyleResponsive as l,makeWidth as r,makeStyle as a,getSingleColorVariable as o,getGlobalColorStateStyle as i,handleConvertBorderStyle as n,handleConvertBorderWidth as b,handleConvertBorderColor as c,filterHoverVariables as s}from"@gem-sdk/core";import{getBackgroundTranslated as m,filterTruthyStyles as p}from"../../helpers.js";import{getStyleWidthByPositionResponsive as d}from"./helpers.js";let getStyleWrapper=({setting:a,style:o,uid:i,pageContext:n,type:b="React"})=>{let{background:c,containWidth:s,align:d,translate:g}=a??{},y="Liquid"===b?m({background:c,uid:i,translate:g,pageContext:n,isTranslateVideo:!1}):c,S={...o,...e(y),...t(y,{desktop:!0,tablet:!0,mobile:!0}),...l("w",r(s)),...l("as",d)};return p(S)},getTabListStyle=e=>{let{panelAlign:t}=e??{},r={...l("jc",t),...l("w",{desktop:"100%",tablet:"100%",mobile:"100%"})};return p(r)},getItemStyle=(e,t)=>{let{labelColor:r,labelBgColor:m,borderTab:g,labelAlign:y,enableActiveEffect:S,panelWidth:v,position:h,panelFullWidth:u,labelWidth:w}=e??{},T={},j=!0===S||void 0===S;return T={...T=t&&j?{...l("jc",y),...a({c:o(r?.active??r?.normal),bgc:o(m?.active??m?.normal),bs:g?.active?.border??g?.normal?.border,bw:g?.active?.width??g?.normal?.width,bc:o(g?.active?.color??g?.normal?.color)})}:{...l("jc",y),...i("c",r),...i("bgc",m),...n(g),...b(g),...c(g)},...l("w",d({position:h,panelFullWidth:u,panelWidth:v,labelWidth:w}))},e?.enableHoverEffect||(T=s(T)),p(T)},getTabParentListStyle=e=>{let{panelAlign:t,panelAlignVertical:r}=e??{},a={...l("jc",t),...l("ai",r)};return p(a)},getContainContentStyle=()=>{let e={};return a({w:"100%"})&&(e={...a({w:"100%"})}),p(e)},getTabItemStyle=(e,t)=>{let l={...e,...a({h:"100%",v:t?"visible":"hidden",pos:t?"relative":"absolute"})};return p(l)};export{getContainContentStyle,getItemStyle,getStyleWrapper,getTabItemStyle,getTabListStyle,getTabParentListStyle};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsxs as e,jsx as s}from"react/jsx-runtime";import{filterToolbarPreview as t}from"@gem-sdk/core";import{Children as i,isValidElement as l}from"react";import{useTab as r}from"../hooks/useTab.js";import{createAttr as
|
|
2
|
+
import{jsxs as e,jsx as s}from"react/jsx-runtime";import{filterToolbarPreview as t}from"@gem-sdk/core";import{Children as i,isValidElement as l}from"react";import{useTab as r}from"../hooks/useTab.js";import{createAttr as a,createStyle as m,createClass as o}from"@gem-sdk/system";import{getAttr as d,getAttrContent as c}from"../common/attrs.js";import p from"../../text/components/Text.js";import{getStyleWrapper as n,getTabParentListStyle as u,getTabListStyle as h,getContainContentStyle as y,getItemStyle as f}from"../common/styles.js";import{getClassesWrapper as x,getContainClasses as N,getStyleTagClasses as g,getTabParentListClasses as v,getTabListClasses as j,getWrapperContentClasses as b,getContainContentClasses as k,getTextClasses as C,getItemClasses as T}from"../common/classes.js";let Tabs=$=>{let{builderAttrs:q,builderProps:A,style:W,setting:F,advanced:I,children:L}=$,{cssClass:S}=I??{},{panelWidth:U,childItem:w,labelAlign:z,labelTypo:B,labelTypoV2:D}=F??{},{currentDevice:E,productID:G,dispatchEventTabActive:H,activeTab:J,setActiveKey:K,refContainer:M}=r(F,A);F&&!F?.labelWidth&&(F.labelWidth={desktop:"200px"});let O=a({...d({uid:A?.uid||""})}),P=m({...n({setting:F,style:W,uid:A?.uid,pageContext:$.pageContext})}),Q=o({...x({builderProps:A,advancedCssClass:S})}),R=o({...N({setting:F})}),V=g({panelWidth:U,builderProps:A}),X=o({...v()}),Y=m({...u(F)}),Z=o({...j({setting:F})}),_=m({...h(F)}),ee=e=>o({...T({setting:F,isNotLiquid:!0,isActive:e,currentDevice:E})}),es=e=>m({...f(F,e)}),et=i.map(L,e=>e?.props?.uid),ei=o({...b()}),el=o({...k()}),er=m({...y()}),ea=o({...C()}),em=a({...c({uid:A?.uid||""})}),eo=()=>w?.map((e,t)=>{let i=J==t;return s("li",{"aria-hidden":!0,className:ee(i),style:es(i),onClick:()=>{K(t),H(t)},children:s(p,{className:ea,styles:{typo:D,typography:B,textAlign:z},setting:{text:e,htmlTag:"div",excludeFlex:!0,options:{useState:!0,uniqueId:G?`${et?.[t]}-${G}`:`${et?.[t]}`,productID:G}}})},et&&et[t])}),ed=()=>i.map(t(L),(e,t)=>l(e)?s(e.type,{...e.props,isActive:t==J,parentUid:A?.uid}):null);return e("div",{ref:M,...q,...O,style:P,className:Q,children:[s("style",{children:V}),e("div",{className:R,children:[s("div",{className:X,style:Y,children:s("ul",{className:Z,style:_,children:eo()})}),s("div",{className:ei,children:s("div",{...em,className:el,style:er,children:ed()})})]}),t(L,!0)]})};export{Tabs as default};
|