@ikas/storefront 4.15.0-beta.61 → 4.15.0-beta.63

package/build/components/checkout/components/offer-product/index.js

@@ -1 +1 @@
-import*as e from"react";import{observer as t}from"mobx-react-lite";import{CheckoutStep as n}from"../../model.js";import{Button as a}from"../button/index.js";import i from"./select/index.js";import o from"../svg/cross.js";import{useTranslation as r}from"../../../../utils/i18n.js";import c from"./style.module.scss.js";var s=function(t){var a,i,o=t.seconds,s=t.onFinish,u=t.campaignOffer,d=t.vm,f=t.isPopupClosed,m=t.step,p=r().t,v=e.useState(o),g=v[0],C=v[1];e.useEffect((function(){C(o)}),[o]),e.useEffect((function(){var e=setInterval((function(){g>0?C(g-1):(clearInterval(e),s())}),1e3);return function(){return clearInterval(e)}}),[g]);var S=u.offer.countdownMinutes&&(m!==n.SUCCESS?!!(null===(a=d.customizationProps)||void 0===a?void 0:a.campaignOfferCountdownStyleIsLine):!!(null===(i=d.customizationProps)||void 0===i?void 0:i.campaignOfferCountdownStyleIsLineSuccessPage))||f;return e.createElement("div",{className:S?c.CountdownContainerIsLine:c.CountdownContainer},e.createElement("div",{className:c.CountdownTextMain},!S&&e.createElement("span",{className:c.CountdownText},p("checkout-page:timeRemaining")),e.createElement("span",{className:c.CountdownTime},l(g))))},l=function(e){var t=Math.floor(e/60/60),n=Math.floor(e/60)-60*t,a=e%60;return 0!==t?t.toString().padStart(2,"0")+":":n.toString().padStart(2,"0")+":"+a.toString().padStart(2,"0")},u=t((function(t){var l,u,d,f,m,p,v,g=t.vm,C=t.campaignOffer,S=t.index,h=t.activeIndex,E=t.offersLength,P=t.handleNext,I=t.handlePrev,O=t.setActiveIndex,w=t.isPopupShow,V=t.closePopup,N=t.showPopup,M=t.isPopupClosed,B=t.desktopMiddlePhase,j=t.step,k=r().t,x=C.product,y=j!==n.SUCCESS?!!(null===(l=g.customizationProps)||void 0===l?void 0:l.campaignOfferIsSmallDesign)&&w:!!(null===(u=g.customizationProps)||void 0===u?void 0:u.showCampaignIsBiggerImage)&&j===n.SUCCESS,D=e.useRef(null),L=e.useRef(null),A=e.useRef(null),T=e.useState(0),z=T[0],R=T[1];e.useEffect((function(){var e,t,a,i,o,r,c,s;if(void 0!==typeof window){var l=.8*window.innerHeight,u=0,d=0,f=0;D.current&&(u=null===(t=null===(e=D.current)||void 0===e?void 0:e.getBoundingClientRect())||void 0===t?void 0:t.height),L.current&&(d=null===(i=null===(a=L.current)||void 0===a?void 0:a.getBoundingClientRect())||void 0===i?void 0:i.height),A.current&&(f=null===(r=null===(o=A.current)||void 0===o?void 0:o.getBoundingClientRect())||void 0===r?void 0:r.height);var m=(j===n.SUCCESS?null===(c=g.customizationProps)||void 0===c?void 0:c.campaignOfferCountdownStyleIsLineSuccessPage:null===(s=g.customizationProps)||void 0===s?void 0:s.campaignOfferCountdownStyleIsLine)?25:70,p=navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)?20:0;R(l-u-d-f-p-m)}}),[w]);var U=e.useState(null),b=U[0],F=U[1],H=e.useState(null),X=H[0],q=H[1],G=e.useMemo((function(){var e,t,n,a,i,o,r,c=null===(e=x.selectedVariant.images)||void 0===e?void 0:e.filter((function(e){return!e.isVideo}));return(null===(t=x.selectedVariant.mainImage)||void 0===t?void 0:t.isVideo)&&(null==c?void 0:c.length)?null===(n=c[0].image)||void 0===n?void 0:n.thumbnailSrc:y||B?null===(i=null===(a=x.selectedVariant.mainImage)||void 0===a?void 0:a.image)||void 0===i?void 0:i.getSrc(360):null===(r=null===(o=x.selectedVariant.mainImage)||void 0===o?void 0:o.image)||void 0===r?void 0:r.thumbnailSrc}),[x.selectedVariant,y,B]),J=e.useMemo((function(){if(!C.offer.countdownMinutes||!C.campaignOffer.offerStartDate)return 0;var e=Math.round(((new Date).getTime()-new Date(C.campaignOffer.offerStartDate).getTime())/1e3);return e>60*C.offer.countdownMinutes?0:60*C.offer.countdownMinutes-e}),[C]),K=function(e){O(0),g.updateCartCampaignOffer({accepted:e,cartId:g.checkout.id,campaignOfferId:C.campaignOffer.campaignOfferId,campaignOfferProductId:C.offer.id,productId:C.offer.productId,variantId:x.selectedVariant.id})},Q=function(){K(!0)},W=function(){K(!1)},Y=C.offer.countdownMinutes&&(j!==n.SUCCESS?!!(null===(d=g.customizationProps)||void 0===d?void 0:d.campaignOfferCountdownStyleIsLine):!!(null===(f=g.customizationProps)||void 0===f?void 0:f.campaignOfferCountdownStyleIsLineSuccessPage))||M&&C.offer.countdownMinutes;return e.createElement("div",{style:{transform:"translateX(-".concat(100*h,"%)")},className:[c.Container,S===h?c.ActiveOffer:"",w?c.PopupContainer:"",B?c.PopupContainerDesktop:"",j===n.SUCCESS?c.Border:""].join(" ")},C.offer.countdownMinutes&&(j!==n.SUCCESS?!(null===(m=g.customizationProps)||void 0===m?void 0:m.campaignOfferCountdownStyleIsLine):!(null===(p=g.customizationProps)||void 0===p?void 0:p.campaignOfferCountdownStyleIsLineSuccessPage))&&!M&&e.createElement(s,{seconds:J,onFinish:W,vm:g,campaignOffer:C,step:j}),e.createElement("div",{onTouchStart:function(e){q(null),F(e.targetTouches[0].clientX)},onTouchMove:function(e){return q(e.targetTouches[0].clientX)},onTouchEnd:function(){if(b&&X&&E>1){var e=b-X,t=e>50;(t||e<-50)&&(t?P():I())}},className:[c.ContentContainer,E>1?c.ContentContainerItems:"",M?E>1?c.ContentContainerPopup:c.ContentContainerPopupItems:""].join(" ")},!!w&&e.createElement("div",{className:c.RejectButton,onClick:function(){return V&&V()}},e.createElement(o,null)),e.createElement("div",{ref:D,className:[c.HeaderMain,y&&!M?c.IsBigProductImage:"",Y?c.IsLineCountDown:"",M?c.MobileSmallHeader:""].join(" ")},e.createElement("div",{className:c.Header},e.createElement("div",{className:c.Title},C.offer.title),!!C.offer.description&&!M&&e.createElement("div",{className:c.Description},C.offer.description)),Y&&e.createElement(s,{seconds:J,onFinish:W,vm:g,campaignOffer:C,isPopupClosed:M,step:j})),e.createElement("div",{className:[c.ProductContainer,y&&!M?c.IsLineProductContainer:""].join(" ")},e.createElement("div",{style:w?{width:z,height:z}:{},className:[c.ImageContainer,y&&!M?c.BigImage:"",M?c.SmallImage:"",B?c.BiggerImage:""].join(" ")},e.createElement("img",{className:c.Image,src:G})),e.createElement("div",{ref:L,className:c.ProductDetails},e.createElement("div",{className:c.ProductName},x.name),x.hasVariant&&1===x.variants.length&&e.createElement("div",{className:c.VariantName},x.selectedVariant.variantValues.map((function(e){return e.name})).join(", ")),!(null===(v=g.customizationProps)||void 0===v?void 0:v.showCampaignHideDiscountBadge)&&x.selectedVariant.price.hasDiscount&&e.createElement("span",{className:c.DiscountBadge},"%",x.selectedVariant.price.discountPercentage," ",k("checkout-page:discount")),e.createElement("div",{className:c.ProductPriceMain},x.selectedVariant.price.hasDiscount&&e.createElement("span",{className:c.Discount},x.selectedVariant.price.formattedSellPrice," "),e.createElement("span",{className:c.ProductPrice},x.selectedVariant.price.formattedFinalPrice)),!M&&x.variants.length>1&&e.createElement("div",{className:c.Actions},x.variants.length>1&&e.createElement(i,{value:x.selectedVariant.id,onSelectChange:function(e){var t=null;x.displayedVariantTypes.forEach((function(n){n.displayedVariantValues.forEach((function(n){n.variant.id===e&&(t=n.variantValue)}))})),t&&x.selectVariantValue(t,!0)},options:x.variants.map((function(e){return{label:e.variantValues.map((function(e){return e.name})).join(", "),value:e.id}}))})),!!M&&e.createElement(a,{classes:[c.OfferButton,y?c.OfferAcceptButton:"",c.PopupOfferButton].join(" "),text:k("checkout-page:actions.acceptOffer"),onClick:function(){x.hasVariant?N&&N():Q()}}),!!B&&e.createElement("div",{className:[c.OfferActionsMain,y?c.OfferActionsMainBigImage:"",c.OfferActionsMainMiddlePhase].join(" ")},e.createElement(a,{classes:c.OfferButton,isLine:!0,text:k("checkout-page:actions.rejectOffer"),onClick:W}),e.createElement(a,{classes:[c.OfferButton,y?c.OfferAcceptButton:""].join(" "),text:e.createElement("div",null,e.createElement("span",null,k("checkout-page:actions.acceptOffer")),e.createElement("span",null),e.createElement("span",null,x.selectedVariant.price.formattedFinalPrice)),onClick:Q})))),!(M||B)&&e.createElement("div",{ref:A,className:[c.OfferActionsMain,y?c.OfferActionsMainBigImage:""].join(" ")},e.createElement(a,{classes:c.OfferButton,isLine:!0,text:k("checkout-page:actions.rejectOffer"),onClick:W}),e.createElement(a,{classes:[c.OfferButton,y?c.OfferAcceptButton:""].join(" "),text:k("checkout-page:actions.acceptOffer"),onClick:Q}))))}));export{u as default};
+import*as e from"react";import{observer as t}from"mobx-react-lite";import{CheckoutStep as n}from"../../model.js";import{Button as a}from"../button/index.js";import i from"./select/index.js";import o from"../svg/cross.js";import{useTranslation as r}from"../../../../utils/i18n.js";import c from"./style.module.scss.js";import{IkasAmountType as s}from"@ikas/storefront-models";import"@ikas/storefront-config";import{formatCurrency as l}from"../../../../utils/currency.js";var u=function(t){var a,i,o=t.seconds,s=t.onFinish,l=t.campaignOffer,u=t.vm,f=t.isPopupClosed,m=t.step,p=r().t,v=e.useState(o),g=v[0],C=v[1];e.useEffect((function(){C(o)}),[o]),e.useEffect((function(){var e=setInterval((function(){g>0?C(g-1):(clearInterval(e),s())}),1e3);return function(){return clearInterval(e)}}),[g]);var S=l.offer.countdownMinutes&&(m!==n.SUCCESS?!!(null===(a=u.customizationProps)||void 0===a?void 0:a.campaignOfferCountdownStyleIsLine):!!(null===(i=u.customizationProps)||void 0===i?void 0:i.campaignOfferCountdownStyleIsLineSuccessPage))||f;return e.createElement("div",{className:S?c.CountdownContainerIsLine:c.CountdownContainer},e.createElement("div",{className:c.CountdownTextMain},!S&&e.createElement("span",{className:c.CountdownText},p("checkout-page:timeRemaining")),e.createElement("span",{className:c.CountdownTime},d(g))))},d=function(e){var t=Math.floor(e/60/60),n=Math.floor(e/60)-60*t,a=e%60;return 0!==t?t.toString().padStart(2,"0")+":":n.toString().padStart(2,"0")+":"+a.toString().padStart(2,"0")},f=t((function(t){var d,f,m,p,v,g,C,S=t.vm,h=t.campaignOffer,E=t.index,P=t.activeIndex,O=t.offersLength,I=t.handleNext,V=t.handlePrev,w=t.setActiveIndex,N=t.isPopupShow,M=t.closePopup,y=t.showPopup,j=t.isPopupClosed,B=t.desktopMiddlePhase,k=t.step,A=r().t,T=h.product,x=k!==n.SUCCESS?!!(null===(d=S.customizationProps)||void 0===d?void 0:d.campaignOfferIsSmallDesign)&&N:!!(null===(f=S.customizationProps)||void 0===f?void 0:f.showCampaignIsBiggerImage)&&k===n.SUCCESS,D=e.useRef(null),L=e.useRef(null),z=e.useRef(null),R=e.useState(0),b=R[0],U=R[1];e.useEffect((function(){var e,t,a,i,o,r,c,s;if(void 0!==typeof window){var l=.8*window.innerHeight,u=0,d=0,f=0;D.current&&(u=null===(t=null===(e=D.current)||void 0===e?void 0:e.getBoundingClientRect())||void 0===t?void 0:t.height),L.current&&(d=null===(i=null===(a=L.current)||void 0===a?void 0:a.getBoundingClientRect())||void 0===i?void 0:i.height),z.current&&(f=null===(r=null===(o=z.current)||void 0===o?void 0:o.getBoundingClientRect())||void 0===r?void 0:r.height);var m=(k===n.SUCCESS?null===(c=S.customizationProps)||void 0===c?void 0:c.campaignOfferCountdownStyleIsLineSuccessPage:null===(s=S.customizationProps)||void 0===s?void 0:s.campaignOfferCountdownStyleIsLine)?25:70,p=navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)?20:0;U(l-u-d-f-p-m)}}),[N]);var F=e.useState(null),H=F[0],X=F[1],q=e.useState(null),G=q[0],J=q[1],K=e.useMemo((function(){var e,t,n,a,i,o,r,c=null===(e=T.selectedVariant.images)||void 0===e?void 0:e.filter((function(e){return!e.isVideo}));return(null===(t=T.selectedVariant.mainImage)||void 0===t?void 0:t.isVideo)&&(null==c?void 0:c.length)?null===(n=c[0].image)||void 0===n?void 0:n.thumbnailSrc:x||B?null===(i=null===(a=T.selectedVariant.mainImage)||void 0===a?void 0:a.image)||void 0===i?void 0:i.getSrc(360):null===(r=null===(o=T.selectedVariant.mainImage)||void 0===o?void 0:o.image)||void 0===r?void 0:r.thumbnailSrc}),[T.selectedVariant,x,B]),Q=e.useMemo((function(){if(!h.offer.countdownMinutes||!h.campaignOffer.offerStartDate)return 0;var e=Math.round(((new Date).getTime()-new Date(h.campaignOffer.offerStartDate).getTime())/1e3);return e>60*h.offer.countdownMinutes?0:60*h.offer.countdownMinutes-e}),[h]),W=function(e){w(0),S.updateCartCampaignOffer({accepted:e,cartId:S.checkout.id,campaignOfferId:h.campaignOffer.campaignOfferId,campaignOfferProductId:h.offer.id,productId:h.offer.productId,variantId:T.selectedVariant.id})},Y=function(){W(!0)},Z=function(){W(!1)},$=h.offer.countdownMinutes&&(k!==n.SUCCESS?!!(null===(m=S.customizationProps)||void 0===m?void 0:m.campaignOfferCountdownStyleIsLine):!!(null===(p=S.customizationProps)||void 0===p?void 0:p.campaignOfferCountdownStyleIsLineSuccessPage))||j&&h.offer.countdownMinutes;return e.createElement("div",{style:{transform:"translateX(-".concat(100*P,"%)")},className:[c.Container,E===P?c.ActiveOffer:"",N?c.PopupContainer:"",B?c.PopupContainerDesktop:"",k===n.SUCCESS?c.Border:""].join(" ")},h.offer.countdownMinutes&&(k!==n.SUCCESS?!(null===(v=S.customizationProps)||void 0===v?void 0:v.campaignOfferCountdownStyleIsLine):!(null===(g=S.customizationProps)||void 0===g?void 0:g.campaignOfferCountdownStyleIsLineSuccessPage))&&!j&&e.createElement(u,{seconds:Q,onFinish:Z,vm:S,campaignOffer:h,step:k}),e.createElement("div",{onTouchStart:function(e){J(null),X(e.targetTouches[0].clientX)},onTouchMove:function(e){return J(e.targetTouches[0].clientX)},onTouchEnd:function(){if(H&&G&&O>1){var e=H-G,t=e>50;(t||e<-50)&&(t?I():V())}},className:[c.ContentContainer,O>1?c.ContentContainerItems:"",j?O>1?c.ContentContainerPopup:c.ContentContainerPopupItems:""].join(" ")},!!N&&e.createElement("div",{className:c.RejectButton,onClick:function(){return M&&M()}},e.createElement(o,null)),e.createElement("div",{ref:D,className:[c.HeaderMain,x&&!j?c.IsBigProductImage:"",$?c.IsLineCountDown:"",j?c.MobileSmallHeader:""].join(" ")},e.createElement("div",{className:c.Header},e.createElement("div",{className:c.Title},h.offer.title),!!h.offer.description&&!j&&e.createElement("div",{className:c.Description},h.offer.description)),$&&e.createElement(u,{seconds:Q,onFinish:Z,vm:S,campaignOffer:h,isPopupClosed:j,step:k})),e.createElement("div",{className:[c.ProductContainer,x&&!j?c.IsLineProductContainer:""].join(" ")},e.createElement("div",{style:N?{width:b,height:b}:{},className:[c.ImageContainer,x&&!j?c.BigImage:"",j?c.SmallImage:"",B?c.BiggerImage:""].join(" ")},e.createElement("img",{className:c.Image,src:K})),e.createElement("div",{ref:L,className:c.ProductDetails},e.createElement("div",{className:c.ProductName},T.name),T.hasVariant&&1===T.variants.length&&e.createElement("div",{className:c.VariantName},T.selectedVariant.variantValues.map((function(e){return e.name})).join(", ")),!(null===(C=S.customizationProps)||void 0===C?void 0:C.showCampaignHideDiscountBadge)&&T.selectedVariant.hasDiscount&&e.createElement("span",{className:c.DiscountBadge},h.offer.discountType===s.RATIO?"%".concat(T.selectedVariant.discountPercentage):l(h.offer.discountAmount||0,T.selectedVariant.price.currency||"",T.selectedVariant.price.currencySymbol||"")," ",A("checkout-page:discount")),e.createElement("div",{className:c.ProductPriceMain},T.selectedVariant.hasDiscount&&e.createElement("span",{className:c.Discount},T.selectedVariant.formattedSellPrice," "),e.createElement("span",{className:c.ProductPrice},h.offer.discountType===s.AMOUNT?l(T.selectedVariant.price.sellPrice-(h.offer.discountAmount||0),T.selectedVariant.price.currency||"",T.selectedVariant.price.currencySymbol||""):T.selectedVariant.formattedFinalPrice)),!j&&T.variants.length>1&&e.createElement("div",{className:c.Actions},T.variants.length>1&&e.createElement(i,{value:T.selectedVariant.id,onSelectChange:function(e){var t=null;T.displayedVariantTypes.forEach((function(n){n.displayedVariantValues.forEach((function(n){n.variant.id===e&&(t=n.variantValue)}))})),t&&T.selectVariantValue(t,!0)},options:T.variants.map((function(e){return{label:e.variantValues.map((function(e){return e.name})).join(", "),value:e.id}}))})),!!j&&e.createElement(a,{classes:[c.OfferButton,x?c.OfferAcceptButton:"",c.PopupOfferButton].join(" "),text:A("checkout-page:actions.acceptOffer"),onClick:function(){T.hasVariant?y&&y():Y()}}),!!B&&e.createElement("div",{className:[c.OfferActionsMain,x?c.OfferActionsMainBigImage:"",c.OfferActionsMainMiddlePhase].join(" ")},e.createElement(a,{classes:c.OfferButton,isLine:!0,text:A("checkout-page:actions.rejectOffer"),onClick:Z}),e.createElement(a,{classes:[c.OfferButton,x?c.OfferAcceptButton:""].join(" "),text:e.createElement("div",null,e.createElement("span",null,A("checkout-page:actions.acceptOffer")),e.createElement("span",null),e.createElement("span",null,T.selectedVariant.price.formattedFinalPrice)),onClick:Y})))),!(j||B)&&e.createElement("div",{ref:z,className:[c.OfferActionsMain,x?c.OfferActionsMainBigImage:""].join(" ")},e.createElement(a,{classes:c.OfferButton,isLine:!0,text:A("checkout-page:actions.rejectOffer"),onClick:Z}),e.createElement(a,{classes:[c.OfferButton,x?c.OfferAcceptButton:""].join(" "),text:A("checkout-page:actions.acceptOffer"),onClick:Y}))))}));export{f as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ikas/storefront",
-  "version": "4.15.0-beta.61",
+  "version": "4.15.0-beta.63",
   "description": "Storefront functionality for ikas storefront themes.",
   "author": "ikas",
   "license": "ISC",
@@ -17,11 +17,11 @@
     "build": "rm -rf build && rollup -c"
   },
   "devDependencies": {
-    "@ikas/storefront-api": "^4.15.0-beta.61",
-    "@ikas/storefront-config": "^4.15.0-beta.61",
-    "@ikas/storefront-model-functions": "^4.15.0-beta.61",
-    "@ikas/storefront-models": "^4.15.0-beta.61",
-    "@ikas/storefront-providers": "^4.15.0-beta.61",
+    "@ikas/storefront-api": "^4.15.0-beta.63",
+    "@ikas/storefront-config": "^4.15.0-beta.63",
+    "@ikas/storefront-model-functions": "^4.15.0-beta.63",
+    "@ikas/storefront-models": "^4.15.0-beta.63",
+    "@ikas/storefront-providers": "^4.15.0-beta.63",
     "@ikas/localized-address": "1.0.0-beta.3",
     "@adyen/adyen-web": "^5.57.0",
     "@rollup/plugin-commonjs": "^22.0.0",
@@ -55,11 +55,11 @@
   },
   "peerDependencies": {
     "@ikas/localized-address": "1.0.0-beta.3",
-    "@ikas/storefront-api": "^4.15.0-beta.61",
-    "@ikas/storefront-config": "^4.15.0-beta.61",
-    "@ikas/storefront-model-functions": "^4.15.0-beta.61",
-    "@ikas/storefront-models": "^4.15.0-beta.61",
-    "@ikas/storefront-providers": "^4.15.0-beta.61",
+    "@ikas/storefront-api": "^4.15.0-beta.63",
+    "@ikas/storefront-config": "^4.15.0-beta.63",
+    "@ikas/storefront-model-functions": "^4.15.0-beta.63",
+    "@ikas/storefront-models": "^4.15.0-beta.63",
+    "@ikas/storefront-providers": "^4.15.0-beta.63",
     "mobx": "^6.1.3",
     "mobx-react-lite": "^3.1.5",
     "next": "12.2.0",