@gem-sdk/components 8.0.0-dev.27 → 8.0.0-dev.29
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/post-purchase/product/settings/product-description/configs/settings-v2.js +1 -1
- package/dist/cjs/post-purchase/product/settings/product-description/configs/ui-v2.js +1 -1
- package/dist/cjs/post-purchase/product/settings/product-title/configs/settings-v2.js +1 -1
- package/dist/cjs/post-purchase/product/settings/product-title/configs/ui-v2.js +1 -1
- package/dist/cjs/product/components/product-variants/OptionVariantsNewFormat.liquid.js +1 -1
- package/dist/cjs/product/components/product-variants/common/dropdown/styles.js +1 -1
- package/dist/cjs/product/components/product-variants/components/dropdown-swatches/Dropdown.js +1 -1
- package/dist/cjs/product/components/product-variants/components/dropdown-swatches/Dropdown.liquid.js +3 -3
- package/dist/cjs/product/settings/product-image-v3/configs/ui-v2.js +1 -1
- package/dist/esm/post-purchase/product/settings/product-description/configs/settings-v2.js +1 -1
- package/dist/esm/post-purchase/product/settings/product-description/configs/ui-v2.js +1 -1
- package/dist/esm/post-purchase/product/settings/product-title/configs/settings-v2.js +1 -1
- package/dist/esm/post-purchase/product/settings/product-title/configs/ui-v2.js +1 -1
- package/dist/esm/product/components/product-variants/OptionVariantsNewFormat.liquid.js +1 -1
- package/dist/esm/product/components/product-variants/common/dropdown/styles.js +1 -1
- package/dist/esm/product/components/product-variants/components/dropdown-swatches/Dropdown.js +1 -1
- package/dist/esm/product/components/product-variants/components/dropdown-swatches/Dropdown.liquid.js +5 -5
- package/dist/esm/product/settings/product-image-v3/configs/ui-v2.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"default",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"}]}];exports.settingV2=settingV2;
|
|
1
|
+
"use strict";const settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"default",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"},{id:"direction",label:"Direction",type:"option:value",options:[{label:"LTR",value:"ltr"},{label:"RTL",value:"rtl"}],default:"ltr"}]}];exports.settingV2=settingV2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:""},setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];exports.SettingUIV2=SettingUIV2;
|
|
1
|
+
"use strict";const SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:"Direction"},setting:{id:"direction"},controlChangeTrigger:{settings:[{action:{controlId:"textAlign",newValue:"right",groupType:"style",controlType:"style"},condition:"direction === 'rtl' && textAlign === 'left'",source:["direction","textAlign"]},{action:{controlId:"textAlign",newValue:"left",groupType:"style",controlType:"style"},condition:"direction === 'ltr' && textAlign === 'right'",source:["direction","textAlign"]}],options:{noRecordHistory:!0}}},{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];exports.SettingUIV2=SettingUIV2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"xlarge",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"}]}];exports.settingV2=settingV2;
|
|
1
|
+
"use strict";const settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"xlarge",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"},{id:"direction",label:"Direction",type:"option:value",options:[{label:"LTR",value:"ltr"},{label:"RTL",value:"rtl"}],default:"ltr"}]}];exports.settingV2=settingV2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];exports.SettingUIV2=SettingUIV2;
|
|
1
|
+
"use strict";const SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:"Direction"},setting:{id:"direction"},controlChangeTrigger:{settings:[{action:{controlId:"textAlign",newValue:"right",groupType:"style",controlType:"style"},condition:"direction === 'rtl' && textAlign === 'left'",source:["direction","textAlign"]},{action:{controlId:"textAlign",newValue:"left",groupType:"style",controlType:"style"},condition:"direction === 'ltr' && textAlign === 'right'",source:["direction","textAlign"]}],options:{noRecordHistory:!0}}},{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];exports.SettingUIV2=SettingUIV2;
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
|
|
23
23
|
{% if optionTitle == option.name %}
|
|
24
24
|
{%- assign variantPresetString = "${i}" -%}
|
|
25
|
-
{%- assign optionName = option.name | replace: "'", "
|
|
25
|
+
{%- assign optionName = option.name | replace: "'", "'" | replace: '"', """ -%}
|
|
26
26
|
{%- assign items = variantPresetString | split: '($2)' -%}
|
|
27
27
|
{%- assign type = 'dropdown' -%}
|
|
28
28
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getSelectStyle=({width:e,height:
|
|
1
|
+
"use strict";var core=require("@gem-sdk/core"),helpers=require("../../../../../helpers.js");const getSelectStyle=({width:e,height:o,optionTypo:t,optionTypography:r,optionBgColor:a,optionTextColor:l,optionRounded:c,optionHasShadow:s,optionShadow:i,optionBorder:d,optionTransform:S,isCombine:h,textAlign:n})=>{let p=core.composeTypographyStyle(t,r),y=n?core.makeStyleResponsive("ta",n):{},g=core.makeStyle({bg:core.getSingleColorVariable(a?.active),bs:d?.active?.border,bw:d?.active?.width,bc:d?.active?.color}),b=[h?"active":"normal","hover"].reduce((e,o)=>({...e,...core.getStyleShadow({value:i?.[o],state:o,styleAppliedFor:"box-shadow",isEnableShadow:s?.[o]})}),{});return helpers.filterTruthyObject({...core.makeStyleResponsive("w",core.makeWidth(e)),...core.makeStyle({h:o}),...b,...g,...core.makeStyle({tt:S}),...p,...core.getGlobalColorStateStyle("c",l),...core.getGlobalColorStateStyle("bg",a),...core.handleConvertBorderStyle(d),...core.handleConvertBorderWidth(d),...core.handleConvertBorderColor(d),...core.composeRadius(c),...core.getStyleShadow({value:t?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:t?.custom?.hasShadowText}),...y,appearance:"none","background-image":"url(https://cdn.shopify.com/s/files/1/1827/4239/t/1/assets/ico-select.svg?v=155563818344741998551488860031)","background-repeat":"no-repeat","background-position":"right 16px center"})};exports.getSelectStyle=getSelectStyle;
|
package/dist/cjs/product/components/product-variants/components/dropdown-swatches/Dropdown.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),VariantOption=require("../dropdown-option/VariantOption.js"),DropdownOption=require("../dropdown-option/DropdownOption.js"),classes=require("../../common/dropdown/classes.js"),system=require("@gem-sdk/system"),styles=require("../../common/dropdown/styles.js"),attrs=require("../../common/dropdown/attrs.js"),useDropdownSwatches=require("./hooks/useDropdownSwatches.js");const DropdownVariant=e=>{let{option:t,optionPosition:o,optionNumber:s,variantGroup:n,variants:r,price:i,blankText:a,swatchHeight:d,optionTypography:
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),VariantOption=require("../dropdown-option/VariantOption.js"),DropdownOption=require("../dropdown-option/DropdownOption.js"),classes=require("../../common/dropdown/classes.js"),system=require("@gem-sdk/system"),styles=require("../../common/dropdown/styles.js"),attrs=require("../../common/dropdown/attrs.js"),useDropdownSwatches=require("./hooks/useDropdownSwatches.js");const DropdownVariant=e=>{let{option:t,optionPosition:o,optionNumber:s,variantGroup:n,variants:r,price:i,blankText:a,swatchHeight:d,optionTypography:l,optionTransform:p,initValue:u,hasPreSelected:m,optionTypo:c,combineHeight:w,combineWidth:j,soldOutStyle:h}=e,{optionBgColor:x,optionTextColor:y,optionRounded:S,optionShadow:g,optionHasShadow:D,optionBorder:q}=e,{value:v,preset:O,handleOnChangeSelect:R,checkVariantInStock:b}=useDropdownSwatches.useDropdownSwatches(e),f="disable"===h;n||(x=O?.optionBgColor,y=O?.optionTextColor,q=O?.optionBorder,D=O?.optionHasShadow,g=O?.optionShadow,S=O?.optionRounded);let C=system.createClass(classes.getSelectClass({optionTypo:c,optionTypography:l,optionBgColor:x,optionBorder:q,optionTextColor:y})),V=system.createStyle(styles.getSelectStyle({width:n?j:O?.width,height:n?w:O?.height,optionTypo:c,optionTypography:l,optionBgColor:x,optionTextColor:y,optionRounded:S,optionShadow:g,optionHasShadow:D,optionBorder:q,optionTransform:p,swatchHeight:d,isCombine:n,textAlign:c?.attrs?.textAlign})),k=system.createAttr(attrs.getSelectAttr({optionName:t?.name,value:v??u,type:"React"})),A=()=>r?.map(e=>jsxRuntime.jsx(VariantOption.default,{disabled:!b(e)&&f,value:e?.id,variant:e,includePrice:i},e?.id)),N=()=>t?.values?.map(e=>jsxRuntime.jsx(DropdownOption.default,{value:e,optionName:t.name,optionPosition:o,optionNumber:s,isSoldOutMark:f},e?.id));return jsxRuntime.jsxs("select",{...k,className:C,style:V,onChange:e=>R(e),children:[system.If(!m,jsxRuntime.jsx("option",{value:"blank",children:a??"Please select an option"})," "),system.If(n,A(),N())]})};exports.default=DropdownVariant;
|
package/dist/cjs/product/components/product-variants/components/dropdown-swatches/Dropdown.liquid.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),classes=require("../../common/dropdown/classes.js"),styles=require("../../common/dropdown/styles.js"),attrs=require("../../common/dropdown/attrs.js"),index=require("../dropdown-option/render-liquid/index.js");const DropdownVariant=e=>{let{variantGroup:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),classes=require("../../common/dropdown/classes.js"),styles=require("../../common/dropdown/styles.js"),attrs=require("../../common/dropdown/attrs.js"),index=require("../dropdown-option/render-liquid/index.js");const DropdownVariant=e=>{let{variantGroup:t,blankText:s,swatchAutoWidth:r,swatchHeight:o,optionTypography:n,optionBgColor:i,optionTextColor:d,optionRounded:l,optionShadow:a,optionHasShadow:c,optionBorder:m,optionTransform:p,hasPreSelected:y,optionTypo:u,combineHeight:g,combineWidth:q,soldOutStyle:w,children:x}=e,j="disable"===w,S=system.createClass(classes.getSelectClass({optionTypo:u,optionTypography:n,optionBgColor:i,optionBorder:m,optionTextColor:d})),$=system.createStyle(styles.getSelectStyle({width:t?q:r,height:t?g:o,optionTypo:u,optionTypography:n,optionBgColor:i,optionTextColor:d,optionRounded:l,optionHasShadow:c,optionShadow:a,optionBorder:m,optionTransform:p,isCombine:t,textAlign:u?.attrs?.textAlign})),f=system.createAttr(attrs.getSelectAttr({variantGroup:t,type:"Liquid"})),A=()=>x;return core.template`
|
|
2
2
|
<select
|
|
3
3
|
${f}
|
|
4
4
|
class="${S}"
|
|
5
5
|
style="${$}"
|
|
6
6
|
>
|
|
7
|
-
${system.If(!y,index.renderBlankOption(
|
|
8
|
-
${system.If(
|
|
7
|
+
${system.If(!y,index.renderBlankOption(s))}
|
|
8
|
+
${system.If(t,A(),index.renderDropdownOptions(j,y))}
|
|
9
9
|
</select>`};exports.default=DropdownVariant;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var ImageListNavigation=require("./ui/ImageListNavigation.js"),FeatureNavigation=require("./ui/FeatureNavigation.js"),FeatureDots=require("./ui/FeatureDots.js");const showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...FeatureDots.FeatureDots,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...FeatureNavigation.FeatureNavigation,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...ImageListNavigation.ImageListNavigation,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},controls:[{conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',label:{en:"Default item"},setting:{id:"preDisplay"}},{label:{en:"Image list"},setting:{id:"filterByVariant"}}],messageConfig:{type:"info",message:'Image list can display based on the selected variants. <a class="text-white" target="_blank" href="https://
|
|
1
|
+
"use strict";var ImageListNavigation=require("./ui/ImageListNavigation.js"),FeatureNavigation=require("./ui/FeatureNavigation.js"),FeatureDots=require("./ui/FeatureDots.js");const showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...FeatureDots.FeatureDots,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...FeatureNavigation.FeatureNavigation,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...ImageListNavigation.ImageListNavigation,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},controls:[{conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',label:{en:"Default item"},setting:{id:"preDisplay"}},{label:{en:"Image list"},setting:{id:"filterByVariant"}}],messageConfig:{type:"info",message:'Image list can display based on the selected variants. <a class="text-white" target="_blank" href="https://gempages.co/display-selected-variant">How to setup</a>'}},{label:{en:"Optimize LCP"},controls:[{label:{en:"Preload"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',setting:{id:"preload"}},{label:{en:"Quality"},setting:{id:"qualityType"},conditionDisplay:"preload === false"},{layout:"horizontal",label:{en:"Quality"},conditionDisplay:'qualityType == "custom" && preload === false',setting:{id:"qualityPercent"}}]},{controls:[{label:{en:"Align"},setting:{id:"align"},options:{labelVariant:"primary"}}]}];exports.SettingUIV2=SettingUIV2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"default",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"}]}];export{settingV2};
|
|
1
|
+
let settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"default",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"},{id:"direction",label:"Direction",type:"option:value",options:[{label:"LTR",value:"ltr"},{label:"RTL",value:"rtl"}],default:"ltr"}]}];export{settingV2};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:""},setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];export{SettingUIV2};
|
|
1
|
+
let SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:"Direction"},setting:{id:"direction"},controlChangeTrigger:{settings:[{action:{controlId:"textAlign",newValue:"right",groupType:"style",controlType:"style"},condition:"direction === 'rtl' && textAlign === 'left'",source:["direction","textAlign"]},{action:{controlId:"textAlign",newValue:"left",groupType:"style",controlType:"style"},condition:"direction === 'ltr' && textAlign === 'right'",source:["direction","textAlign"]}],options:{noRecordHistory:!0}}},{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];export{SettingUIV2};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"xlarge",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"}]}];export{settingV2};
|
|
1
|
+
let settingV2=[{id:"setting",controls:[{id:"textGroup",type:"group",label:"Text",controls:[{id:"text",label:"Content",type:"textarea",default:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."}]}]},{id:"style",controls:[{id:"typo",label:"Label",type:"typography-post-purchase",default:{fontSize:"xlarge",textColor:"default",fontWeight:"bold",textTransform:"none"}},{id:"textAlign",label:"Alignment",type:"option:value",options:[{label:"Left",value:"left",type:"text",tooltip:"Align left",iconName:"polaris-text-align-left"},{label:"Center",value:"center",type:"text",tooltip:"Align center",iconName:"polaris-text-align-center"},{label:"Right",value:"right",type:"text",tooltip:"Align right",iconName:"polaris-text-align-right"}],default:"left"},{id:"direction",label:"Direction",type:"option:value",options:[{label:"LTR",value:"ltr"},{label:"RTL",value:"rtl"}],default:"ltr"}]}];export{settingV2};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];export{SettingUIV2};
|
|
1
|
+
let SettingUIV2=[{label:{en:"Text"},controls:[{type:"control",label:{en:"Direction"},setting:{id:"direction"},controlChangeTrigger:{settings:[{action:{controlId:"textAlign",newValue:"right",groupType:"style",controlType:"style"},condition:"direction === 'rtl' && textAlign === 'left'",source:["direction","textAlign"]},{action:{controlId:"textAlign",newValue:"left",groupType:"style",controlType:"style"},condition:"direction === 'ltr' && textAlign === 'right'",source:["direction","textAlign"]}],options:{noRecordHistory:!0}}},{type:"control",setting:{id:"typo"},layout:"vertical"},{type:"control",setting:{id:"textAlign"},label:{en:"Text align"}}]}];export{SettingUIV2};
|
|
@@ -22,7 +22,7 @@ import{template as e}from"@gem-sdk/core";import{Liquid as s,LiquidIf as i}from"@
|
|
|
22
22
|
|
|
23
23
|
{% if optionTitle == option.name %}
|
|
24
24
|
{%- assign variantPresetString = "${r}" -%}
|
|
25
|
-
{%- assign optionName = option.name | replace: "'", "
|
|
25
|
+
{%- assign optionName = option.name | replace: "'", "'" | replace: '"', """ -%}
|
|
26
26
|
{%- assign items = variantPresetString | split: '($2)' -%}
|
|
27
27
|
{%- assign type = 'dropdown' -%}
|
|
28
28
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{composeTypographyStyle as e,
|
|
1
|
+
import{composeTypographyStyle as e,makeStyleResponsive as t,makeStyle as o,getSingleColorVariable as a,getStyleShadow as r,makeWidth as c,getGlobalColorStateStyle as s,handleConvertBorderStyle as l,handleConvertBorderWidth as i,handleConvertBorderColor as d,composeRadius as p}from"@gem-sdk/core";import{filterTruthyObject as h}from"../../../../../helpers.js";let getSelectStyle=({width:n,height:b,optionTypo:g,optionTypography:m,optionBgColor:u,optionTextColor:v,optionRounded:w,optionHasShadow:S,optionShadow:x,optionBorder:y,optionTransform:f,isCombine:k,textAlign:A})=>{let E=e(g,m),F=A?t("ta",A):{},j=o({bg:a(u?.active),bs:y?.active?.border,bw:y?.active?.width,bc:y?.active?.color}),T=[k?"active":"normal","hover"].reduce((e,t)=>({...e,...r({value:x?.[t],state:t,styleAppliedFor:"box-shadow",isEnableShadow:S?.[t]})}),{});return h({...t("w",c(n)),...o({h:b}),...T,...j,...o({tt:f}),...E,...s("c",v),...s("bg",u),...l(y),...i(y),...d(y),...p(w),...r({value:g?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:g?.custom?.hasShadowText}),...F,appearance:"none","background-image":"url(https://cdn.shopify.com/s/files/1/1827/4239/t/1/assets/ico-select.svg?v=155563818344741998551488860031)","background-repeat":"no-repeat","background-position":"right 16px center"})};export{getSelectStyle};
|
package/dist/esm/product/components/product-variants/components/dropdown-swatches/Dropdown.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import{jsxs as o,jsx as t}from"react/jsx-runtime";import e from"../dropdown-option/VariantOption.js";import i from"../dropdown-option/DropdownOption.js";import{getSelectClass as n}from"../../common/dropdown/classes.js";import{createClass as r,createStyle as a,createAttr as p,If as m}from"@gem-sdk/system";import{getSelectStyle as
|
|
2
|
+
import{jsxs as o,jsx as t}from"react/jsx-runtime";import e from"../dropdown-option/VariantOption.js";import i from"../dropdown-option/DropdownOption.js";import{getSelectClass as n}from"../../common/dropdown/classes.js";import{createClass as r,createStyle as a,createAttr as p,If as m}from"@gem-sdk/system";import{getSelectStyle as s}from"../../common/dropdown/styles.js";import{getSelectAttr as d}from"../../common/dropdown/attrs.js";import{useDropdownSwatches as l}from"./hooks/useDropdownSwatches.js";let DropdownVariant=c=>{let{option:w,optionPosition:h,optionNumber:u,variantGroup:f,variants:g,price:j,blankText:v,swatchHeight:b,optionTypography:x,optionTransform:k,initValue:y,hasPreSelected:C,optionTypo:D,combineHeight:N,combineWidth:S,soldOutStyle:O}=c,{optionBgColor:P,optionTextColor:V,optionRounded:A,optionShadow:B,optionHasShadow:R,optionBorder:H}=c,{value:M,preset:T,handleOnChangeSelect:q,checkVariantInStock:z}=l(c),E="disable"===O;f||(P=T?.optionBgColor,V=T?.optionTextColor,H=T?.optionBorder,R=T?.optionHasShadow,B=T?.optionShadow,A=T?.optionRounded);let F=r(n({optionTypo:D,optionTypography:x,optionBgColor:P,optionBorder:H,optionTextColor:V})),G=a(s({width:f?S:T?.width,height:f?N:T?.height,optionTypo:D,optionTypography:x,optionBgColor:P,optionTextColor:V,optionRounded:A,optionShadow:B,optionHasShadow:R,optionBorder:H,optionTransform:k,swatchHeight:b,isCombine:f,textAlign:D?.attrs?.textAlign})),I=p(d({optionName:w?.name,value:M??y,type:"React"})),J=()=>g?.map(o=>t(e,{disabled:!z(o)&&E,value:o?.id,variant:o,includePrice:j},o?.id)),K=()=>w?.values?.map(o=>t(i,{value:o,optionName:w.name,optionPosition:h,optionNumber:u,isSoldOutMark:E},o?.id));return o("select",{...I,className:F,style:G,onChange:o=>q(o),children:[m(!C,t("option",{value:"blank",children:v??"Please select an option"})," "),m(f,J(),K())]})};export{DropdownVariant as default};
|
package/dist/esm/product/components/product-variants/components/dropdown-swatches/Dropdown.liquid.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import{template as o}from"@gem-sdk/core";import{createClass as
|
|
1
|
+
import{template as o}from"@gem-sdk/core";import{createClass as t,createStyle as r,createAttr as e,If as s}from"@gem-sdk/system";import{getSelectClass as m}from"../../common/dropdown/classes.js";import{getSelectStyle as i}from"../../common/dropdown/styles.js";import{getSelectAttr as d}from"../../common/dropdown/attrs.js";import{renderBlankOption as n,renderDropdownOptions as p}from"../dropdown-option/render-liquid/index.js";let DropdownVariant=l=>{let{variantGroup:a,blankText:c,swatchAutoWidth:f,swatchHeight:w,optionTypography:g,optionBgColor:$,optionTextColor:j,optionRounded:u,optionShadow:x,optionHasShadow:y,optionBorder:h,optionTransform:b,hasPreSelected:k,optionTypo:q,combineHeight:A,combineWidth:D,soldOutStyle:V,children:C}=l,L="disable"===V,v=t(m({optionTypo:q,optionTypography:g,optionBgColor:$,optionBorder:h,optionTextColor:j})),z=r(i({width:a?D:f,height:a?A:w,optionTypo:q,optionTypography:g,optionBgColor:$,optionTextColor:j,optionRounded:u,optionHasShadow:y,optionShadow:x,optionBorder:h,optionTransform:b,isCombine:a,textAlign:q?.attrs?.textAlign})),B=e(d({variantGroup:a,type:"Liquid"})),E=()=>C;return o`
|
|
2
2
|
<select
|
|
3
3
|
${B}
|
|
4
|
-
class="${
|
|
5
|
-
style="${
|
|
4
|
+
class="${v}"
|
|
5
|
+
style="${z}"
|
|
6
6
|
>
|
|
7
|
-
${
|
|
8
|
-
${
|
|
7
|
+
${s(!k,n(c))}
|
|
8
|
+
${s(a,E(),p(L,k))}
|
|
9
9
|
</select>`};export{DropdownVariant as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{ImageListNavigation as e}from"./ui/ImageListNavigation.js";import{FeatureNavigation as i}from"./ui/FeatureNavigation.js";import{FeatureDots as t}from"./ui/FeatureDots.js";let showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...t,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...i,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...e,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},controls:[{conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',label:{en:"Default item"},setting:{id:"preDisplay"}},{label:{en:"Image list"},setting:{id:"filterByVariant"}}],messageConfig:{type:"info",message:'Image list can display based on the selected variants. <a class="text-white" target="_blank" href="https://
|
|
1
|
+
import{ImageListNavigation as e}from"./ui/ImageListNavigation.js";import{FeatureNavigation as i}from"./ui/FeatureNavigation.js";import{FeatureDots as t}from"./ui/FeatureDots.js";let showGallerySliderSetting='((type == "slider" || position == "left" || position == "right") && position !== "one-col" && position != "two-col")',showFeaturedImage='(["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position))',showGalleryHoverAction='(position == "one-col" || position == "two-col")',showImageListSetting='(position !== "only-feature")',SettingUIV2=[{label:{en:"Layout"},controls:[{layout:"vertical",setting:{id:"position"},options:{isComboLayout:!0},controls:[{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayout"},layout:"vertical",conditionDisplay:'position == "left"'},{label:{en:"Ratio"},type:"control",setting:{id:"ratioLayoutRight"},layout:"vertical",conditionDisplay:'position == "right"'}]}]},{label:{en:"Featured image"},conditionDisplay:showFeaturedImage,controls:[{setting:{id:"ftShape"},layout:"vertical",controlChangeTrigger:{settings:[{condition:"ftShape.shape === 'original'",source:["ftShape"],action:{controlId:"ftLayout",newValue:"contain",groupType:"style",controlType:"style"}}],options:{noRecordHistory:!0}}},{conditionDisplay:"ftShape.shape !== 'original'",label:{en:"Image scale"},setting:{id:"ftLayout"}},{...t,conditionDisplay:`${showFeaturedImage} && position === "only-feature"`},{...i,conditionDisplay:`${showFeaturedImage}`}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"ftCorner"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:showFeaturedImage,iconName:"gp-trigger-action-hover",getValueFromSettingID:"hoverEffect",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"hoverEffect"}},{label:{en:"Zoom type"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoomType"}},{label:{en:"Zoom value"},conditionDisplay:'hoverEffect == "zoom"',setting:{id:"zoom"}},{label:{en:"Other image"},conditionDisplay:'hoverEffect == "other"',setting:{id:"otherImage"}}]},{type:"combo",label:{en:"Click action"},iconName:"gp-trigger-action-click",conditionDisplay:showFeaturedImage,getValueFromSettingID:"ftClickOpenLightBox",isShowSettingTitle:!0,defaultValueWhenClear:"none",compoDefaultValue:"popup",controls:[{label:{en:"After click"},setting:{id:"ftClickOpenLightBox"}},{label:{en:"Open new tab"},setting:{id:"ftClickOpenNewTab"},conditionDisplay:'ftClickOpenLightBox === "product-link"'}]},{type:"control",label:{en:"Slide speed"},setting:{id:"ftAnimationSpeed"}},{type:"control",label:{en:"Animation"},setting:{id:"ftAnimationMode"}},{label:{en:"Drag / swipe"},setting:{id:"ftDragToScroll"}},{label:{en:"Infinity loop"},setting:{id:"ftLoop"}}]}},{label:{en:"Image list"},conditionDisplay:'(position !== "only-feature")',controls:[{label:{en:"Display"},conditionDisplay:'position === "bottom-center" || position === "bottom-left" || position === "inside-bottom"',setting:{id:"type"}},{setting:{id:"shape"},layout:"vertical",conditionDisplay:'["left", "right"].includes(position)'},{setting:{id:"shapeForBottom"},layout:"vertical",conditionDisplay:'["bottom-left", "bottom-center"].includes(position)'},{setting:{id:"shapeForInsideBottom"},layout:"vertical",conditionDisplay:'["inside-bottom"].includes(position)'},{setting:{id:"shapeForInside"},layout:"vertical",conditionDisplay:'["inside-left", "inside-right"].includes(position)'},{setting:{id:"shapeForFtOnly"},layout:"vertical",conditionDisplay:'position == "only-feature"'},{setting:{id:"shapeFor2Col"},layout:"vertical",conditionDisplay:'position == "two-col"'},{setting:{id:"shapeFor1Col"},layout:"vertical",conditionDisplay:'position == "one-col"'},{label:{en:"Image gap"},setting:{id:"itemSpacing"}},{conditionDisplay:"(position == 'one-col' && shapeFor1Col.shape !== 'original') || (position == 'two-col' && shapeFor2Col.shape !== 'original') || (position == 'only-feature' && shapeForFtOnly.shape !== 'original') || ([\"inside-left\", \"inside-right\"].includes(position) && shapeForInside.shape !== 'original') || ([\"inside-bottom\"].includes(position) && shapeForInsideBottom.shape !== 'original') || ([\"bottom-left\", \"bottom-center\"].includes(position) && shapeForBottom.shape !== 'original') || ([\"left\", \"right\"].includes(position) && shape.shape !== 'original')",label:{en:"Image scale"},setting:{id:"layout"}},{...e,conditionDisplay:showGallerySliderSetting}],moreSettings:{type:"collapse",controls:[{label:{en:"Corner"},setting:{id:"corner"}},{label:{en:"Active border"},conditionDisplay:'!["one-col", "two-col"].includes(position)',setting:{id:"borderActive"}},{type:"combo",label:{en:"Hover action"},conditionDisplay:'(position == "one-col" || position == "two-col")',iconName:"gp-trigger-action-hover",getValueFromSettingID:"galleryHoverEffect",defaultValueWhenClear:"none",compoDefaultValue:"zoom",controls:[{label:{en:"When hover"},setting:{id:"galleryHoverEffect"},conditionDisplay:'galleryHoverEffect == "none"'},{label:{en:"Zoom type"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoomType"}},{label:{en:"Zoom value"},conditionDisplay:'galleryHoverEffect == "zoom"',setting:{id:"galleryZoom"}},{label:{en:"Other image"},conditionDisplay:'galleryHoverEffect == "other"',setting:{id:"otherImage"}}]},{label:{en:"Click action"},setting:{id:"clickOpenLightBox"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Drag / swipe"},setting:{id:"dragToScroll"}},{conditionDisplay:showGallerySliderSetting,label:{en:"Infinity loop"},setting:{id:"loop"}}]}},{label:{en:"Item spacing"},conditionDisplay:'["bottom-center", "left", "right", "inside-bottom", "inside-left", "inside-right"].includes(position)',controls:[{label:{en:"Gap"},setting:{id:"spacing"}}]},{label:{en:"Display condition"},controls:[{conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',label:{en:"Default item"},setting:{id:"preDisplay"}},{label:{en:"Image list"},setting:{id:"filterByVariant"}}],messageConfig:{type:"info",message:'Image list can display based on the selected variants. <a class="text-white" target="_blank" href="https://gempages.co/display-selected-variant">How to setup</a>'}},{label:{en:"Optimize LCP"},controls:[{label:{en:"Preload"},conditionDisplay:'["bottom-center", "left", "right", "only-feature", "inside-bottom", "inside-left", "inside-right"].includes(position)',setting:{id:"preload"}},{label:{en:"Quality"},setting:{id:"qualityType"},conditionDisplay:"preload === false"},{layout:"horizontal",label:{en:"Quality"},conditionDisplay:'qualityType == "custom" && preload === false',setting:{id:"qualityPercent"}}]},{controls:[{label:{en:"Align"},setting:{id:"align"},options:{labelVariant:"primary"}}]}];export{SettingUIV2};
|