@gem-sdk/components 8.0.0-dev.25 → 8.0.0-staging.10
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/carousel-v3/components/swiper/Swiper.js +1 -1
- package/dist/cjs/countdown-timer/common/helpers.js +1 -1
- package/dist/cjs/countdown-timer/hooks/useCountDownTimer.js +1 -1
- package/dist/cjs/countdown-timer/hooks/useTimeLeft.js +1 -1
- package/dist/cjs/countdown-timer/settings/Countdown.js +1 -1
- package/dist/cjs/countdown-timer/settings/configs/setting.js +1 -1
- package/dist/cjs/countdown-timer/settings/configs/ui-v2.js +1 -1
- package/dist/cjs/post-purchase/product/components/ProductPrice.js +1 -1
- package/dist/cjs/post-purchase/product/constants/ProductOfferPlaceholder.js +1 -1
- package/dist/cjs/post-purchase/product/hooks/useGetMoneyLines.js +1 -1
- package/dist/cjs/product/components/product-badge/ProductBadge.liquid.js +10 -10
- package/dist/cjs/product/components/product-badge/common/styles.js +1 -1
- package/dist/cjs/product/components/product-badge/utils/common.js +1 -1
- package/dist/cjs/product/components/product-badge/utils/renderBadgeLiquid.js +4 -3
- package/dist/cjs/product/components/product-button/ProductButton.liquid.js +4 -6
- package/dist/cjs/product/components/product-button/hooks/useAddToCart.js +1 -1
- package/dist/cjs/product/components/product-discount-tag/hooks/useGpDiscountTag.js +1 -1
- package/dist/cjs/product/components/product-list-v3/ProductList.js +1 -1
- package/dist/cjs/product/components/product-price/hooks/useGpPrice.js +1 -1
- package/dist/cjs/product/components/product-variants/ProductVariants.liquid.js +77 -27
- package/dist/cjs/product/components/product-variants/common/base/styles.js +1 -1
- package/dist/cjs/product/components/product-variants/components/color/color.liquid.js +3 -3
- package/dist/cjs/product/components/product-wrap/Product.liquid.js +12 -10
- package/dist/cjs/product/helpers/product-bundle.js +1 -1
- package/dist/esm/carousel-v3/components/swiper/Swiper.js +1 -1
- package/dist/esm/countdown-timer/common/helpers.js +1 -1
- package/dist/esm/countdown-timer/hooks/useCountDownTimer.js +1 -1
- package/dist/esm/countdown-timer/hooks/useTimeLeft.js +1 -1
- package/dist/esm/countdown-timer/settings/Countdown.js +1 -1
- package/dist/esm/countdown-timer/settings/configs/setting.js +1 -1
- package/dist/esm/countdown-timer/settings/configs/ui-v2.js +1 -1
- package/dist/esm/post-purchase/product/components/ProductPrice.js +1 -1
- package/dist/esm/post-purchase/product/constants/ProductOfferPlaceholder.js +1 -1
- package/dist/esm/post-purchase/product/hooks/useGetMoneyLines.js +1 -1
- package/dist/esm/product/components/product-badge/ProductBadge.liquid.js +21 -21
- package/dist/esm/product/components/product-badge/common/styles.js +1 -1
- package/dist/esm/product/components/product-badge/utils/common.js +1 -1
- package/dist/esm/product/components/product-badge/utils/renderBadgeLiquid.js +4 -3
- package/dist/esm/product/components/product-button/ProductButton.liquid.js +9 -11
- package/dist/esm/product/components/product-button/hooks/useAddToCart.js +1 -1
- package/dist/esm/product/components/product-discount-tag/hooks/useGpDiscountTag.js +1 -1
- package/dist/esm/product/components/product-list-v3/ProductList.js +1 -1
- package/dist/esm/product/components/product-price/hooks/useGpPrice.js +1 -1
- package/dist/esm/product/components/product-variants/ProductVariants.liquid.js +82 -32
- package/dist/esm/product/components/product-variants/common/base/styles.js +1 -1
- package/dist/esm/product/components/product-variants/components/color/color.liquid.js +3 -3
- package/dist/esm/product/components/product-wrap/Product.liquid.js +33 -31
- package/dist/esm/product/helpers/product-bundle.js +1 -1
- package/dist/types/index.d.ts +0 -1
- package/package.json +4 -4
- package/dist/cjs/product/components/product-variants/OptionVariantsNewFormat.liquid.js +0 -41
- package/dist/cjs/product/components/product-variants/OptionVariantsOldFormat.liquid.js +0 -66
- package/dist/cjs/product/components/product-variants/common/const.js +0 -1
- package/dist/esm/product/components/product-variants/OptionVariantsNewFormat.liquid.js +0 -41
- package/dist/esm/product/components/product-variants/OptionVariantsOldFormat.liquid.js +0 -66
- package/dist/esm/product/components/product-variants/common/const.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{makeGlobalSize as e,composeTypographyStyle as t,getStyleShadow as o
|
|
1
|
+
import{makeGlobalSize as e,composeTypographyStyle as t,getStyleShadow as o}from"@gem-sdk/core";import{convertToStyle as r,getSize as i,getWrapperStyle as a,getShapeWrapperPadding as n,checkDiscountContentProductBadge as s}from"../utils/common.js";import{getShapePosition as p}from"../utils/getShapePosition.js";import{composeTextStyleByPosition as g,composeShapeStyleByPosition as l}from"../utils/getRotateShape.js";import{getStyleAdvanced as d}from"../utils/getStyleAdvanced.js";import{getWhiteSpaceStyle as u}from"../utils/getWhiteSpace.js";import{getStyleBackground as S,generateShadowCSS as y,getStyleBorder as m,getStyleCornerRadius as h}from"../utils/stylesV2.js";import{getShape as x}from"../utils/shape.js";import{checkShowBadge as c}from"../utils/renderBadgeILP.js";let getSizeStyles=e=>{let{setting:t,styles:o}=e,r=x(t?.shape),a=t?.contentType==="text",n=a?o?.textSizeV2:o?.imageSizeV2;return a?i(r,n):i(void 0,n)},getContainerStyle=(e,t=!1)=>{let{setting:o,styles:r,style:i,navigationPosition:n,imageData:s,dotData:g}=e,l=o?.positionWithImage==="outside",u=a(t),S=p({positionType:r?.position,isLiquid:!1,navigationPosition:n,dataImage:{...s,...g}}),y=getSizeStyles(e),m=d(l?{}:{...S,...y},i);return{...!l&&{"--pos":"absolute"},...u,...m}},getTextContentStyle=({styles:i,setting:a})=>{let n=e(i?.textSizeV2).padding,s=x(a?.shape),p=a?.positionWithImage==="outside";return{...u(i?.textSizeV2),...r(s?.textStyle),...g(s,i?.position,p),...t(i?.typo),...o({value:i?.typo?.custom?.textShadow,styleAppliedFor:"text-shadow",isEnableShadow:i?.typo?.custom?.hasShadowText}),...S(!!s?.backgroundColorInText,i?.badgeColorV2),...n}},getBorderStyles=({styles:e,setting:t})=>{let o=x(t?.shape),r=t?.contentType==="text";return o?.supportBorder?r?m(e?.textBadgeBorder):m(e?.imageBadgeBorder):{}},getCornerStyles=({styles:e,setting:t})=>{let o=x(t?.shape),r=t?.contentType==="text";return o?.supportCorner?r?h(e?.textBadgeCorner,o?.shapeRadius):h(e?.imageBadgeCorner,o?.shapeRadius):{}},getTextBadgeWrapperStyles=({styles:e,setting:t})=>{let o=x(t?.shape),r=getBorderStyles({setting:t,styles:e}),i=t?.positionWithImage==="outside",a=getCornerStyles({setting:t,styles:e}),s=n(o?.ratio);return{...r,...a,...l(o,e?.position,i),...S(!o?.backgroundColorInText,e?.badgeColorV2),...s,height:o?.ratio===1?"0px":"100%"}},getImageContainerStyles=({styles:t,setting:o})=>{let r=getBorderStyles({setting:o,styles:t}),i=getCornerStyles({setting:o,styles:t}),a=e(t?.imageSizeV2).padding;return{...r,...i,...a}},getOpacityProductBadge=(e,t,o,r)=>{let{"bundle-item":i,setting:a}=e;if(i)return 1;let n=s(a?.displayContent)&&a?.contentType==="text";if(!n)return 1;let p=t?.price??0,g=t?.salePrice??0,l=g-p>0,d=c(a?.displayTrigger,o,t);return l&&d?1:"edit"===r?.2:0},getSubWrapperStyle=(e,t,o,r)=>{let{setting:i}=e,a=i?.positionWithImage==="outside",n=getSizeStyles(e),s=r&&o?getOpacityProductBadge(e,o,t,r):1;return{...a?{...n,"--mb":0}:{},opacity:s}},getContentStyleInternal=e=>{let{styles:t,setting:o,builderProps:r}=e,i=o?.contentType==="text";return y(`[id="${r?.uid}"] .product-badge-item`,i?t?.textBadgeShadow:t?.imageBadgeShadow)};export{getContainerStyle,getContentStyleInternal,getImageContainerStyles,getSubWrapperStyle,getTextBadgeWrapperStyles,getTextContentStyle};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{cls as e,
|
|
1
|
+
import{cls as e,formatMoney as t,makeStyleResponsive as r,getResponsiveValueByScreen as i}from"@gem-sdk/core";import{applyBundleDiscountAmount as n}from"../../../helpers/product-bundle.js";import{DiscountType as o}from"../../constants/product-bundle.js";let removeTrailingZeros=e=>e.replace(/\.00$/,""),getPriceDiffByPercent=(e,t)=>{if(!t)return"0";let r=1e3*t-1e3*e;return Math.round(100*r/(1e3*t))},getPriceDiffByValue=(e,r,i)=>removeTrailingZeros(t(r?(r-e).toFixed(2):"0",i)),getMinPrice=(e,r)=>{let i=e?.edges?.length&&e.edges.length>0?1/0:0;return e?.edges.forEach(({node:e})=>{if(!e)return;let t=e?.price;void 0!==t&&t<i&&(i=t)}),removeTrailingZeros(t(i.toString(),r))},checkNoDiscountState=(e,t)=>{let{discountPercentAmount:r}=n({currentVariant:e?.currentVariant,bundleItem:e?.bundleItem,options:{moneyFormat:t,useProductCompareAtPrice:e?.useProductCompareAtPrice}});return!(e?.bundleItem?.discountType===o.NoDiscount&&e?.useProductCompareAtPrice||Number(e?.bundleItem?.discountValue)&&r)&&!e?.currentVariant?.salePrice},getBadgeContent=(e,r,i)=>{if(!e.detail||!r?.trim()?.length)return r;let{detail:u,currentVariant:c}=e,{discountPercentAmount:l,discountAmount:a}=n({currentVariant:c,bundleItem:e?.bundleItem,options:{moneyFormat:i,useProductCompareAtPrice:e?.useProductCompareAtPrice}}),d=()=>e?.bundleItem?.discountType!==o.NoDiscount||e?.useProductCompareAtPrice?Number(e?.bundleItem?.discountValue)>0?`${l}%`:`${getPriceDiffByPercent(c?.price||0,c?.salePrice||0)||0}%`:"0%",s=()=>e?.bundleItem?.discountType!==o.NoDiscount||e?.useProductCompareAtPrice?Number(e?.bundleItem?.discountValue)>0?a:getPriceDiffByValue(c?.price||0,c?.salePrice||0,i):t("0",i),p=new Map([["{percent_discount}",d],["{amount_discount}",s],["{min_price}",()=>getMinPrice(u.variants,i)||0],["{inventory_quantity}",()=>c?.inventoryQuantity||0]]);return[...p.entries()].reduce((e,[t,r])=>e.replaceAll(t,r()),r)},checkDiscountContentProductBadge=e=>{if(!e)return!1;let t=/\{percent_discount\}|\{amount_discount\}/;return t.test(e)},getShapePlacementClass=(e,t,r="desktop")=>e?t?.[`--pos${deviceWithSurfix(r)}`]?"w-full h-full":"!gp-absolute":t?.[`--d${deviceWithSurfix(r)}`]?"":"!gp-inline-block gp-w-fit",getAlignShape=(t,r)=>r?"":e("gp-flex",{"gp-justify-start":t?.desktop==="left","gp-justify-center":t?.desktop==="center","gp-justify-end":t?.desktop==="right","tablet:gp-justify-start":t?.tablet==="left","tablet:gp-justify-center":t?.tablet==="center","tablet:gp-justify-end":t?.tablet==="right","mobile:gp-justify-start":t?.mobile==="left","mobile:gp-justify-center":t?.mobile==="center","mobile:gp-justify-end":t?.mobile==="right"}),convertToStyle=e=>Object.entries(e||{}).reduce((e,[t,r])=>{let i=new Map([["clipPath","clip-path"],["writingMode","writing-mode"],["borderRadius","border-radius"],["transform","transform"],["alignItems","align-items"],["maxWidth","max-width"]]),n=i.get(t)||t;return{...e,[n]:r}},{}),getWrapperStyle=e=>({[e?"z-index":"zIndex"]:2}),getWidthByShapeSize=(e,t)=>{let r={},n=["desktop","mobile","tablet"];return n.forEach(n=>{let o=i(e,n,null),u=o?.width||t?.wrapperWidth;u&&(r={...r,[n]:u})}),r},getHeightByShapeSize=(e,t)=>{let r={},n=["desktop","mobile","tablet"];return n.forEach(n=>{let o=i(e,n,null);r={...r,[n]:o?.height||t?.wrapperHeight}}),r},getSize=(e,t)=>{let i=r("w",getWidthByShapeSize(t,e)),n=r("h",getHeightByShapeSize(t,e));return{...i,...n}},getShapeWrapperPadding=e=>{let t={};if(1!==e)return t;let r=["desktop","mobile","tablet"];return r.forEach(e=>{t={...t,height:0,[`--p${"desktop"!==e?`-${e}`:""}`]:"50% 0"}}),t},deviceWithSurfix=e=>"desktop"===e?"":`-${e}`,getDeviceSpecificStyle=(e,t)=>{for(let r of({desktop:["desktop"],tablet:["tablet","desktop"],mobile:["mobile","tablet","desktop"]})[t])if(e?.[r])return e[r]},getIsNoDiscountState=({props:e,product:t,currentVariant:r,moneyFormat:i,useProductCompareAtPrice:n})=>{let{setting:o,"bundle-item":u}=e,c=checkDiscountContentProductBadge(o?.displayContent);return c&&checkNoDiscountState({detail:t,currentVariant:r,bundleItem:u,useProductCompareAtPrice:n},i)};export{checkDiscountContentProductBadge,checkNoDiscountState,convertToStyle,deviceWithSurfix,getAlignShape,getBadgeContent,getDeviceSpecificStyle,getIsNoDiscountState,getShapePlacementClass,getShapeWrapperPadding,getSize,getWidthByShapeSize,getWrapperStyle};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{CompareType as e}from"../types.js";let getMinValueForInventory=i=>i===e.ABOVE?0:i===e.BELOW?2:1,renderBadgeInFirstTime=(e,i)=>`
|
|
1
|
+
import{CompareType as e}from"../types.js";let getMinValueForInventory=i=>i===e.ABOVE?0:i===e.BELOW?2:1,renderBadgeInFirstTime=(e,i,n)=>`
|
|
2
2
|
{% assign isShow = true %}
|
|
3
3
|
{% assign conditionTriggers = "" %}
|
|
4
4
|
{% assign isInventoryStatus = false %}
|
|
@@ -16,8 +16,9 @@ import{CompareType as e}from"../types.js";let getMinValueForInventory=i=>i===e.A
|
|
|
16
16
|
{% assign price = variant.price | times: 1.0 %}
|
|
17
17
|
{% assign salePrice = variant.compare_at_price | times: 1.0 %}
|
|
18
18
|
{% assign priceSave = salePrice | minus: price %}
|
|
19
|
-
{% assign
|
|
20
|
-
{%
|
|
19
|
+
{% assign isDiscountContent = ${i} %}
|
|
20
|
+
{% assign isTextBadge = ${n} %}
|
|
21
|
+
{% if priceSave <= 0 or isDiscountContent == false or isTextBadge == false %}
|
|
21
22
|
{% assign isShow = false %}
|
|
22
23
|
{% endif %}
|
|
23
24
|
{% if isShow %}
|
|
@@ -1,22 +1,20 @@
|
|
|
1
|
-
import{getSplitStyle as t}from"./common/styles.js";import{getGPProductButtonState as
|
|
2
|
-
${i("{%- assign total_combinations = 1 -%}")}
|
|
3
|
-
${l("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
|
|
1
|
+
import{getSplitStyle as t}from"./common/styles.js";import{getGPProductButtonState as r}from"./common/helpers.js";import{template as e,isLocalEnv as s,baseAssetURL as o}from"@gem-sdk/core";import{createStateOrContext as a,If as i}from"@gem-sdk/system";import{getInsertLinkData as l,getSettingPreloadData as p}from"../../../helpers.js";import{getButtonDynamicSourceLocales as n}from"./helpers/getButtonDynamicSourceLocales.js";import{SoldOutButton as u}from"./SoldOutButton.liquid.js";import{AddToCartButton as c}from"./AddToCartButton.liquid.js";let ProductButton=d=>{let{setting:m,builderProps:f,style:g,styles:y,pageContext:$}=d,{wrapStyle:v,restStyle:b}=t(g),{outOfStockButtonLabel:j,unavailableButtonLabel:S,variantSelectionRequiredMessage:k}=n({setting:m,pageContext:$,builderProps:f}),{urlData:_}=l("",m?.actionEffect==="open-cart-drawer"?{link:"/cart",target:"_self"}:m?.customURL),h=a(r(y,m)),q=()=>c({...d,style:b}),B=()=>u({...d,style:b,label:j}),E=()=>i(s,`<script ${p('class="gps-link" delay',"src")}="{{ 'gp-product-button-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${p('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-button-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`);return e`
|
|
4
2
|
{%- liquid
|
|
5
3
|
assign inventory_quantity = variant.inventory_quantity | default: 0
|
|
6
4
|
assign is_in_stock = variant.available
|
|
7
5
|
-%}
|
|
8
6
|
<gp-product-button
|
|
9
|
-
style="${
|
|
7
|
+
style="${v}"
|
|
10
8
|
gp-data-wrapper="true"
|
|
11
|
-
gp-href="${
|
|
9
|
+
gp-href="${_.href}"
|
|
12
10
|
class="gp-product-button"
|
|
13
|
-
gp-label-out-of-stock="${
|
|
14
|
-
gp-label-unavailable="${
|
|
15
|
-
gp-data='${JSON.stringify(
|
|
11
|
+
gp-label-out-of-stock="${j}"
|
|
12
|
+
gp-label-unavailable="${S}"
|
|
13
|
+
gp-data='${JSON.stringify(h).replaceAll("'","'")}'
|
|
16
14
|
data-variant-selection-required-message="${k}"
|
|
17
15
|
>
|
|
18
|
-
${
|
|
19
|
-
${
|
|
16
|
+
${q()}
|
|
17
|
+
${B()}
|
|
20
18
|
</gp-product-button>
|
|
21
|
-
${
|
|
19
|
+
${E()}
|
|
22
20
|
`};export{ProductButton as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useRenderMode as e,useProduct as t,useCurrency as r,useQuantity as i,useProductProperties as s,useCurrentVariant as n,useHasPreSelected as o,useStickyStore as a,useProductStore as u,useCreateCart as l,useAddToCart as c,
|
|
1
|
+
import{useRenderMode as e,useProduct as t,useCurrency as r,useQuantity as i,useProductProperties as s,useCurrentVariant as n,useHasPreSelected as o,useStickyStore as a,useProductStore as u,useCreateCart as l,useAddToCart as c,useCurrentVariantInStock as m}from"@gem-sdk/core";import{useRef as b,useEffect as d,useCallback as f}from"react";import{addToCartTracking as p}from"../../../helpers/tracking.js";import{useDispatchAfterSubmitEvent as v}from"./useDispatchAfterSubmitEvent.js";import{useCartMessage as g}from"./useCartMessage.js";import{useCartOperations as I}from"./useCartOperations.js";let useBtnAddToCart=({styles:k,setting:D,builderProps:S})=>{let E=b(null),{isEditMode:h,isPreviewSharePageMode:j}=e(),y=t(),{currency:C}=r(),{quantity:A}=i(),M=s(),O=n(),{hasPreSelected:w}=o(),B=a(e=>e.setStickyVisible),T=u(e=>e.updateIsSubmit),q=v(S?.uid),{showMessage:x,notiComponent:L}=g(k,D),{handleSuccess:U,handleError:V,cartId:z}=I(D,x,q),{isMutating:F,trigger:G}=l({onSuccess:U,onError:V}),{isMutating:H,trigger:J}=c({onSuccess:U,onError:V});d(()=>{let e=new IntersectionObserver(e=>{let t=e[0];B(t?.isIntersecting)},{threshold:.1}),t=E.current;return E.current&&e.observe(E.current),()=>{t&&e.unobserve(t)}},[B]);let K=f(()=>{if(!O?.baseID||!A||!y?.baseID||void 0!==w&&!w||h||j)return;let e=M?.some(e=>e.required&&!e.value);if(T(!0),e)return;let t=M?.filter(e=>!!e.value)?.map(e=>({key:e.key,value:e.value}));p({quantity:A,currency:C,id:y?.baseID,name:y?.title,brand:y?.vendor,sku:O.sku,price:O?.price,variant:O.title});let r={quantity:A,attributes:t,variantId:O.baseID};D?.actionEffect!=="buy-now"&&z?J({cartId:z,lines:[r]}):G({items:[r]})},[h,j,z,C,A,M,w,y?.title,y?.vendor,y?.baseID,O?.sku,O?.price,O?.title,O?.baseID,D?.actionEffect,G,J,T]),N=m(),P=F||H,Q=O?D?.outOfStockLabel:"Unavailable";return{addToCartRef:E,isLoading:P,isInStock:N,notiComponent:L,outOfStockLabel:Q,addToCart:K}};export{useBtnAddToCart};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useMoneyFormat as e,useEditorMode as t,useProduct as r,useCurrentVariant as n,useQuantity as o,
|
|
1
|
+
import{useMoneyFormat as e,useEditorMode as t,useProduct as r,useCurrentVariant as n,useQuantity as o,useFormatMoney as u,useProductBundleDiscount as i,formatMoney as p}from"@gem-sdk/core";import{useMemo as c}from"react";import{applyBundleDiscountAmount as s}from"../../../helpers/product-bundle.js";import{DiscountType as a}from"../../constants/product-bundle.js";let useGpDiscountTag=m=>{let{setting:l,...d}=m,{customContent:g}=l??{},f=d["bundle-item"],{moneyFormat:b}=e(),h=t(),D=r(),$=n(),{quantity:j,hasUpdatePrice:y}=o(),G=c(()=>y&&g?.unit!=="percentage"?j??1:1,[y,g?.unit,j]),P=$?.price??0,T=$?.salePrice??0,k=(T-P)*G,x=u(k<0?0:k,l?.moneyWithCurrentFormat||!1),C=c(()=>{if(!T&&0!==T||!P&&0!==P)return`${g?.unit==="percentage"?"0%":x}`;if(g?.unit==="percentage"){let e=Math.round(k/(T/100));return`${e<0?0:e}%`}return`${x}`},[g?.unit,x,P,k,T]),{useProductCompareAtPrice:F}=i(),{discountPercentAmount:I}=s({currentVariant:$,bundleItem:f,options:{moneyFormat:b,useProductCompareAtPrice:F}}),M=c(()=>{if(!f)return 0;let{discountPercentAmount:e,discountAmount:t}=s({currentVariant:$,bundleItem:f,options:{moneyFormat:b,useProductCompareAtPrice:F}}),{discountType:r}=f,{unit:n}=g||{};return r!==a.NoDiscount||F?"percentage"===n?`${e}%`:t:"percentage"===n?"0%":p("0",b)},[f,$,b,F,g]),N=c(()=>f?M:C,[M,f,C]),W=D?.baseID?.replace("gid://shopify/Product/",""),q=c(()=>{let e=f?I<=0:k<=0;return"edit"===h&&e},[f,I,h,k]);return{mode:h,product:D,salePrice:T,priceSave:k,currentProductId:W,unitCustomDisplay:N,shouldPlaceholderNoDiscount:q}};export{useGpDiscountTag};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import r from"next/dynamic";import d from"../../../common/components/Loading.js";import{useState as l,useMemo as i,useEffect as a}from"react";import{useRenderMode as c,useCurrentDevice as
|
|
1
|
+
import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import r from"next/dynamic";import d from"../../../common/components/Loading.js";import{useState as l,useMemo as i,useEffect as a}from"react";import{useRenderMode as c,useCurrentDevice as n,usePageType as s,usePageStore as u,useFetchHandle as m,hasPublicStoreFrontData as g,createStoreFrontFetcher as h,useProductQuery as p,useProductsQueryAll as P,useProductsQuery as f,useCollectionQuery as b,flattenConnection as k,ProductListProvider as T,filterToolbarPreview as I}from"@gem-sdk/core";import v from"../SalePageProductListWarning.js";import y from"next/head";import O from"./ProductListGridLayout.js";import N from"./ProductListCarouselLayout.js";import{getStyle as S}from"./common/styles.js";import{If as C}from"@gem-sdk/system";import{getClass as E}from"./common/classes.js";import{getData as w}from"./common/helpers.js";import{getPropertyByDevice as L}from"../../../dialog/common/helpers.js";let ProductNotFound=r(()=>import("../ProductNotFound.js"),{loading:d}),ProductList=r=>{let{children:W,styles:j,builderProps:x,setting:G,builderAttrs:M}=r,{isRelatedProduct:B,productSetting:A}=w(r),F=A.relatedTag&&A.relatedTag[0],{isEditMode:Q,isPreviewSharePageMode:z}=c(),D=n(),H=s(),R=u(e=>e.dynamicProduct),$=u(e=>e.dynamicCollection),[_,V]=l(1),[q,U]=l(!0),[J,K]=l(),[X,Y]=l(!1),Z="GP_FUNNEL_PAGE"===H,ee="GP_COLLECTION"==H;ee&&(A.productSrc="DynamicCollection",A.collectionId=$?.collectionId??"latest");let et=A?.productSrc??"Collection",eo=R?.productId&&R?.productId!==A.relatedProductId?R?.productId:A.relatedProductId,er=m(),ed=u(e=>e.publicStoreFrontData),el=i(()=>g(ed)?h(ed):er,[ed]),{data:ei}=p(B&&eo?eo:void 0,{revalidateOnMount:Q||z},el),ea=A.relatedTag&&"tags"===A.relatedTag[0]&&(!ei?.tags||ei?.tags.length===0),ec=A.relatedTag&&"collection"===A.relatedTag[0]&&(!ei?.collections?.edges||ei?.collections.edges.length===0),en=A.relatedTag&&"vendor"===A.relatedTag[0]&&!ei?.vendor,es=ea||ec||en,eu=P(J,{revalidateOnMount:Q||z},el),em=Q||z,eg=f("PickProduct"===et?A?.productIds:void 0,{revalidateOnMount:em},{defaultSelectedProductCount:A?.numOfSelectedProducts}),eh=i(()=>({id:A?.collectionId??"latest",numberOfProducts:G?.numberOfProducts??4,orderBy:G?.orderBy}),[A?.collectionId,Number(G?.numberOfProducts),G?.orderBy]),ep=b("PickProduct"!==et?eh:void 0,{revalidateOnMount:em});a(()=>{if(B&&ei&&A.relatedTag&&"recommended-product"!==A.relatedType){let e;switch(Y(!1),A.hasRelatedExclude&&(e=A?.relatedExclude&&A.relatedExclude.split(",").map(e=>e.trim())),A.relatedTag[0]){case"vendor":K({vendor:A.relatedTag&&"vendor"===A.relatedTag[0]?ei?.vendor:"",limit:G?.numberOfProducts,idNEQ:ei.id});break;case"collection":{let t;let o=ei?.collections?.edges.map(e=>e.node?.id);if(!o||o?.length===0){Y(!0);break}K(t=e&&e.length>0?{idNEQ:ei.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:o},{titleNotIn:e}]}],limit:G?.numberOfProducts}:{idNEQ:ei.id,hasCollectionProductsWith:[{hasCollectionWith:[{idIn:o}]}],limit:G?.numberOfProducts});break}case"tags":{let t;if(!ei.tags||0===ei.tags.length){Y(!0);break}K(t=e&&e.length>0?{idNEQ:ei.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:ei.tags},{nameNotIn:e}]}],limit:G?.numberOfProducts}:{idNEQ:ei.id,hasProductTagsWith:[{hasTagsWith:[{nameIn:ei.tags}]}],limit:G?.numberOfProducts})}}}},[ei,A.relatedType,A.relatedTag,G?.numberOfProducts,A.relatedExclude,A.hasRelatedExclude,B]);let eP="PickProduct"===et?eg.isValidating:ep.isValidating,ef="PickProduct"===et?eg.isLoading:ep.isLoading,eb="PickProduct"===et?eg.error:ep.error,ek=ep.data?.collections?.edges?.[0]?.node,eT="PickProduct"===et?k(eg.data?.products):k(ek?.products),eI=eu?.data?.products?k(eu?.data?.products):void 0,ev=B&&eI?eI:"PickProduct"===et&&A?.productIds?.length?A?.productIds?.map(e=>eT?.find(t=>t?.baseID===e)).filter(Boolean)??eT:"PickProduct"!==et?eT:eT.filter((e,t)=>t<(A?.numOfSelectedProducts??4)),ey=i(()=>X&&B&&Q||!ev.length&&!ef&&q&&Q,[q,ef,X,B,Q,ev.length]),eO=i(()=>!ev||X&&B,[X,B,ev]),eN=i(()=>{if(!G?.sameHeight)return[];let e=0,t=Math.ceil((ev?.length??0)/+(G?.slidesToShow?.[D]??1));return Array.from(Array(ev?.length??0)).map((o,r)=>(r>=+(G?.slidesToShow?.[D]??1)*(e+1)&&++e,{gridRow:`${1+_*e}/${_+1+_*e}`,marginBottom:e+1<t?L(j?.horizontalGutter,D):void 0}))},[G?.sameHeight,G?.slidesToShow,_,ev?.length,D,j?.horizontalGutter]),eS=i(()=>eP||ef||eb||!ev||X&&B,[eb,ef,X,B,eP,ev]);a(()=>{eS||setTimeout(()=>{let{builderData:e}=x??{},t=e?.childrens?.[0];if(!t)return;let o=document.querySelector(`[data-id=${t}] div`);o&&V(o.childElementCount||1)},Q?0:500)},[x,eS,Q]);let eC=i(()=>({collection:ek,products:ev,settings:{loop:G?.loop??{desktop:!1},scrollMode:G?.scrollMode??{desktop:"snap"},slidesToShow:G?.slidesToShow??{desktop:4,tablet:3,mobile:1},layout:j?.layout,dot:G?.dot,dotStyle:G?.dotStyle,arrow:G?.arrow,controlOverContent:G?.controlOverContent},styles:{horizontalGutter:j?.horizontalGutter,verticalGutter:j?.verticalGutter,fullWidth:j?.fullWidth,spacing:j?.spacing,width:j?.width,height:j?.height}}),[ek,ev,G,j]);if(x?.isPreview&&Z)return e(t,{});if(ey)return e(t,{children:C(q,e(ProductNotFound,{builderAttrs:M,collectionHandle:ek?.handle,productSrc:et,onClose:()=>U(!1),children:W,relatedTagString:F,assignProductNoTags:es,noAssignedProduct:!eo}))});let{productListWrapStyle:eE,productListContentStyle:ew,productListWrapAlignStyle:eL}=S(r),{productListWrapClass:eW}=E(r),ej=()=>e(t,{children:C(j?.layout==="grid",e(O,{...r,productSortedById:ev,generateGridRowArray:eN}),e(N,{...r,productSortedById:ev}))});return o("div",{...M,className:eW,style:eE,children:[!!j?.preloadBgImage&&o(y,{children:[!!j.backgroundImage?.desktop?.image?.src&&e("link",{rel:"preload",href:j.backgroundImage.desktop.image.src,as:"image"}),!!j.backgroundImage?.tablet?.image?.src&&e("link",{rel:"preload",href:j.backgroundImage?.tablet?.image?.src,as:"image"}),!!j.backgroundImage?.mobile?.image?.src&&e("link",{rel:"preload",href:j.backgroundImage?.mobile?.image?.src,as:"image"})]}),eP||ef?e(d,{}):eb?o("div",{children:["Error: ",eb?.message]}):eO?e("div",{children:"Products not found"}):e(T,{...eC,children:e("div",{className:"gp-flex gp-w-full",style:eL,children:o("div",{style:ew,children:[Z&&e(v,{}),ej()]})})}),I(W,!0)]})};export{ProductList as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useRef as e,useMemo as r}from"react";import{useTransition as t}from"../../product-variants/common/common.js";import{useEditorMode as c,useQuantity as i,useCurrentVariant as a,useProductBundleDiscount as n,
|
|
1
|
+
import{useRef as e,useMemo as r}from"react";import{useTransition as t}from"../../product-variants/common/common.js";import{useEditorMode as c,useQuantity as i,useCurrentVariant as a,useProductBundleDiscount as n,useInteraction as o,useProduct as u,useShopStore as p,useFormatMoney as d}from"@gem-sdk/core";let useGpPrice=l=>{let{setting:m,builderProps:s}=l,g=e(null),b=c(),{quantity:h,hasUpdatePrice:y}=i(),P=a(),{useProductCompareAtPrice:v}=n(),f=l["bundle-item"],w=P?.price??0,V=P?.salePrice??0,k=m?.priceType==="compare",{trigger:q}=o(),T=u(),x=T?.baseID?.replace("gid://shopify/Product/",""),C=p(e=>e.showPriceCurrency),E=r(()=>f?.quantity?f.quantity:y&&h||1,[h,y,f?.quantity]),G=r(()=>{let e=Number(f?.discountValue);return f?.discountType==="percentage"?w*E*e/100:e},[f?.discountType,f?.discountValue,w,E]),$=r(()=>f?.discountValue?v?(V||w)*E:w*E:V*E,[f?.discountValue,w,E,V,v]),j=r(()=>{let e=w*E;return k?$:G?Math.max(0,e-G):e},[w,E,G,$,k]),D=(e,r)=>{q({event:"price"===r?"gp:rollback:price-change":"gp:rollback:compare-price-change",selector:`[data-id="${s?.uid}"]`,element:g.current}),q({event:"price"===r?"gp:price-change":"gp:compare-price-change",data:e,selector:`[data-id="${s?.uid}"]`,element:g.current})};t(e=>{e!==w&&D(w,"price")},[w]),t(e=>{e!==V&&D(V,"compare")},[V]);let I=()=>{if("edit"!==b)return;let e=new CustomEvent("editor:product-source-no-data-warning",{bubbles:!0,detail:{uid:s?.uid,value:!j&&k,tag:"ProductPrice"}});window.dispatchEvent(e)},M=d(j??0,C||!1),N=k&&!j,z="edit"!==b&&N;return{elementRef:g,moneyFormatted:M,currentProductId:x,isNoComparePrice:N,isNoComparePriceILP:z,emitNoDataSignal:I}};export{useGpPrice};
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import{
|
|
2
|
-
|
|
3
|
-
${
|
|
4
|
-
${v(`{%- assign presets = "${et()}" | split: '($1)' -%}`)}
|
|
5
|
-
${v(`{% assign hiddenPresetOptions = "${ei()}" | split: ',' %}`)}
|
|
1
|
+
import{composeMemo as e,template as t,DEVICES as s,getResponsiveValueByScreen as i,isLocalEnv as a,baseAssetURL as o}from"@gem-sdk/core";import n from"../../../text/components/Text.liquid.js";import r from"./components/variants/index.liquid.js";import p from"./components/dropdown-swatches/Dropdown.liquid.js";import l from"./components/dropdown-group/DropdownGroup.liquid.js";import{getSettingPreloadData as d}from"../../../helpers.js";import{mappingVariantStyles as m}from"./utils/mappingVariantStyles.js";import{createClass as c,createStyle as u,createStateOrContext as g,createAttr as $,Liquid as v,LiquidIf as f,If as y,LiquidFor as _}from"@gem-sdk/system";import{getAttrs as h}from"./common/main/getAttr.js";import{getVariantOptionGroupStyle as S,getWrapperStyle as V}from"./common/main/styles.js";import{getVariantOptionGroupClass as j,getWrapDropdownClass as I}from"./common/main/classes.js";import{getTextVariantTitleData as A,getDropdownGroupData as w}from"./common/main/getData.js";import{getWrapVariantOptionClass as b}from"./common/variants/classes.js";import{getStyleOfObject as P}from"../../helpers/function.js";import{getMarginBottomStyle as T}from"./common/variants/styles.js";let DEFAULT_ADVANCED_DISPLAY_SETTING={desktop:!0,tablet:!0,mobile:!0},ProductVariants=N=>{let{builderProps:D,styles:x,setting:E,advanced:O}=N,{align:U,swatchItemWidth:C,dropdownItemWidth:K,swatchSpacing:q,optionTypo:k,marginBottom:F}=x??{},{label:G,optionType:J,showAsSwatches:L,layout:R,hasPreSelected:W}=E??{},z=O?.d??DEFAULT_ADVANCED_DISPLAY_SETTING,{uid:H}=D??{},M="groupOption"===J,Q=()=>{let e={};return s.forEach(t=>{let s=i(C,t);e[t]="auto"===s}),e},Y=()=>{let e={};return s.forEach(t=>{e[t]=K?.[t]==="fill"}),e},B=e(()=>{let e=m(E?.variantPresets,x);return{...E,variantPresets:e}},[E?.variantPresets,x]),X=e=>{let t={"'":"'",'"':"""},s=e;for(let i in t)e.indexOf(i)>=0&&(s=s.replaceAll(i,t[i]));return s},Z=()=>E?.variantPresets?.map(e=>`${X(e.optionName)}($2)${e.optionType}`).join("($1)"),ee=()=>E?.variantPresets?.filter(e=>!!e?.hide)?.map(e=>e.optionName).join(","),et=c(j(U)),es=u(S(q,q)),ei=A(N,"Liquid"),ea=c(b(R,U)),eo=()=>t`
|
|
2
|
+
${v(`{%- assign presets = "${Z()}" | split: '($1)' -%}`)}
|
|
3
|
+
${v(`{% assign hiddenPresetOptions = "${ee()}" | split: ',' %}`)}
|
|
6
4
|
|
|
7
5
|
${v(`{% assign all_option_names = options | map: 'name' %}
|
|
8
6
|
{% assign filtered_options_string = '' %}
|
|
@@ -29,23 +27,23 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as o,getResponsiv
|
|
|
29
27
|
|
|
30
28
|
${v("{% assign last_option_name = filtered_options_array | last %}")}
|
|
31
29
|
|
|
32
|
-
${
|
|
30
|
+
${_("option in options",`
|
|
33
31
|
<div
|
|
34
32
|
option-name="{{option.name | escape}}"
|
|
35
|
-
class="${
|
|
36
|
-
style="${P(
|
|
33
|
+
class="${ea} ${f("hiddenPresetOptions contains option.name","gp-hidden")}"
|
|
34
|
+
style="${P(T(F))}${v("{% if forloop.last or option.name == last_option_name %}--mb:0;--mb-mobile:0;--mb-tablet:0;{% endif %}")}"
|
|
37
35
|
>
|
|
38
36
|
${v("{%- assign showVariantClass = 'variant-display' -%}")}
|
|
39
37
|
${v("{%- assign optionName = option.name -%}")}
|
|
40
|
-
${
|
|
38
|
+
${_("preset in presets",`
|
|
41
39
|
${v("{%- assign presetDetail = preset | split: '($2)' -%}")}
|
|
42
|
-
${
|
|
40
|
+
${f("presetDetail[1] == 'dropdown' and presetDetail[0] == optionName",`${v("{%- assign showVariantClass = '' -%}")} ${v("{%- break -%}")}`)}
|
|
43
41
|
`)}
|
|
44
|
-
${
|
|
42
|
+
${y(G,n(ei)," ")}
|
|
45
43
|
<div
|
|
46
44
|
variant-option-name="{{option.name | escape}}"
|
|
47
|
-
class="${
|
|
48
|
-
style="${P(
|
|
45
|
+
class="${et}"
|
|
46
|
+
style="${P(es)}"
|
|
49
47
|
>
|
|
50
48
|
${v("{%- assign values = option.values -%}")}
|
|
51
49
|
${v("{%- assign rootForloop = forloop.index0 -%}")}
|
|
@@ -58,24 +56,76 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as o,getResponsiv
|
|
|
58
56
|
{%- assign selectedValue = variant.option3 -%}
|
|
59
57
|
{%- endif -%}
|
|
60
58
|
`)}
|
|
61
|
-
${
|
|
62
|
-
${
|
|
59
|
+
${y(!W,v("{%- assign selectedValue = null -%}"),"")}
|
|
60
|
+
${y(L,er(),ep())}
|
|
63
61
|
</div>
|
|
64
62
|
</div>`)}
|
|
65
|
-
`,
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
63
|
+
`,en=E?.variantPresets?.map(e=>({name:X(e.optionName),type:e.optionType})).map(e=>`${e.name}($1)${e.type}`).join("($2)").toString(),er=()=>t`
|
|
64
|
+
${v("{%- assign optionRendered = false -%}")}
|
|
65
|
+
${v("{%- assign swatches = shop.metafields.GEMPAGES.swatches -%}")}
|
|
66
|
+
${v("{%- assign swatchesItems = swatches | split: '($1)' -%}")}
|
|
67
|
+
|
|
68
|
+
${_("swatchesItem in swatchesItems",`
|
|
69
|
+
${v('{%- assign colorArraysString = "" -%}')}
|
|
70
|
+
${v('{%- assign labelsString = "" -%}')}
|
|
71
|
+
${v('{%- assign imageUrlsString = "" -%}')}
|
|
72
|
+
${v("{%- assign attrItems = swatchesItem | split: '($3)' -%}")}
|
|
73
|
+
|
|
74
|
+
${_("attrItem in attrItems",`${v("{%- assign attrs = attrItem | split: '($2)' -%}")}
|
|
75
|
+
${v("{%- assign optionKey = attrs[0] -%}")}
|
|
76
|
+
${v("{%- assign optionValue = attrs[1] -%}")}
|
|
77
|
+
${v(`
|
|
78
|
+
{% if optionKey == 'optionTitle' %}
|
|
79
|
+
{% assign optionTitle = optionValue %}
|
|
80
|
+
{% elsif optionKey == 'optionType' %}
|
|
81
|
+
{% assign optionType = optionValue %}
|
|
82
|
+
{% endif %}
|
|
83
|
+
`)}
|
|
84
|
+
|
|
85
|
+
${f("optionKey == 'optionValues'",`${v("{%- assign opValueItems = optionValue | split: '($4)' -%}")}
|
|
86
|
+
${_("opValueItem in opValueItems",`${v("{%- assign opValueItemAttrs = opValueItem | split: '($6)' -%}")}
|
|
87
|
+
${_("opValueItemAttr in opValueItemAttrs",`${v("{%- assign attrs = opValueItemAttr | split: '($5)' -%}")}
|
|
88
|
+
${v("{%- assign opValueItemKey = attrs[0] -%}")}
|
|
89
|
+
${v("{%- assign opValueItemValue = attrs[1] -%}")}
|
|
90
|
+
|
|
91
|
+
${f("opValueItemKey == 'label'",`${v("{%- assign labelsString = labelsString | append: opValueItemValue -%}")}${v('{%- assign labelsString = labelsString | append: "($8)" -%}')}`)}
|
|
92
|
+
|
|
93
|
+
${f("opValueItemKey == 'colors'",`${v("{%- assign colorArraysString = colorArraysString | append: opValueItemValue -%}")}${v('{%- assign colorArraysString = colorArraysString | append: "($8)" -%}')}`)}
|
|
94
|
+
|
|
95
|
+
${f("opValueItemKey == 'imageUrl'",`${v("{%- assign imageUrlsString = imageUrlsString | append: opValueItemValue -%}")}${v('{%- assign imageUrlsString = imageUrlsString | append: "($8)" -%}')}`)}`)}`)}`)}
|
|
96
|
+
`)}
|
|
97
|
+
|
|
98
|
+
${v("{%- assign labels = labelsString | split: '($8)' -%}")}
|
|
99
|
+
${v("{%- assign colorStrings = colorArraysString | split: '($8)' -%}")}
|
|
100
|
+
${v("{%- assign imageUrls = imageUrlsString | split: '($8)' -%}")}
|
|
101
|
+
|
|
102
|
+
${f("optionTitle == option.name",`
|
|
103
|
+
${v(`{%- assign variantPresetString = "${en}" -%}`)}
|
|
104
|
+
${v('{%- assign optionName = option.name | replace: "\'", "'" | replace: \'"\', """ -%}')}
|
|
105
|
+
${v("{%- assign items = variantPresetString | split:'($2)' -%}")}
|
|
106
|
+
${v("{%- assign type = 'dropdown' -%}")}
|
|
107
|
+
${_("item in items",`
|
|
108
|
+
${v("{%- assign itemPreset = item | split:'($1)' -%}")}
|
|
109
|
+
${f("itemPreset[0] == optionName",v("{%- assign type = itemPreset[1] -%}"))}
|
|
110
|
+
${f('itemPreset[0] == "base"',v("{%- assign type = itemPreset[1] -%}"))}
|
|
111
|
+
`)}
|
|
112
|
+
${v("{%- assign optionRendered = true -%}")}
|
|
113
|
+
${_("value in values",r({id:"{{option.name | escape}}-{{value | escape}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:L,uid:H,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:W?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",optionType:"optionType",activeClass:W?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...x,...B,swatchAutoWidth:Q(),optionTypo:k}))}
|
|
114
|
+
${f("type == 'dropdown'",p({...x,...B,swatchAutoWidth:Y(),optionTypo:k}))}
|
|
115
|
+
`)}
|
|
116
|
+
`)}
|
|
117
|
+
|
|
118
|
+
${f("optionRendered == false",ep())}
|
|
119
|
+
`,ep=()=>_("value in values",r({id:"{{option.name | escape}}-{{value | escape}}",variantKey:"{{option.name | escape}}-{{option.position}}-{{ forloop.index }}",showAsSwatches:L,uid:H,name:"{{option.name | escape}}",value:{label:"{{value | escape}}"},checked:W?"{%- if option.selected_value == value -%}true{% else %}false{%- endif -%}":"false",optionPosition:"rootForloop",typeOfOption:"optionType",activeClass:W?"{%- if option.selected_value == value -%}option-item-active{%- endif -%}":"",...x,...B,swatchAutoWidth:Q(),optionTypo:k,isRenderDefault:!0})),el=c(I(U)),ed=w(N),em=()=>`
|
|
120
|
+
<div className="${el}">
|
|
121
|
+
${l(ed)}
|
|
70
122
|
</div>
|
|
71
|
-
`,
|
|
72
|
-
${v("{%- assign total_combinations = 1 -%}")}
|
|
73
|
-
${f("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
|
|
123
|
+
`;g({setting:B,styles:JSON.stringify(x),variants:"{{ product.variants | json | escape }}",optionsWithValues:"{{ product.options_with_values | json | escape }}",variantSelected:"{{ variant | json | escape }}",variantInventoryQuantity:"{{ product.variants | map: 'inventory_quantity' | json | escape }}",variantInventoryPolicy:"{{ product.variants | map: 'inventory_policy' | json | escape }}",moneyFormat:"{{ shop.money_format | json | escape }}",productId:"{{ product.id | json | escape }}",productUrl:"{{ product.url | json | escape }}",productHandle:"{{ product.handle | json | escape }}",displayState:`${JSON.stringify(z)}`,totalVariantCombinations:"{{ total_combinations }}",firstAvailableVariant:"{{ product.selected_or_first_available_variant | json | escape }}"});let ec=$(h({uid:H,hasPreSelected:W,cssClass:O?.cssClass})),eu=u(V(N)),eg=c({"gp-flex gp-flex-col !gp-ml-0":!0}),e$=()=>{let e=a?"{{ 'gp-product-variant-v7-5.js' | asset_url }}":`${o}/assets-v2/gp-product-variant-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}`;return`<script ${d('class="gps-link" delay',"src")}="${e}" defer="defer"></script>`};return t`
|
|
74
124
|
<gp-product-variants
|
|
75
|
-
${
|
|
125
|
+
${ec}
|
|
76
126
|
gp-data='{
|
|
77
|
-
"setting":${JSON.stringify(
|
|
78
|
-
"styles":${JSON.stringify(
|
|
127
|
+
"setting":${JSON.stringify(B)?.replaceAll("'","'")},
|
|
128
|
+
"styles":${JSON.stringify(x)},
|
|
79
129
|
"variants":{{product.variants | json | escape}},
|
|
80
130
|
"optionsWithValues": {{product.options_with_values | json | escape}},
|
|
81
131
|
"variantSelected": {{ variant | json | escape }},
|
|
@@ -85,7 +135,7 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as o,getResponsiv
|
|
|
85
135
|
"productId": {{product.id | json | escape}},
|
|
86
136
|
"productUrl": {{product.url | json | escape}},
|
|
87
137
|
"productHandle": {{product.handle | json | escape}},
|
|
88
|
-
"displayState": ${JSON.stringify(
|
|
138
|
+
"displayState": ${JSON.stringify(z)},
|
|
89
139
|
"totalVariantCombinations": {{total_combinations}},
|
|
90
140
|
"firstAvailableVariant": {{product.selected_or_first_available_variant | json | escape}}
|
|
91
141
|
}
|
|
@@ -93,13 +143,13 @@ import{template as e,isLocalEnv as t,baseAssetURL as i,DEVICES as o,getResponsiv
|
|
|
93
143
|
<div class="gp-hidden" style="--hvr-shadow: none; --hvr-shadow-tablet: none; --hvr-shadow-mobile: none"></div>
|
|
94
144
|
${v("{%- assign options = product.options_with_values -%}")}
|
|
95
145
|
${v("{%- assign variants = product.variants -%}")}
|
|
96
|
-
${
|
|
97
|
-
class="${
|
|
98
|
-
style="${
|
|
146
|
+
${f("options.size == 0 or options.size == 1 and variants.size == 1 and variants[0].title == 'Default Title' and variants[0].option1 == 'Default Title'","<div></div>",t`<div
|
|
147
|
+
class="${eg}"
|
|
148
|
+
style="${eu}"
|
|
99
149
|
>
|
|
100
|
-
${
|
|
150
|
+
${y(M,em(),eo())}
|
|
101
151
|
</div>`)}
|
|
102
152
|
</gp-product-variants>
|
|
103
153
|
|
|
104
|
-
${
|
|
154
|
+
${e$()}
|
|
105
155
|
`};export{ProductVariants as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{composeTypographyStyle as e,getRadiusStyleActiveState as t,getStyleShadow as o,makeStyle as r,getSingleColorVariable as l,composeRadius as i,getGlobalColorStateStyle as p,handleConvertBorderStyle as a,handleConvertBorderWidth as n,handleConvertBorderColor as d,makeStyleResponsive as h}from"@gem-sdk/core";import{filterTruthyObject as c}from"../../../../../helpers.js";let getColorStyleWidth=e=>{let t=e?.height||"32px",o=e?.width||{desktop:t},r=Object.fromEntries(Object.entries(o).map(([e,o])=>{let r=o&&"undefined"!==o&&"auto"!==o?o:t;return[e,r]}));return h("minw",r)},getWrapperStyleActive=i=>{let{preset:p,optionTypography:a,optionTypo:n,typeOfOption:d}=i,h=p?.optionBgColor,
|
|
1
|
+
import{composeTypographyStyle as e,getRadiusStyleActiveState as t,getStyleShadow as o,makeStyle as r,getSingleColorVariable as l,composeRadius as i,getGlobalColorStateStyle as p,handleConvertBorderStyle as a,handleConvertBorderWidth as n,handleConvertBorderColor as d,makeStyleResponsive as h}from"@gem-sdk/core";import{filterTruthyObject as c}from"../../../../../helpers.js";let getColorStyleWidth=e=>{let t=e?.height||"32px",o=e?.width||{desktop:t},r=Object.fromEntries(Object.entries(o).map(([e,o])=>{let r=o&&"undefined"!==o&&"auto"!==o?o:t;return[e,r]}));return h("minw",r)},getWrapperStyleActive=i=>{let{preset:p,optionTypography:a,optionTypo:n,typeOfOption:d}=i,h=p?.optionBgColor,g=p?.optionTextColor,s=p?.optionBorder,b=p?.optionHasShadow,m=p?.optionShadow,u=p?.optionRounded,w="color"===d,x="image"===d||"image_shopify"===d,y=e(n,a),S=e=>{let t=h?.active??h?.normal,o=s?.active??s?.normal;return r({bg:e&&l(t),bs:o?.border,bw:o?.width,bc:l(o?.color)})},v=m?.active??m?.normal,C=b?.active??b?.normal,f=g?.active??g?.normal;return c({...S(!w),...t(u),...o({value:v,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:C},!0),...y,...!w&&!x&&r({c:l(f)}),...w&&getColorStyleWidth(p),...r({h:p?.height})})},getWrapperStyleNormalAndHover=e=>{let{preset:t,optionTransform:l,optionTypography:h,optionTypo:g,typeOfOption:s}=e,b=t?.optionBgColor,m=t?.optionTextColor,u=t?.optionBorder,w=t?.optionHasShadow,x=t?.optionShadow,y=t?.optionRounded,S="color"===s,v="image"===s||"image_shopify"===s,C=["normal","hover"].reduce((e,t)=>({...e,...o({value:x?.[t],state:t,styleAppliedFor:"box-shadow",isEnableShadow:w?.[t]})}),{});return c({...i(y),...C,...!S&&p("bg",b),...!S&&a(u),...!S&&n(u),...!S&&d(u),...!S&&!v&&r({c:l}),...!S&&!v&&p("c",m),...typoStyleNotIn(g,h,["--c"]),...S&&getColorStyleWidth(t),...r({h:t?.height})})};function typoStyleNotIn(t,o,r){let l=e(t,o);return r&&0!==r.length?Object.fromEntries(Object.entries(l).filter(([e])=>!r.includes(e))):l}let getWrapperTextStyle=e=>{let{preset:o,typeOfOption:r,checked:l}=e,p=o?.optionBorder,h=o?.optionRounded,g="color"===r,s=()=>{let e="16px",t={"--pl":"0px","--pr":"0px","--pl-tablet":"0px","--pr-tablet":"0px","--pl-mobile":"0px","--pr-mobile":"0px","--pt":"0px","--pb":"0px"};return o?.width?.desktop?.toLowerCase()!=="auto"&&o?.width?.desktop||(t["--pl"]=e,t["--pr"]=e),o?.width?.tablet?.toLowerCase()!=="auto"&&o?.width?.tablet||(t["--pl-tablet"]=e,t["--pr-tablet"]=e),o?.width?.mobile?.toLowerCase()!=="auto"&&o?.width?.mobile||(t["--pl-mobile"]=e,t["--pr-mobile"]=e),(o?.height?.toLowerCase()==="auto"||o?.height)&&(t["--pt"]="8px",t["--pb"]="8px"),t},b={...h,active:{...h?.active||{},radiusType:"custom"}},m=l?t(b):i(h),u=!l&&g?{...a(p),...n(p),...d(p)}:{};return c({...!g&&s(),...g&&m,...u})},getColorStyle=({optionBorder:e,optionRounded:t,isActive:o,color:r})=>{let l=()=>r?r?.startsWith("linear-gradient")?{backgroundImage:r}:{backgroundColor:r}:{},p=t=>t?{"--bs":"none"}:a(e),h=o=>({"--d":"flex","--jc":"center"," --ai":"center","--w":"100%","--h":"100%","--of":"hidden",...p(o),...n(e),...d(e),...i(t),...l()});return h(!!o)},getTextStyle=({optionTypo:t,optionTypography:o})=>{let r=e(t,o);return delete r["--c"],c({...r})};export{getColorStyle,getTextStyle,getWrapperStyleActive,getWrapperStyleNormalAndHover,getWrapperTextStyle};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{template as o}from"@gem-sdk/core";import
|
|
1
|
+
import{template as o}from"@gem-sdk/core";import l from"../base/base.liquid.js";import{optionRoundedColorDefault as r}from"../../utils/mappingVariantStyles.js";let ColorVariant=({isVariantOutStock:i,swatchValue:s,...n})=>o`
|
|
2
2
|
{% assign colorsString = null %}
|
|
3
3
|
{% assign colors = null %}
|
|
4
4
|
{% for label in labels %}
|
|
@@ -7,7 +7,7 @@ import{template as o}from"@gem-sdk/core";import r from"../base/base.liquid.js";i
|
|
|
7
7
|
{% endif %}
|
|
8
8
|
{% endfor %}
|
|
9
9
|
{% if colorsString != null %}
|
|
10
|
-
{% assign colors = colorsString | split: '$
|
|
10
|
+
{% assign colors = colorsString | split: '($7)' %}
|
|
11
11
|
{% endif %}
|
|
12
|
-
${
|
|
12
|
+
${l({...n,typeOfOption:"color",optionRounded:r})}
|
|
13
13
|
`;export{ColorVariant as default};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as
|
|
1
|
+
import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as o}from"@gem-sdk/core";import r from"../../../grid/components/row/Row.liquid.js";import{LiquidIf as a,If as n,Liquid as d,LiquidFor as s}from"@gem-sdk/system";import{getSettingPreloadData as c,getStaticLocale as p}from"../../../helpers.js";import{getData as l,DYNAMIC_PRODUCT_STATUS as u,STATIC_PRODUCT_STATUS as f,PRODUCT_ID_LATEST as m}from"./common/helpers.js";let Product=g=>{let{children:_,setting:v,style:y,builderProps:$,rawChildren:b,advanced:I}=g,{isSyncProduct:S}=v??{},{rowSetting:j,rowStyles:h,formatVariantId:q,formatProductId:V,productStatus:P,preSelectedOptionIds:k,productHandle:w,advancedStyle:E}=l(g),x=()=>t`
|
|
2
2
|
{%- liquid
|
|
3
3
|
if request.page_type == 'product'
|
|
4
|
-
if '${
|
|
5
|
-
if '${
|
|
4
|
+
if '${P}' == '${f}'
|
|
5
|
+
if '${V}' == '${m}'
|
|
6
6
|
paginate collections.all.products by 100000
|
|
7
7
|
assign product = collections.all.products | sort: 'created_at' | reverse | first
|
|
8
8
|
endpaginate
|
|
9
9
|
else
|
|
10
|
-
assign product = all_products['${
|
|
11
|
-
assign productId = '${
|
|
10
|
+
assign product = all_products['${w}']
|
|
11
|
+
assign productId = '${V}' | times: 1
|
|
12
12
|
if product == empty or product == null
|
|
13
13
|
paginate collections.all.products by 100000
|
|
14
14
|
for item in collections.all.products
|
|
@@ -21,13 +21,13 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
|
|
|
21
21
|
endif
|
|
22
22
|
endif
|
|
23
23
|
else
|
|
24
|
-
if '${
|
|
24
|
+
if '${V}' == '${m}'
|
|
25
25
|
paginate collections.all.products by 100000
|
|
26
26
|
assign product = collections.all.products | sort: 'created_at'| reverse | first
|
|
27
27
|
endpaginate
|
|
28
28
|
else
|
|
29
|
-
assign product = all_products['${
|
|
30
|
-
assign productId = '${
|
|
29
|
+
assign product = all_products['${w}']
|
|
30
|
+
assign productId = '${V}' | times: 1
|
|
31
31
|
if product == empty or product == null
|
|
32
32
|
paginate collections.all.products by 100000
|
|
33
33
|
for item in collections.all.products
|
|
@@ -40,11 +40,11 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
|
|
|
40
40
|
endif
|
|
41
41
|
endif
|
|
42
42
|
-%}
|
|
43
|
-
`,
|
|
43
|
+
`,A=()=>t`
|
|
44
44
|
{%- liquid
|
|
45
45
|
if request.page_type != 'product'
|
|
46
|
-
assign product = all_products['${
|
|
47
|
-
assign productId = '${
|
|
46
|
+
assign product = all_products['${w}']
|
|
47
|
+
assign productId = '${V}' | times: 1
|
|
48
48
|
if product == empty or product == null
|
|
49
49
|
paginate collections.all.products by 100000
|
|
50
50
|
for item in collections.all.products
|
|
@@ -56,30 +56,32 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
|
|
|
56
56
|
endif
|
|
57
57
|
endif
|
|
58
58
|
-%}
|
|
59
|
-
`,
|
|
59
|
+
`,B=()=>t`
|
|
60
60
|
{%- assign gpBkProduct = product -%}
|
|
61
|
-
${
|
|
62
|
-
`,
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
61
|
+
${n(P==u,A(),x())}
|
|
62
|
+
`,G=()=>t`
|
|
63
|
+
${d("{%- assign total_combinations = 1 -%}")}
|
|
64
|
+
${s("option in product.options_with_values","{%- assign total_combinations = total_combinations | times: option.values.size -%}")}
|
|
65
|
+
{%- assign initVariantId = ${q} -%}
|
|
66
|
+
{%- assign product_form_id = 'product-form-' | append: "${$?.uid}" -%}
|
|
67
|
+
${q?"{%- assign variant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign variant = product.selected_or_first_available_variant -%}"}
|
|
68
|
+
${q?"{%- assign productSelectedVariant = product.variants | where: 'id', initVariantId | first -%}":"{%- assign productSelectedVariant = product.selected_or_first_available_variant -%}"}
|
|
67
69
|
{%-if productSelectedVariant == empty or productSelectedVariant == null -%}
|
|
68
70
|
{%- assign productSelectedVariant = product.selected_or_first_available_variant -%}
|
|
69
71
|
{%- endif -%}
|
|
70
72
|
{%-if variant == empty or variant == null -%}
|
|
71
73
|
{%- assign variant = product.selected_or_first_available_variant -%}
|
|
72
74
|
{%- endif -%}
|
|
73
|
-
`,
|
|
74
|
-
<div class="gp-text-center">${
|
|
75
|
-
`,
|
|
76
|
-
${
|
|
75
|
+
`,H=()=>t`
|
|
76
|
+
<div class="gp-text-center">${p("Product","product_not_found")}</div>
|
|
77
|
+
`,O=()=>t`
|
|
78
|
+
${G()}
|
|
77
79
|
<gp-product
|
|
78
|
-
data-uid="${
|
|
79
|
-
data-id="${
|
|
80
|
-
style="${
|
|
81
|
-
class="${
|
|
82
|
-
gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${
|
|
80
|
+
data-uid="${$?.uid}"
|
|
81
|
+
data-id="${$?.uid}"
|
|
82
|
+
style="${E}"
|
|
83
|
+
class="${I?.cssClass}"
|
|
84
|
+
gp-context='{"productId": {{ product.id }}, "preSelectedOptionIds": [${k}], "isSyncProduct": "${S}", "variantSelected": {{ variant | json | escape }}, "inventory_management": {{ variant.inventory_management | json | escape }}, "inventory_policy": {{ variant.inventory_policy | json | escape }}, "inventoryQuantity": {{ variant.inventory_quantity }}, "quantity": 1, "formId": "{{ product_form_id }}" }'
|
|
83
85
|
gp-data='{"variantSelected": {{ variant | json | escape }}, "quantity": 1, "productUrl":{{ product.url | json | escape }}, "productHandle":{{ product.handle | json | escape }}, "collectionUrl": {{ collection.url | json | escape }}, "collectionHandle": {{ collection.handle | json | escape }}}'
|
|
84
86
|
>
|
|
85
87
|
<product-form class="product-form">
|
|
@@ -87,13 +89,13 @@ import{template as t,RenderIf as e,isLocalEnv as i,baseAssetURL as r}from"@gem-s
|
|
|
87
89
|
<input type="hidden" name="id" value="{{ variant.id }}" />
|
|
88
90
|
<input type="hidden" name="quantity" value="{{ quantity }}" />
|
|
89
91
|
<button type="submit" onclick="return false;" style="display:none;"></button>
|
|
90
|
-
${
|
|
92
|
+
${r({builderProps:{...$,uid:$?.uid,uidInteraction:`${$?.uid}-row`},style:y,styles:h,setting:j,children:_,rawChildren:b})}
|
|
91
93
|
{%- endform -%}
|
|
92
94
|
</product-form>
|
|
93
95
|
</gp-product>
|
|
94
96
|
{%- assign product = gpBkProduct -%}
|
|
95
97
|
`;return t`
|
|
96
|
-
${
|
|
97
|
-
${a("product != empty and product != null",
|
|
98
|
-
${e(i,`<script ${
|
|
98
|
+
${B()}
|
|
99
|
+
${a("product != empty and product != null",O(),H())}
|
|
100
|
+
${e(i,`<script ${c('class="gps-link" delay',"src")}="{{ 'gp-product-v7-5.js' | asset_url }}" defer="defer"></script>`,`<script ${c('class="gps-link" delay',"src")}="${o}/assets-v2/gp-product-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
|
|
99
101
|
`};export{Product as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{formatMoney as t}from"@gem-sdk/core";import{DiscountType as e}from"../components/constants/product-bundle.js";let noDiscount=e=>({discountPercentAmount:0,discountAmount:t("0",e)}),applyBundleDiscountAmount=n=>{let{currentVariant:o,bundleItem:u,options:c}=n;if(!c?.useProductCompareAtPrice&&u?.discountType===e.NoDiscount||!u||!o?.price)return noDiscount(c?.moneyFormat||"${{amount}}");let r=Number(o?.price),i=Number(o?.salePrice)||r,a=Number(u?.quantity),m=calculateBundleFixedDiscount(r,u),s=discountPercentAmount(m,a*r),d=r*a-m,l=i*a;return i<=r&&m<=0?noDiscount(c?.moneyFormat||"${{amount}}"):{discountPercentAmount:c?.useProductCompareAtPrice?calculateDiffPercentPrice(d,l):s,discountAmount:c?.useProductCompareAtPrice?calculateDiffFixedPrice(d,l,c?.moneyFormat):t(m.toString(),c?.moneyFormat)}},calculateDiffPercentPrice=(t,e)=>{let n=(e-t)/e*100;return Math.round(n)},calculateDiffFixedPrice=(e,n,o)=>t((n-e).toString(),o),calculateBundleFixedDiscount=(t,n)=>{let o=parseInt(n?.discountValue);return n?.discountType===e.Percentage?t*n.quantity*o/100:n?.discountType===e.FixedAmount?o:0},discountPercentAmount=(t,e)=>Math.round(t/e*100);export{applyBundleDiscountAmount};
|
package/dist/types/index.d.ts
CHANGED