@ikas/loyalty-widget-renderer 1.0.0-alpha.46 → 1.0.0-alpha.48

package/build/renderer/components/button/style.js

@@ -1 +1 @@
-import{__makeTemplateObject as n}from'./../../../ext/tslib/tslib.es6.mjs.js';import r,{keyframes as t}from"styled-components";import{textXSMedium as o,textSM as e,textSMMedium as i,textMDMedium as a,textLGSemiBold as d,displayXSSemiBold as s}from"../style/typography.js";var l,p,u,c={textXSMedium:o,textSM:e,textSMMedium:i,textMDMedium:a,textLGSemiBold:d,displayXSSemiBold:s},f={small:"8px",medium:"10px 16px"},m=r.button(l||(l=n(["\n  border: none;\n  cursor: ",";\n  transition: all 0.2s ease;\n  opacity: ",";\n  pointer-events: ",";\n\n  ","\n\n  padding: ",";\n  border-radius: ","px;\n  width: ",";\n  background-color: ",";\n  color: ",";\n  border: ",";\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n\n  &:hover {\n    opacity: 0.9;\n  }\n"],["\n  border: none;\n  cursor: ",";\n  transition: all 0.2s ease;\n  opacity: ",";\n  pointer-events: ",";\n\n  ","\n\n  padding: ",";\n  border-radius: ","px;\n  width: ",";\n  background-color: ",";\n  color: ",";\n  border: ",";\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n\n  &:hover {\n    opacity: 0.9;\n  }\n"])),function(n){return n.disabled?"not-allowed":"pointer"},function(n){return n.disabled?.5:1},function(n){return n.disabled?"none":"auto"},function(n){return c[n.fontSize]},function(n){return f[n.paddingSize]},function(n){return n.borderRadius},function(n){return n.fullWidth?"100%":"auto"},function(n){var r;return null!==(r=n.bgColor)&&void 0!==r?r:"transparent"},function(n){var r;return null!==(r=n.textColor)&&void 0!==r?r:"inherit"},function(n){return n.borderColor?"1px solid ".concat(n.borderColor):"none"}),x=t(p||(p=n(["\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n"],["\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n"]))),b=r.div(u||(u=n(["\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top: 2px solid currentColor;\n  border-radius: 50%;\n  width: 14px;\n  height: 14px;\n  min-width: 14px; /* Ensure it doesn't collapse */\n  animation: "," 1s linear infinite, fade-in 0.3s ease-out;\n\n  @keyframes fade-in {\n    from {\n      opacity: 0;\n      width: 0;\n      transform: scale(0);\n    }\n    to {\n      opacity: 1;\n      width: 14px;\n      transform: scale(1);\n    }\n  }\n"],["\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top: 2px solid currentColor;\n  border-radius: 50%;\n  width: 14px;\n  height: 14px;\n  min-width: 14px; /* Ensure it doesn't collapse */\n  animation: "," 1s linear infinite, fade-in 0.3s ease-out;\n\n  @keyframes fade-in {\n    from {\n      opacity: 0;\n      width: 0;\n      transform: scale(0);\n    }\n    to {\n      opacity: 1;\n      width: 14px;\n      transform: scale(1);\n    }\n  }\n"])),x);export{m as Button,b as Loader};
+import{__makeTemplateObject as n}from'./../../../ext/tslib/tslib.es6.mjs.js';import r,{keyframes as o}from"styled-components";import{textXSMedium as t,textSM as e,textSMMedium as i,textMDMedium as a,textLGSemiBold as d,displayXSSemiBold as s}from"../style/typography.js";var l,p,u,c={textXSMedium:t,textSM:e,textSMMedium:i,textMDMedium:a,textLGSemiBold:d,displayXSSemiBold:s},f={small:"8px",medium:"10px 16px"},m=r.button(l||(l=n(["\n  border: none;\n  cursor: ",";\n  transition: all 0.2s ease;\n  opacity: ",";\n  /* pointer-events removed to allow cursor: not-allowed */\n\n  ","\n\n  padding: ",";\n  border-radius: ","px;\n  width: ",";\n  background-color: ",";\n  color: ",";\n  border: ",";\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n\n  &:hover {\n    opacity: ",";\n  }\n"],["\n  border: none;\n  cursor: ",";\n  transition: all 0.2s ease;\n  opacity: ",";\n  /* pointer-events removed to allow cursor: not-allowed */\n\n  ","\n\n  padding: ",";\n  border-radius: ","px;\n  width: ",";\n  background-color: ",";\n  color: ",";\n  border: ",";\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n\n  &:hover {\n    opacity: ",";\n  }\n"])),function(n){return n.disabled?"not-allowed":"pointer"},function(n){return n.disabled?.5:1},function(n){return c[n.fontSize]},function(n){return f[n.paddingSize]},function(n){return n.borderRadius},function(n){return n.fullWidth?"100%":"auto"},function(n){var r;return null!==(r=n.bgColor)&&void 0!==r?r:"transparent"},function(n){var r;return null!==(r=n.textColor)&&void 0!==r?r:"inherit"},function(n){return n.borderColor?"1px solid ".concat(n.borderColor):"none"},function(n){return n.disabled?.5:.9}),x=o(p||(p=n(["\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n"],["\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n"]))),b=r.div(u||(u=n(["\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top: 2px solid currentColor;\n  border-radius: 50%;\n  width: 14px;\n  height: 14px;\n  min-width: 14px; /* Ensure it doesn't collapse */\n  animation:\n    "," 1s linear infinite,\n    fade-in 0.3s ease-out;\n\n  @keyframes fade-in {\n    from {\n      opacity: 0;\n      width: 0;\n      transform: scale(0);\n    }\n    to {\n      opacity: 1;\n      width: 14px;\n      transform: scale(1);\n    }\n  }\n"],["\n  border: 2px solid rgba(255, 255, 255, 0.3);\n  border-top: 2px solid currentColor;\n  border-radius: 50%;\n  width: 14px;\n  height: 14px;\n  min-width: 14px; /* Ensure it doesn't collapse */\n  animation:\n    "," 1s linear infinite,\n    fade-in 0.3s ease-out;\n\n  @keyframes fade-in {\n    from {\n      opacity: 0;\n      width: 0;\n      transform: scale(0);\n    }\n    to {\n      opacity: 1;\n      width: 14px;\n      transform: scale(1);\n    }\n  }\n"])),x);export{m as Button,b as Loader};

package/build/renderer/components/flexible-value-container/index.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+type FlexibleValueContainerProps = {
+    children: React.ReactNode | ((isWrapped: boolean) => React.ReactNode);
+    gap?: number;
+    className?: string;
+    style?: React.CSSProperties;
+};
+/**
+ * A container that switches flex-direction to 'column' if its children wrap
+ * when in 'row' layout.
+ *
+ * Uses a hidden clone ("Detector") to constantly monitor if a standard row layout
+ * would wrap given the current width constraint.
+ */
+export declare const FlexibleValueContainer: React.FC<FlexibleValueContainerProps>;
+export {};

package/build/renderer/components/flexible-value-container/index.js

@@ -0,0 +1 @@
+import{__makeTemplateObject as n}from'./../../../ext/tslib/tslib.es6.mjs.js';import e,{useRef as t,useState as i,useLayoutEffect as r}from"react";import o from"styled-components";var a,s,p=o.div(a||(a=n(["\n  display: flex;\n  flex-direction: ",";\n  align-items: ",";\n  gap: ","px;\n  flex-wrap: wrap;\n  position: relative;\n  width: 100%; /* Ensure it takes available width to properly constrain the detector */\n"],["\n  display: flex;\n  flex-direction: ",";\n  align-items: ",";\n  gap: ","px;\n  flex-wrap: wrap;\n  position: relative;\n  width: 100%; /* Ensure it takes available width to properly constrain the detector */\n"])),function(n){return n.$isWrapped?"column":"row"},function(n){return n.$isWrapped?"flex-start":"center"},function(n){return n.$gap}),l=o.div(s||(s=n(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  gap: ","px;\n  align-items: center;\n\n  /* Positioning to match the container's width constraint */\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n\n  /* Hide from view and interaction */\n  visibility: hidden;\n  pointer-events: none;\n  z-index: -100;\n  opacity: 0;\n"],["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  gap: ","px;\n  align-items: center;\n\n  /* Positioning to match the container's width constraint */\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n\n  /* Hide from view and interaction */\n  visibility: hidden;\n  pointer-events: none;\n  z-index: -100;\n  opacity: 0;\n"])),function(n){return n.$gap}),c=function(n){var o=n.children,a=n.gap,s=void 0===a?6:a,c=n.className,d=n.style,f=t(null),u=i(!1),m=u[0],v=u[1];r(function(){var n=function(){if(f.current){var n=f.current,e=Array.from(n.children);if(e.length<2)v(!1);else{var t=e[0].offsetTop,i=e[e.length-1].offsetTop;v(i>t+2)}}};n();var e=new ResizeObserver(n);return f.current&&e.observe(f.current),function(){return e.disconnect()}},[o]);var w="function"==typeof o?o(m):o,h="function"==typeof o?o(!1):o;return e.createElement(p,{className:c,style:d,$isWrapped:m,$gap:s},w,e.createElement(l,{ref:f,$gap:s,"aria-hidden":"true"},h))};export{c as FlexibleValueContainer};

package/build/renderer/screens/credit-spending-methods-screen/index.js

@@ -1 +1 @@
-import{observer as e}from"mobx-react";import t from"react";import'./../../../ext/react-i18next/dist/es/context.js';import{useTranslation as n}from'./../../../ext/react-i18next/dist/es/useTranslation.js';import{ChevronLeft as o}from"../../../assets/icons/chevron-left.js";import{XClose as r}from"../../../assets/icons/x-close.js";import l from"../../components/count-up/index.js";import s from"../main-screen/spending-methods-section/index.js";import{Container as i,Header as a,IconButton as c,Title as m,Content as d,PointsSection as u,PointsTitle as p,PointsValue as f}from"./style.js";var E=e(function(e){var E=e.viewModel,v=e.onBack,x=e.onClose,j=n().t,g=E.user;return t.createElement(i,null,t.createElement(a,null,t.createElement(c,{onClick:v},t.createElement(o,null)),t.createElement(m,null,j("screens.creditSpendingMethods")),t.createElement(c,{onClick:x},t.createElement(r,null))),t.createElement(d,null,g&&t.createElement(u,{$borderRadius:E.loyaltyWidget.settings.cartBorderRadius},t.createElement(p,null,j("header.earnedPoints")),t.createElement(f,null,t.createElement(l,{end:g.totalPoint}))),t.createElement(s,{viewModel:E,mode:"accordion",methods:E.spendingMethods.slice().sort(function(e,t){return e.isAvailable===t.isAvailable?0:e.isAvailable?-1:1}),getActionProps:function(e){return null}})))});export{E as default};
+import{observer as e}from"mobx-react";import t from"react";import'./../../../ext/react-i18next/dist/es/context.js';import{useTranslation as n}from'./../../../ext/react-i18next/dist/es/useTranslation.js';import{ChevronLeft as o}from"../../../assets/icons/chevron-left.js";import{XClose as r}from"../../../assets/icons/x-close.js";import l from"../../components/count-up/index.js";import s from"../main-screen/spending-methods-section/index.js";import{Container as i,Header as m,IconButton as c,Title as a,Content as d,PointsSection as u,PointsTitle as p,PointsValue as E}from"./style.js";var f=e(function(e){var f=e.viewModel,x=e.onBack,j=e.onClose,g=n().t,h=f.user;return t.createElement(i,null,t.createElement(m,null,t.createElement(c,{onClick:x},t.createElement(o,null)),t.createElement(a,null,g("screens.creditSpendingMethods")),t.createElement(c,{onClick:j},t.createElement(r,null))),t.createElement(d,null,h&&t.createElement(u,{$borderRadius:f.loyaltyWidget.settings.cartBorderRadius},t.createElement(p,null,g("header.earnedPoints")),t.createElement(E,null,t.createElement(l,{end:h.totalPoint}))),t.createElement(s,{viewModel:f,mode:"accordion",methods:f.spendingMethods,getActionProps:function(e){return null}})))});export{f as default};

package/build/renderer/screens/main-screen/header/index.js

@@ -1 +1 @@
-import{observer as e}from"mobx-react";import t from"react";import{XClose as r}from"../../../../assets/icons/x-close.js";import{ImageTypeEnum as o}from"../../../../models/loyalty-widget/types/index.js";import n from"./auth-user-section/index.js";import i from"./logo-section/index.js";import l from"./title-section/index.js";import a from"./user-logged-section/index.js";import{Container as s,TopSection as c,CloseButton as m,Content as d,Card as u}from"./style.js";var f=e(function(e){var f,g=e.viewModel,p=e.onClose,v=e.onCardHeightChange,h=e.headerGap,y=g.loyaltyWidget,E=g.user,b=y.header.background,x=b.bgColor,j=b.type,C=(null===(f=b.image)||void 0===f?void 0:f.src)||null,R=t.useRef(null);return t.useEffect(function(){if(v){var e=R.current;if(e){var t=function(){v(Math.round(e.getBoundingClientRect().height))};if(t(),"undefined"!=typeof ResizeObserver){var r=new ResizeObserver(function(){t()});return r.observe(e),function(){r.disconnect()}}}}},[v]),t.createElement(s,null,t.createElement(c,{$bgColor:x,$bgType:j,$bgImageSrc:C,$gap:h},y.header.logo.type===o.SHOW&&y.header.logo.src&&t.createElement(i,{logo:y.header.logo}),t.createElement(l,{layout:y}),t.createElement(m,{onClick:p},t.createElement(r,null))),t.createElement(d,null,t.createElement(u,{ref:R,$borderRadius:y.settings.cartBorderRadius},E?t.createElement(a,{viewModel:g}):t.createElement(n,{viewModel:g}))))});export{f as default};
+import{observer as e}from"mobx-react";import r from"react";import{XClose as t}from"../../../../assets/icons/x-close.js";import{ImageTypeEnum as o}from"../../../../models/loyalty-widget/types/index.js";import n from"./auth-user-section/index.js";import i from"./logo-section/index.js";import l from"./title-section/index.js";import a from"./user-logged-section/index.js";import{Container as s,TopSection as c,CloseButton as d,Content as m,Card as f}from"./style.js";var u=e(function(e){var u,g=e.viewModel,p=e.onClose,v=e.onCardHeightChange,h=e.headerGap,y=g.loyaltyWidget,E=g.user,b=y.header.background,x=b.bgColor,C=b.type,j=(null===(u=b.image)||void 0===u?void 0:u.src)||null,R=r.useRef(null);return r.useEffect(function(){if(v){var e=R.current;if(e){var r=function(){v(Math.round(e.getBoundingClientRect().height))};if(r(),"undefined"!=typeof ResizeObserver){var t=new ResizeObserver(function(){r()});return t.observe(e),function(){t.disconnect()}}}}},[v]),r.createElement(s,null,r.createElement(c,{$bgColor:x,$bgType:C,$bgImageSrc:j,$gap:h},y.header.logo.type===o.SHOW&&y.header.logo.src&&r.createElement(i,{logo:y.header.logo}),r.createElement(l,{layout:y}),r.createElement(d,{onClick:p,$color:y.header.textColor||"#f7f5ff"},r.createElement(t,null))),r.createElement(m,null,r.createElement(f,{ref:R,$borderRadius:y.settings.cartBorderRadius},E?r.createElement(a,{viewModel:g}):r.createElement(n,{viewModel:g}))))});export{u as default};

package/build/renderer/screens/main-screen/header/style.d.ts

@@ -12,5 +12,7 @@ export declare const Content: import("styled-components").StyledComponent<"div",
 export declare const Card: import("styled-components").StyledComponent<"div", any, {
     $borderRadius: number;
 }, never>;
-export declare const CloseButton: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CloseButton: import("styled-components").StyledComponent<"div", any, {
+    $color: string;
+}, never>;
 export {};

package/build/renderer/screens/main-screen/header/style.js

@@ -1 +1 @@
-import{__makeTemplateObject as n}from'./../../../../ext/tslib/tslib.es6.mjs.js';import e,{css as o}from"styled-components";import{HeaderBackgroundTypeEnum as i}from"../../../../models/loyalty-widget/types/index.js";var r,t,p,a,d,l,x,c,s,g,b=48,f=e.div(r||(r=n(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n"],["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n"]))),u=e.div(x||(x=n(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: ",";\n  padding: 24px 20px ","px 24px;\n  width: 100%;\n\n  ","\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: ",";\n  padding: 24px 20px ","px 24px;\n  width: 100%;\n\n  ","\n"])),function(n){var e=n.$gap;return void 0!==e?"".concat(e,"px"):"16px"},48,function(e){var r=e.$bgType,x=e.$bgColor,c=e.$bgImageSrc;return r===i.IMAGE?c?o(p||(p=n(["\n        background-image: url(",");\n        background-position: center;\n        background-repeat: no-repeat;\n        background-size: cover;\n      "],["\n        background-image: url(",");\n        background-position: center;\n        background-repeat: no-repeat;\n        background-size: cover;\n      "])),c):o(t||(t=n([""],[""]))):x?r===i.GRADIENT?o(d||(d=n(["\n        background:\n          radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ",";\n      "],["\n        background:\n          radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ",";\n      "])),x):o(l||(l=n(["\n      background-color: ",";\n    "],["\n      background-color: ",";\n    "])),x):o(a||(a=n([""],[""])))}),m=e.div(c||(c=n(["\n  position: absolute;\n  left: 16px;\n  right: 16px;\n  top: calc(100% - ","px);\n  display: flex;\n  z-index: 1;\n"],["\n  position: absolute;\n  left: 16px;\n  right: 16px;\n  top: calc(100% - ","px);\n  display: flex;\n  z-index: 1;\n"])),48),v=e.div(s||(s=n(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  background: white;\n  border: 1px solid #eef2f6;\n  border-radius: ",";\n  box-shadow:\n    0 5px 2px 0 rgba(0, 0, 0, 0.01),\n    0 3px 2px 0 rgba(0, 0, 0, 0.02),\n    0 1px 1px 0 rgba(0, 0, 0, 0.03),\n    0 0 1px 0 rgba(0, 0, 0, 0.04);\n"],["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  background: white;\n  border: 1px solid #eef2f6;\n  border-radius: ",";\n  box-shadow:\n    0 5px 2px 0 rgba(0, 0, 0, 0.01),\n    0 3px 2px 0 rgba(0, 0, 0, 0.02),\n    0 1px 1px 0 rgba(0, 0, 0, 0.03),\n    0 0 1px 0 rgba(0, 0, 0, 0.04);\n"])),function(n){var e=n.$borderRadius;return"".concat(e,"px")}),y=e.div(g||(g=n(["\n  position: absolute;\n  right: 20px;\n  top: 24px;\n  display: flex;\n  padding: 4px;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  svg {\n    color: #f7f5ff;\n  }\n"],["\n  position: absolute;\n  right: 20px;\n  top: 24px;\n  display: flex;\n  padding: 4px;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  svg {\n    color: #f7f5ff;\n  }\n"])));export{b as CARD_OVERLAP_TOP,v as Card,y as CloseButton,f as Container,m as Content,u as TopSection};
+import{__makeTemplateObject as n}from'./../../../../ext/tslib/tslib.es6.mjs.js';import e,{css as o}from"styled-components";import{HeaderBackgroundTypeEnum as r}from"../../../../models/loyalty-widget/types/index.js";var i,t,p,a,d,l,c,x,s,g,b=48,u=e.div(i||(i=n(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n"],["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: visible;\n"]))),f=e.div(c||(c=n(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: ",";\n  padding: 24px 20px ","px 24px;\n  width: 100%;\n\n  ","\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: ",";\n  padding: 24px 20px ","px 24px;\n  width: 100%;\n\n  ","\n"])),function(n){var e=n.$gap;return void 0!==e?"".concat(e,"px"):"16px"},48,function(e){var i=e.$bgType,c=e.$bgColor,x=e.$bgImageSrc;return i===r.IMAGE?x?o(p||(p=n(["\n        background-image: url(",");\n        background-position: center;\n        background-repeat: no-repeat;\n        background-size: cover;\n      "],["\n        background-image: url(",");\n        background-position: center;\n        background-repeat: no-repeat;\n        background-size: cover;\n      "])),x):o(t||(t=n([""],[""]))):c?i===r.GRADIENT?o(d||(d=n(["\n        background:\n          radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ",";\n      "],["\n        background:\n          radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ",";\n      "])),c):o(l||(l=n(["\n      background-color: ",";\n    "],["\n      background-color: ",";\n    "])),c):o(a||(a=n([""],[""])))}),m=e.div(x||(x=n(["\n  position: absolute;\n  left: 16px;\n  right: 16px;\n  top: calc(100% - ","px);\n  display: flex;\n  z-index: 10;\n"],["\n  position: absolute;\n  left: 16px;\n  right: 16px;\n  top: calc(100% - ","px);\n  display: flex;\n  z-index: 10;\n"])),48),v=e.div(s||(s=n(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  background: white;\n  border: 1px solid #eef2f6;\n  border-radius: ",";\n  box-shadow:\n    0 5px 2px 0 rgba(0, 0, 0, 0.01),\n    0 3px 2px 0 rgba(0, 0, 0, 0.02),\n    0 1px 1px 0 rgba(0, 0, 0, 0.03),\n    0 0 1px 0 rgba(0, 0, 0, 0.04);\n"],["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  background: white;\n  border: 1px solid #eef2f6;\n  border-radius: ",";\n  box-shadow:\n    0 5px 2px 0 rgba(0, 0, 0, 0.01),\n    0 3px 2px 0 rgba(0, 0, 0, 0.02),\n    0 1px 1px 0 rgba(0, 0, 0, 0.03),\n    0 0 1px 0 rgba(0, 0, 0, 0.04);\n"])),function(n){var e=n.$borderRadius;return"".concat(e,"px")}),y=e.div(g||(g=n(["\n  position: absolute;\n  right: 20px;\n  top: 24px;\n  display: flex;\n  padding: 4px;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  svg {\n    color: ",";\n  }\n"],["\n  position: absolute;\n  right: 20px;\n  top: 24px;\n  display: flex;\n  padding: 4px;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  svg {\n    color: ",";\n  }\n"])),function(n){return n.$color});export{b as CARD_OVERLAP_TOP,v as Card,y as CloseButton,u as Container,m as Content,f as TopSection};

package/build/renderer/screens/main-screen/index.js

@@ -1 +1 @@
-import{__awaiter as e,__generator as t,__assign as o}from'./../../../ext/tslib/tslib.es6.mjs.js';import{observer as n}from"mobx-react";import i from"react";import'./../../../ext/react-i18next/dist/es/context.js';import{useTranslation as r}from'./../../../ext/react-i18next/dist/es/useTranslation.js';import{EarningMethodTypeEnum as s,WidgetMode as a}from"../../../models/types/index.js";import l from"../../components/section-title/index.js";import c from"./earning-methods-section/index.js";import d from"./header/index.js";import{CARD_OVERLAP_TOP as m}from"./header/style.js";import u from"./program-info-section/index.js";import p from"./spending-methods-section/index.js";import{Container as g,Content as f,Section as h}from"./style.js";var E=n(function(n){var E=n.viewModel,v=n.onClose,M=n.onNavigate,T=r().t,x=i.useState(0),b=x[0],j=x[1],w=Math.max(b-m+32,32),S=E.shouldShowSpendingMethods,C=E.earningMethods.length>0,_=S||C;return i.createElement(g,null,i.createElement(d,{viewModel:E,onClose:v,onCardHeightChange:j,headerGap:16}),i.createElement(f,{$topPadding:w},_&&i.createElement(h,null,i.createElement(l,{style:{paddingTop:0}},T(S?"main_screen.spendingMethodsTitle":"main_screen.earningMethodsTitle")),S?i.createElement(p,{viewModel:E,mode:"accordion",methods:E.spendingMethods.filter(function(e){return e.isAvailable}),getActionProps:function(e){return null}}):i.createElement(c,{viewModel:E,getActionProps:function(n){return n.methodType===s.CUSTOMER_REGISTER?{actionText:T("common.create"),onClick:function(){E.storeUrl&&(E.setWidgetMode(a.MINI_MODE),window.location.href="".concat(E.storeUrl,"/account/register"))}}:n.methodType===s.ENABLE_SUBSCRIPTION?{actionText:T("common.allow"),onClick:function(){return e(void 0,void 0,void 0,function(){var e;return t(this,function(t){switch(t.label){case 0:return(null===(e=E.callbacks)||void 0===e?void 0:e.subscribeToMarketingNotifications)?(E.isActionLoading=!0,[4,E.callbacks.subscribeToMarketingNotifications()]):[3,2];case 1:t.sent()&&(E.ikasEventUser=o(o({},E.ikasEventUser),{subscriptionStatus:"SUBSCRIBED"}),E.userRefreshTrigger++),E.isActionLoading=!1,t.label=2;case 2:return[2]}})})},loading:E.isActionLoading}:null}})),i.createElement(h,null,i.createElement(l,{style:{paddingTop:0}},T("main_screen.programInfoTitle")),i.createElement(u,{viewModel:E,onNavigate:M}))))});export{E as default};
+import{__awaiter as e,__generator as t,__assign as o}from'./../../../ext/tslib/tslib.es6.mjs.js';import{observer as n}from"mobx-react";import i from"react";import'./../../../ext/react-i18next/dist/es/context.js';import{useTranslation as r}from'./../../../ext/react-i18next/dist/es/useTranslation.js';import{EarningMethodTypeEnum as s,WidgetMode as a}from"../../../models/types/index.js";import l from"../../components/section-title/index.js";import c from"./earning-methods-section/index.js";import d from"./header/index.js";import{CARD_OVERLAP_TOP as m}from"./header/style.js";import u from"./program-info-section/index.js";import p from"./spending-methods-section/index.js";import{Container as g,Content as f,Section as h}from"./style.js";var E=n(function(n){var E=n.viewModel,v=n.onClose,M=n.onNavigate,T=r().t,x=i.useState(0),b=x[0],j=x[1],w=Math.max(b-m+32,32),S=E.shouldShowSpendingMethods,C=E.earningMethods.length>0,_=S||C;return i.createElement(g,null,i.createElement(d,{viewModel:E,onClose:v,onCardHeightChange:j,headerGap:24}),i.createElement(f,{$topPadding:w},_&&i.createElement(h,null,i.createElement(l,{style:{paddingTop:0}},T(S?"main_screen.spendingMethodsTitle":"main_screen.earningMethodsTitle")),S?i.createElement(p,{viewModel:E,mode:"card",methods:E.spendingMethods.filter(function(e){return e.isAvailable}),getActionProps:function(e){return null}}):i.createElement(c,{viewModel:E,getActionProps:function(n){return n.methodType===s.CUSTOMER_REGISTER?{actionText:T("common.create"),onClick:function(){E.storeUrl&&(E.setWidgetMode(a.MINI_MODE),window.location.href="".concat(E.storeUrl,"/account/register"))}}:n.methodType===s.ENABLE_SUBSCRIPTION?{actionText:T("common.allow"),onClick:function(){return e(void 0,void 0,void 0,function(){var e;return t(this,function(t){switch(t.label){case 0:return(null===(e=E.callbacks)||void 0===e?void 0:e.subscribeToMarketingNotifications)?(E.isActionLoading=!0,[4,E.callbacks.subscribeToMarketingNotifications()]):[3,2];case 1:t.sent()&&(E.ikasEventUser=o(o({},E.ikasEventUser),{subscriptionStatus:"SUBSCRIBED"}),E.userRefreshTrigger++),E.isActionLoading=!1,t.label=2;case 2:return[2]}})})},loading:E.isActionLoading}:null}})),i.createElement(h,null,i.createElement(l,{style:{paddingTop:0}},T("main_screen.programInfoTitle")),i.createElement(u,{viewModel:E,onNavigate:M}))))});export{E as default};

package/build/renderer/screens/main-screen/spending-methods-section/dynamic-slider.js

@@ -1 +1 @@
-import{__makeTemplateObject as n,__awaiter as e,__generator as t}from'./../../../../ext/tslib/tslib.es6.mjs.js';import{observer as o}from"mobx-react";import i,{useState as r,useEffect as a}from"react";import'./../../../../ext/react-i18next/dist/es/context.js';import{useTranslation as l}from'./../../../../ext/react-i18next/dist/es/useTranslation.js';import s from"styled-components";import{HeaderBackgroundTypeEnum as d}from"../../../../models/loyalty-widget/types/index.js";import{LoyaltyWidgetScreenTypeEnum as p}from"../../../../models/types/index.js";import u from"../../../components/button/index.js";import{textSM as c,Badge as f}from"../../../components/style/typography.js";var m,g,x,h,b,v,y,w,E,k,$,j,S=s.div(m||(m=n(["\n  display: flex;\n  padding: 12px 16px 16px 16px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-radius: 6px;\n  border: 1px solid #eef2f6;\n  background: #f8fafc;\n"],["\n  display: flex;\n  padding: 12px 16px 16px 16px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-radius: 6px;\n  border: 1px solid #eef2f6;\n  background: #f8fafc;\n"]))),C=s.div(g||(g=n(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n"]))),z=s.div(x||(x=n(["\n  color: #364152;\n  ","\n"],["\n  color: #364152;\n  ","\n"])),c),I=s.div(h||(h=n(["\n  width: 100%;\n  position: relative;\n  padding-bottom: 16px; /* Space for markers */\n"],["\n  width: 100%;\n  position: relative;\n  padding-bottom: 16px; /* Space for markers */\n"]))),M=s.div(b||(b=n(["\n  position: relative;\n  width: 100%;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"],["\n  position: relative;\n  width: 100%;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"]))),N=s.div(v||(v=n(["\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 3px;\n  background-color: #e3e8ef;\n"],["\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 3px;\n  background-color: #e3e8ef;\n"]))),A=s.div(y||(y=n(["\n  position: absolute;\n  left: 0;\n  height: 6px;\n  width: ","%;\n  border-radius: 3px;\n  background: ",";\n"],["\n  position: absolute;\n  left: 0;\n  height: 6px;\n  width: ","%;\n  border-radius: 3px;\n  background: ",";\n"])),function(n){return n.$percentage},function(n){return n.$isGradient?"radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ".concat(n.$bgColor):n.$bgColor}),L=s.div(w||(w=n(["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  background: #ffffff;\n  border: 2px solid ",";\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);\n  z-index: 2;\n  pointer-events: none; /* Let clicks pass through to input/container if needed, but input handles interaction */\n"],["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  background: #ffffff;\n  border: 2px solid ",";\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);\n  z-index: 2;\n  pointer-events: none; /* Let clicks pass through to input/container if needed, but input handles interaction */\n"])),function(n){return n.$left},function(n){return n.$bgColor}),_=s.input(E||(E=n(["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n  z-index: 3;\n  margin: 0;\n"],["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n  z-index: 3;\n  margin: 0;\n"]))),P=s.div(k||(k=n(["\n  position: absolute;\n  top: 28px; /* Below the slider track/thumb */\n  left: 0;\n  right: 0;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n"],["\n  position: absolute;\n  top: 28px; /* Below the slider track/thumb */\n  left: 0;\n  right: 0;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n"]))),R=s.div($||($=n(["\n  font-size: 12px;\n  color: #9aa4b2;\n  font-weight: 400;\n  line-height: 18px;\n"],["\n  font-size: 12px;\n  color: #9aa4b2;\n  font-weight: 400;\n  line-height: 18px;\n"]))),T=s.div(j||(j=n(["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: #fff;\n  z-index: 1;\n"],["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: #fff;\n  z-index: 1;\n"])),function(n){return n.$left}),F=o(function(n){var o=n.viewModel,s=n.method,c=l().t,m=r(!1),g=m[0],x=m[1],h=o.user,b=o.loyaltyWidget,v=s.discountSettings;if(!h||!v)return null;var y=v.point,w=v.discountAmount||0;if(y<=0)return null;var E=s.pointUsageLimit,k=(null==E?void 0:E.minPointLimit)||0,$=(null==E?void 0:E.maxPointLimit)||Number.MAX_SAFE_INTEGER,j=Math.min(h.totalPoint,$),F=Math.floor(j/y)*y,G=k>0?Math.ceil(k/y)*y:0,B=F>0?F:y,W=G,D=r(F),U=D[0],X=D[1];a(function(){U>F?X(F):U<G&&X(G)},[F,G]);var q=B-W,H=q>0?(U-W)/q*100:0,J=U/y*w,K=b.header.background.bgColor||"#7B61FF",O=b.header.background.type===d.GRADIENT,Q=q/y,V=[];if(Q>1&&Q<20)for(var Y=1;Y<Q;Y++)V.push(Y/Q*100);var Z=F>=G&&F>0&&!0===s.isAvailable;return i.createElement(i.Fragment,null,i.createElement(S,null,i.createElement(C,null,i.createElement(z,null,U," ",c("common.points")),i.createElement(f,null,o.formatCurrency(Number(J)))),i.createElement(I,null,i.createElement(M,null,i.createElement(N,null,V.map(function(n,e){return i.createElement(T,{key:e,$left:n})})),i.createElement(A,{$percentage:H,$bgColor:K,$isGradient:O}),i.createElement(L,{$left:H,$bgColor:K}),i.createElement(_,{type:"range",min:W,max:B,step:y,value:U,onChange:function(n){var e=Number(n.target.value);X(e)}})),i.createElement(P,null,i.createElement(R,null,W),i.createElement(R,null,B)))),i.createElement(u,{button:b.button,fontSize:"textSMMedium",paddingSize:"medium",fullWidth:!0,disabled:0===U||g||!Z,isLoading:g,onClick:function(){return e(void 0,void 0,void 0,function(){var n;return t(this,function(e){switch(e.label){case 0:if(!o.cartId||0===U)return[2];x(!0),e.label=1;case 1:return e.trys.push([1,,3,4]),[4,null===(n=o.callbacks)||void 0===n?void 0:n.useLoyaltyPoints({amount:J,cartId:o.cartId,loyaltyProgramId:s.loyaltyProgramId,loyaltySpendingMethodId:s.id})];case 2:return e.sent()&&(o.userRefreshTrigger++,o.cartRefreshTrigger++,o.selectedScreen!==p.MAIN_SCREEN&&(o.selectedScreen=p.MAIN_SCREEN)),[3,4];case 3:return x(!1),[7];case 4:return[2]}})})}},c("common.convert")))});export{F as default};
+import{__makeTemplateObject as n,__awaiter as e,__generator as t}from'./../../../../ext/tslib/tslib.es6.mjs.js';import{observer as o}from"mobx-react";import i,{useState as r,useEffect as a}from"react";import'./../../../../ext/react-i18next/dist/es/context.js';import{useTranslation as l}from'./../../../../ext/react-i18next/dist/es/useTranslation.js';import s from"styled-components";import{HeaderBackgroundTypeEnum as d}from"../../../../models/loyalty-widget/types/index.js";import{LoyaltyWidgetScreenTypeEnum as p}from"../../../../models/types/index.js";import u from"../../../components/button/index.js";import{textSM as c,Badge as f}from"../../../components/style/typography.js";var m,g,x,h,b,v,y,w,E,k,$,j,S=s.div(m||(m=n(["\n  display: flex;\n  padding: 12px 16px 16px 16px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-radius: 6px;\n  border: 1px solid #eef2f6;\n  background: #f8fafc;\n"],["\n  display: flex;\n  padding: 12px 16px 16px 16px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 12px;\n  align-self: stretch;\n  border-radius: 6px;\n  border: 1px solid #eef2f6;\n  background: #f8fafc;\n"]))),C=s.div(g||(g=n(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n"]))),z=s.div(x||(x=n(["\n  color: #364152;\n  ","\n"],["\n  color: #364152;\n  ","\n"])),c),I=s.div(h||(h=n(["\n  width: 100%;\n  position: relative;\n  padding-bottom: 16px; /* Space for markers */\n"],["\n  width: 100%;\n  position: relative;\n  padding-bottom: 16px; /* Space for markers */\n"]))),M=s.div(b||(b=n(["\n  position: relative;\n  width: 100%;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"],["\n  position: relative;\n  width: 100%;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n"]))),N=s.div(v||(v=n(["\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 3px;\n  background-color: #e3e8ef;\n"],["\n  position: absolute;\n  left: 0;\n  right: 0;\n  height: 6px;\n  border-radius: 3px;\n  background-color: #e3e8ef;\n"]))),A=s.div(y||(y=n(["\n  position: absolute;\n  left: 0;\n  height: 6px;\n  width: ","%;\n  border-radius: 3px;\n  background: ",";\n"],["\n  position: absolute;\n  left: 0;\n  height: 6px;\n  width: ","%;\n  border-radius: 3px;\n  background: ",";\n"])),function(n){return n.$percentage},function(n){return n.$isGradient?"radial-gradient(92.35% 100% at 50% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%), ".concat(n.$bgColor):n.$bgColor}),L=s.div(w||(w=n(["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  background: #ffffff;\n  border: 2px solid ",";\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);\n  z-index: 2;\n  pointer-events: none; /* Let clicks pass through to input/container if needed, but input handles interaction */\n"],["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 20px;\n  height: 20px;\n  border-radius: 50%;\n  background: #ffffff;\n  border: 2px solid ",";\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);\n  z-index: 2;\n  pointer-events: none; /* Let clicks pass through to input/container if needed, but input handles interaction */\n"])),function(n){return n.$left},function(n){return n.$bgColor}),_=s.input(E||(E=n(["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n  z-index: 3;\n  margin: 0;\n"],["\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n  z-index: 3;\n  margin: 0;\n"]))),P=s.div(k||(k=n(["\n  position: absolute;\n  top: 28px; /* Below the slider track/thumb */\n  left: 0;\n  right: 0;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n"],["\n  position: absolute;\n  top: 28px; /* Below the slider track/thumb */\n  left: 0;\n  right: 0;\n  display: flex;\n  justify-content: space-between;\n  pointer-events: none;\n"]))),R=s.div($||($=n(["\n  font-size: 12px;\n  color: #9aa4b2;\n  font-weight: 400;\n  line-height: 18px;\n"],["\n  font-size: 12px;\n  color: #9aa4b2;\n  font-weight: 400;\n  line-height: 18px;\n"]))),T=s.div(j||(j=n(["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: #fff;\n  z-index: 1;\n"],["\n  position: absolute;\n  left: ","%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background-color: #fff;\n  z-index: 1;\n"])),function(n){return n.$left}),F=o(function(n){var o=n.viewModel,s=n.method,c=l().t,m=r(!1),g=m[0],x=m[1],h=o.user,b=o.loyaltyWidget,v=s.discountSettings;if(!h||!v)return null;var y=v.point,w=v.discountAmount||0;if(y<=0)return null;var E=s.pointUsageLimit,k=(null==E?void 0:E.minPointLimit)||0,$=(null==E?void 0:E.maxPointLimit)||Number.MAX_SAFE_INTEGER,j=Math.min(h.totalPoint,$),F=Math.floor(j/y)*y,G=k>0?Math.ceil(k/y)*y:0,B=F>0?F:y,W=G,D=r(G),U=D[0],X=D[1];a(function(){U>F?X(F):U<G&&X(G)},[F,G]);var q=B-W,H=q>0?(U-W)/q*100:0,J=U/y*w,K=b.header.background.bgColor||"#7B61FF",O=b.header.background.type===d.GRADIENT,Q=q/y,V=[];if(Q>1&&Q<20)for(var Y=1;Y<Q;Y++)V.push(Y/Q*100);var Z=F>=G&&F>0&&!0===s.isAvailable;return i.createElement(i.Fragment,null,i.createElement(S,null,i.createElement(C,null,i.createElement(z,null,U," ",c("common.points")),i.createElement(f,null,o.formatCurrency(Number(J)))),i.createElement(I,null,i.createElement(M,null,i.createElement(N,null,V.map(function(n,e){return i.createElement(T,{key:e,$left:n})})),i.createElement(A,{$percentage:H,$bgColor:K,$isGradient:O}),i.createElement(L,{$left:H,$bgColor:K}),i.createElement(_,{type:"range",min:W,max:B,step:y,value:U,onChange:function(n){var e=Number(n.target.value);X(e)}})),i.createElement(P,null,i.createElement(R,null,W),i.createElement(R,null,B)))),i.createElement(u,{button:b.button,fontSize:"textSMMedium",paddingSize:"medium",fullWidth:!0,disabled:0===U||g||!Z,isLoading:g,onClick:function(){return e(void 0,void 0,void 0,function(){var n;return t(this,function(e){switch(e.label){case 0:if(!o.cartId||0===U)return[2];x(!0),e.label=1;case 1:return e.trys.push([1,,3,4]),[4,null===(n=o.callbacks)||void 0===n?void 0:n.useLoyaltyPoints({amount:J,cartId:o.cartId,loyaltyProgramId:s.loyaltyProgramId,loyaltySpendingMethodId:s.id})];case 2:return e.sent()&&(o.userRefreshTrigger++,o.cartRefreshTrigger++,o.selectedScreen!==p.MAIN_SCREEN&&(o.selectedScreen=p.MAIN_SCREEN)),[3,4];case 3:return x(!1),[7];case 4:return[2]}})})}},c("common.convert")))});export{F as default};

package/build/renderer/screens/main-screen/spending-methods-section/index.js

@@ -1 +1 @@
-import{__spreadArray as e,__awaiter as t,__generator as i}from'./../../../../ext/tslib/tslib.es6.mjs.js';import{observer as o}from"mobx-react";import n,{useState as r}from"react";import'./../../../../ext/react-i18next/dist/es/context.js';import{useTranslation as d}from'./../../../../ext/react-i18next/dist/es/useTranslation.js';import{LoyaltyWidgetScreenTypeEnum as s}from"../../../../models/types/index.js";import a from"../../../components/loyalty-method-card/index.js";import{getSpendingMethodTitle as c,getSpendingMethodDescription as l,getSpendingMethodIcon as m}from"../../../../utils.js";import u from"./dynamic-slider.js";var p=o(function(e){var o=e.method,p=e.viewModel,y=e.actionText,g=e.padding,f=e.onClick,v=d().t,x=r(!1),I=x[0],h=x[1],b=p.loyaltyWidget,D=c(o),E=l(o,p),T=m(o.type,b.settings.widgetIconType),j=!0===o.isAvailable&&!o.isDynamic&&!!p.user&&!!p.cartId,w=o.isDynamic&&!!p.user&&!!p.cartId,C=o.isDynamic,M=j&&!C?{text:v("common.use"),onClick:function(){return t(void 0,void 0,void 0,function(){var e;return i(this,function(t){switch(t.label){case 0:if(!p.cartId)return[2];h(!0),t.label=1;case 1:return t.trys.push([1,,3,4]),[4,null===(e=p.callbacks)||void 0===e?void 0:e.useLoyaltyPoints({cartId:p.cartId,loyaltyProgramId:o.loyaltyProgramId,loyaltySpendingMethodId:o.id})];case 2:return t.sent()&&(p.userRefreshTrigger++,p.cartRefreshTrigger++,p.selectedScreen!==s.MAIN_SCREEN&&(p.selectedScreen=s.MAIN_SCREEN)),[3,4];case 3:return h(!1),[7];case 4:return[2]}})})},loading:I,disabled:!!(p.user&&o.discountSettings&&p.user.totalPoint<o.discountSettings.point)}:y&&f?{text:y,onClick:f}:void 0,k=C&&w?"accordion":"card";return n.createElement(a,{title:D,description:E,icon:T,action:M,isCompleted:!1,mode:k,padding:g,settings:{borderRadius:b.settings.cartBorderRadius,widgetIconType:b.settings.widgetIconType,button:b.button}},C?n.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"16px"}},w&&n.createElement(u,{viewModel:p,method:o})):null)}),y=o(function(t){var i=t.viewModel,o=t.mode,r=void 0===o?"card":o,d=t.getActionProps,s=t.methods,a=i.spendingMethods,c=e([],s||a,!0).sort(function(e,t){return e.isDynamic&&!t.isDynamic?-1:!e.isDynamic&&t.isDynamic?1:0}),l="accordion"===r?"16px":void 0;return n.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"12px",padding:"accordion"===r?"0 16px":"0 24px"}},c.map(function(e){var t=d?d(e):null;return n.createElement(p,{key:e.id,method:e,viewModel:i,mode:r,padding:l,actionText:null==t?void 0:t.actionText,onClick:null==t?void 0:t.onClick})}))});export{y as default};
+import{__spreadArray as e,__awaiter as t,__generator as i}from'./../../../../ext/tslib/tslib.es6.mjs.js';import{observer as n}from"mobx-react";import o,{useState as r}from"react";import'./../../../../ext/react-i18next/dist/es/context.js';import{useTranslation as d}from'./../../../../ext/react-i18next/dist/es/useTranslation.js';import{LoyaltyProgramMethodSpendingTypeEnum as a,LoyaltyProgramFilterTypeEnum as s,LoyaltyWidgetScreenTypeEnum as l}from"../../../../models/types/index.js";import c from"../../../components/button/index.js";import m from"../../../components/loyalty-method-card/index.js";import{getFreeProductName as u,getFilterDetails as p}from"../../../utils/loyalty-details.js";import{getSpendingMethodTitle as g,getSpendingMethodDescription as y,getSpendingMethodIcon as f}from"../../../../utils.js";import v from"./dynamic-slider.js";var E=n(function(e){var n,E,x=e.method,R=e.viewModel,h=e.actionText,A=e.padding,b=e.onClick,T=e.mode,C=d().t,D=r(!1),S=D[0],I=D[1],M=R.loyaltyWidget,_=g(x),O=y(x,R),P=f(x.type,M.settings.widgetIconType),k=x.productFilters||[],j=x.type===a.FREE_PRODUCT,w=j&&(null===(n=x.discountSettings)||void 0===n?void 0:n.freeProductId)?u(R,x.discountSettings.freeProductId):void 0,N=j&&!!w,B=null===(E=x.pointUsageLimit)||void 0===E?void 0:E.minPointLimit,L=!x.isDynamic&&!!R.user&&!!R.cartId,U=x.isDynamic&&!!R.user&&!!R.cartId,z=x.isDynamic,W="accordion"===T||z&&U?"accordion":"card",F=function(){return t(void 0,void 0,void 0,function(){var e;return i(this,function(t){switch(t.label){case 0:if(!R.cartId||!x.isAvailable)return[2];I(!0),t.label=1;case 1:return t.trys.push([1,,3,4]),[4,null===(e=R.callbacks)||void 0===e?void 0:e.useLoyaltyPoints({cartId:R.cartId,loyaltyProgramId:x.loyaltyProgramId,loyaltySpendingMethodId:x.id})];case 2:return t.sent()&&(R.userRefreshTrigger++,R.cartRefreshTrigger++,R.selectedScreen!==l.MAIN_SCREEN&&(R.selectedScreen=l.MAIN_SCREEN)),[3,4];case 3:return I(!1),[7];case 4:return[2]}})})},G="card"===W&&L&&!z?{text:C("common.use"),onClick:F,loading:S}:h&&b?{text:h,onClick:b}:void 0;return o.createElement(m,{title:_,description:O,icon:P,action:G,isCompleted:!1,mode:W,padding:A,settings:{borderRadius:M.settings.cartBorderRadius,widgetIconType:M.settings.widgetIconType,button:M.button}},"accordion"!==W?null:o.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"16px"}},B&&B>0&&o.createElement("div",{style:{fontSize:"14px",color:"#475467",lineHeight:"20px",fontWeight:400}},C("spendingMethods.minPointLimit",{points:B})),N&&o.createElement("div",{style:{fontSize:"14px",color:"#475467",lineHeight:"20px",fontWeight:400}},C("spendingMethods.FREE_PRODUCT.description",{product:w})),k.map(function(e,t){var i=p(R,e.type,e.idList);if(!i.length)return null;var n=i[0],r=n.name,d="";switch(n.type){case s.CATEGORY:case s.DYNAMIC_CATEGORY:d=C("earningMethods.ORDER_CREATE.BASE.descriptionOnlyCategory",{category:r});break;case s.PRODUCT_AND_VARIANT:d=C("earningMethods.ORDER_CREATE.BASE.descriptionOnlyProduct",{product:r});break;case s.PRODUCT_BRAND:d=C("earningMethods.ORDER_CREATE.BASE.descriptionOnlyBrand",{brand:r});break;case s.PRODUCT_TAG:d=C("earningMethods.ORDER_CREATE.BASE.descriptionOnlyTag",{tag:r})}return!d&&r&&(d=r),d?o.createElement("div",{key:t,style:{fontSize:"14px",color:"#475467",lineHeight:"20px",fontWeight:400}},d):null}),U&&o.createElement(v,{viewModel:R,method:x}),L&&!z&&o.createElement("div",{style:{alignSelf:"flex-end",width:"100%"}},o.createElement(c,{button:M.button,paddingSize:"small",fontSize:"textSMMedium",onClick:F,isLoading:S,disabled:!x.isAvailable,fullWidth:!0},C("common.use")))))}),x=n(function(t){var i=t.viewModel,n=t.mode,r=void 0===n?"card":n,d=t.getActionProps,a=t.methods,s=i.spendingMethods,l=e([],a||s,!0).sort(function(e,t){return e.isAvailable&&!t.isAvailable?-1:!e.isAvailable&&t.isAvailable?1:e.isDynamic&&!t.isDynamic?-1:!e.isDynamic&&t.isDynamic?1:0}),c="accordion"===r?"16px":void 0;return o.createElement("div",{style:{display:"flex",flexDirection:"column",gap:"12px",padding:"accordion"===r?"0 16px":"0 24px"}},l.map(function(e){var t=d?d(e):null;return o.createElement(E,{key:e.id,method:e,viewModel:i,mode:r,padding:c,actionText:null==t?void 0:t.actionText,onClick:null==t?void 0:t.onClick})}))});export{x as default};

package/build/renderer/utils/loyalty-details.js

@@ -1 +1 @@
-import{__spreadArray as e}from'./../../ext/tslib/tslib.es6.mjs.js';import{EarningMethodTypeEnum as n,LoyaltyProgramPointEarningTypeEnum as r,LoyaltyProgramFilterTypeEnum as t}from"../../models/types/index.js";var i=function(e,n,r){if(!r||0===r.length)return[];var i=[];return r.forEach(function(r){var a="";switch(n){case t.CATEGORY:case t.DYNAMIC_CATEGORY:if(e.categories){var o=e.categories.find(function(e){return e.id===r});o&&(a=o.name)}break;case t.PRODUCT_AND_VARIANT:if(e.products){var s=e.products.find(function(e){return e.id===r});s&&(a=s.name)}break;case t.PRODUCT_BRAND:if(e.brands){var c=e.brands.find(function(e){return e.id===r});c&&(a=c.name)}break;case t.PRODUCT_TAG:if(e.tags){var E=e.tags.find(function(e){return e.id===r});E&&(a=E.name)}}a?i.push({type:n,name:a,id:r}):i.push({type:n,name:r,id:r})}),i},a=function(a,o,s){var c,E;switch(o.methodType){case n.CUSTOMER_REGISTER:case n.CUSTOMER_REVIEW:case n.ENABLE_SUBSCRIPTION:return a("earningMethods.xPoints",{points:o.pointsEarned});case n.ORDER_CREATE:var d=e(e([],(null===(c=o.productSettings)||void 0===c?void 0:c.productFilters)||[],!0),(null===(E=o.orderSettings)||void 0===E?void 0:E.productFilters)||[],!0),u=d.reduce(function(e,n){return e.concat(i(s,n.type,n.idList))},[]),R=u.map(function(e){switch(e.type){case t.CATEGORY:case t.DYNAMIC_CATEGORY:return a("earningMethods.ORDER_CREATE.BASE.genericCategory",{category:e.name});case t.PRODUCT_AND_VARIANT:return a("earningMethods.ORDER_CREATE.BASE.genericProduct",{product:e.name});case t.PRODUCT_BRAND:return a("earningMethods.ORDER_CREATE.BASE.genericBrand",{brand:e.name});case t.PRODUCT_TAG:return a("earningMethods.ORDER_CREATE.BASE.genericTag",{tag:e.name});default:return e.name}}).filter(Boolean).join(", "),A=o.orderSettings||{},m=A.minOrderAmount,T=A.maxOrderAmount,f="number"==typeof T&&T>0,C="";switch("number"==typeof m&&m>0?C=a("earningMethods.ORDER_CREATE.BASE.descriptionStaticMinimum",{amount:s.formatCurrency(m)}):f&&(C=a("earningMethods.ORDER_CREATE.BASE.descriptionStaticMaximum",{amount:s.formatCurrency(T)})),o.pointEarningType){case r.DYNAMIC_ORDER_AMOUNT:return(p=[R,C,a("earningMethods.ORDER_CREATE.RECEIVE_POINTS_ON_SPEND.description",{amount:s.formatCurrency(o.amountPerPointsEarned||0),points:o.pointsEarned})].filter(Boolean)).join(" ");case r.STATIC:var p;return 0===(p=[R,C].filter(Boolean)).length?void d.length:!C&&R?R+" "+a("earningMethods.ORDER_CREATE.BASE.descriptionSuffix"):p.join(", ")}break;default:return""}};export{a as getEarningMethodDescriptionV2,i as getFilterDetails};
+import{__spreadArray as e}from'./../../ext/tslib/tslib.es6.mjs.js';import{EarningMethodTypeEnum as n,LoyaltyProgramPointEarningTypeEnum as r,LoyaltyProgramFilterTypeEnum as t}from"../../models/types/index.js";var i=function(e,n,r){if(!r||0===r.length)return[];var i=[];return r.forEach(function(r){var a="";switch(n){case t.CATEGORY:case t.DYNAMIC_CATEGORY:if(e.categories){var o=e.categories.find(function(e){return e.id===r});o&&(a=o.name)}break;case t.PRODUCT_AND_VARIANT:if(e.products){var s=e.products.find(function(e){return e.id===r});s&&(a=s.name)}break;case t.PRODUCT_BRAND:if(e.brands){var c=e.brands.find(function(e){return e.id===r});c&&(a=c.name)}break;case t.PRODUCT_TAG:if(e.tags){var d=e.tags.find(function(e){return e.id===r});d&&(a=d.name)}}a?i.push({type:n,name:a,id:r}):i.push({type:n,name:r,id:r})}),i},a=function(e,n){if(e.products){var r=e.products.find(function(e){return e.id===n});return r?r.name:void 0}},o=function(a,o,s){var c,d;switch(o.methodType){case n.CUSTOMER_REGISTER:case n.CUSTOMER_REVIEW:case n.ENABLE_SUBSCRIPTION:return a("earningMethods.xPoints",{points:o.pointsEarned});case n.ORDER_CREATE:var u=e(e([],(null===(c=o.productSettings)||void 0===c?void 0:c.productFilters)||[],!0),(null===(d=o.orderSettings)||void 0===d?void 0:d.productFilters)||[],!0),E=u.reduce(function(e,n){return e.concat(i(s,n.type,n.idList))},[]),R=E.map(function(e){switch(e.type){case t.CATEGORY:case t.DYNAMIC_CATEGORY:return a("earningMethods.ORDER_CREATE.BASE.genericCategory",{category:e.name});case t.PRODUCT_AND_VARIANT:return a("earningMethods.ORDER_CREATE.BASE.genericProduct",{product:e.name});case t.PRODUCT_BRAND:return a("earningMethods.ORDER_CREATE.BASE.genericBrand",{brand:e.name});case t.PRODUCT_TAG:return a("earningMethods.ORDER_CREATE.BASE.genericTag",{tag:e.name});default:return e.name}}).filter(Boolean).join(", "),m=o.orderSettings||{},A=m.minOrderAmount,f=m.maxOrderAmount,T="number"==typeof f&&f>0,p="";switch("number"==typeof A&&A>0?p=a("earningMethods.ORDER_CREATE.BASE.descriptionStaticMinimum",{amount:s.formatCurrency(A)}):T&&(p=a("earningMethods.ORDER_CREATE.BASE.descriptionStaticMaximum",{amount:s.formatCurrency(f)})),o.pointEarningType){case r.DYNAMIC_ORDER_AMOUNT:return(C=[R,p,a("earningMethods.ORDER_CREATE.RECEIVE_POINTS_ON_SPEND.description",{amount:s.formatCurrency(o.amountPerPointsEarned||0),points:o.pointsEarned})].filter(Boolean)).join(" ");case r.STATIC:var C;return 0===(C=[R,p].filter(Boolean)).length?void u.length:!p&&R?R+" "+a("earningMethods.ORDER_CREATE.BASE.descriptionSuffix"):C.join(", ")}break;default:return""}};export{o as getEarningMethodDescriptionV2,i as getFilterDetails,a as getFreeProductName};