@salla.sa/twilight-components 2.14.454 → 2.14.455

package/dist/cjs/salla-user-menu.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 var keyboard_arrow_down = require('./keyboard_arrow_down-DHJ3FFZq.js');
 var bellRing = require('./bell-ring-BfKPinNo.js');
 var cart = require('./cart-s-x1Fshk.js');

package/dist/cjs/salla-user-profile.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 var interfaces = require('./interfaces-CRqrf5RX.js');
 
 const sallaUserProfileCss = ":host{display:block}";

package/dist/cjs/salla-user-settings.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 
 var Bullhorn = `<!-- Generated by IcoMoon.io -->
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">

package/dist/cjs/salla-verify.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 var mail = require('./mail-Bgvt2hc9.js');
 
 var AndroidPhoneIcon = `<!-- Generated by IcoMoon.io -->

package/dist/cjs/salla-wallet.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 
 const sallaWalletCss = ".s-wallet-table{min-width:100%}.s-wallet-table-balance-container{display:flex !important;align-items:center !important;justify-content:flex-start !important;gap:1rem}.s-wallet-table-balance-icon{border-radius:50%;width:52px;height:52px;font-size:25px;padding:16px 13px;background:var(--color-primary-reverse);color:var(--color-primary)}.s-wallet-table-empty-state{display:flex;flex-direction:column;align-items:center}.s-wallet-table-empty-state i{font-size:80px;margin:4rem 0 2rem;color:var(--infinte-color)}.s-wallet-table-transaction-status{padding:6px 19px !important;border-radius:20px;width:max-content;display:flex;align-items:center}.s-wallet-table-transaction-status-default{background:#fff6eb;color:#a46f29}.s-wallet-table-transaction-status-cashback{background:#effbf6;color:#00af6c}.s-wallet-table-transaction-status-refund{background:#ecf3fe;color:#5196f3}.s-wallet-table-transaction-status-purchase{background:#feecec;color:#f55157}.s-wallet-table-transaction-status-icons-success{color:#00af6c}";
 

package/dist/cjs/{tracked-promise-D_CjjRbz.js → tracked-promise-TlVxYBIU.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 
 function TrackedPromise(fn, options = {}) {
     options = Object.assign({ initialData: undefined, initialStatus: 'idle' }, options);

package/dist/cjs/{translations-DMwpLvqi.js → translations-BHyDCj-Y.js}

@@ -24,6 +24,14 @@ const translations = {
         ar: 'خطوات بسيطة تفصلك عن المزيد من نقاط الولاء!',
         en: 'Two simple steps separate you from great rewards!',
     },
+    'pages.loyalty_program.how_to_use': {
+        ar: 'آلية الإستخدام',
+        en: 'How to use?',
+    },
+    'pages.loyalty_program.how_to_use_steps': {
+        ar: 'يمكنك اكتساب النقاط عند الشراء من التصنيفات المحددة',
+        en: 'You can earn points when you purchase from the selected categories.',
+    },
     'pages.loyalty_program.register': {
         ar: 'سجِّل',
         en: 'Register',
@@ -60,6 +68,10 @@ const translations = {
         ar: 'نقطة',
         en: 'points',
     },
+    'pages.loyalty_program.start_from': {
+        ar: 'يبدأ من',
+        en: 'Start from',
+    },
     'pages.loyalty_program.redeem_reward': {
         ar: 'استبدل النقاط',
         en: 'Redeem Reward',

package/dist/cjs/twilight.cjs.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 /*

package/dist/cjs/{vanilla-picker-Cx13ViIR.js → vanilla-picker-B3HS631p.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DppdveKW.js');
+var index = require('./index-CXqniRSt.js');
 
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

package/dist/collection/components/salla-loyalty-program/functions.js

@@ -35,19 +35,34 @@ export function brand_path(brand) {
     return [brand.name.replace(/\s/g, '-'), `brand-${brand.id}`].join('/');
 }
 export function isUnitOrder(point) {
-    for (const condition of (point.conditions ?? [])) {
-        if (condition.key?.endsWith('_FOR_UNIT')) {
+    for (const condition of point.conditions) {
+        if (condition.key.endsWith('_FOR_UNIT') || condition.key.endsWith('_FOR_UNIT_BY_CATEGORIES')) {
             return true;
         }
     }
-    return false;
 }
-export function formattedPointsJsx(value) {
+export function isRangePoints(point) {
+    for (const condition of point.conditions) {
+        if (condition.key.endsWith('_BY_CATEGORIES') && point.conditions.length > 1) {
+            return true;
+        }
+    }
+}
+export function getPoints(point) {
+    if (isRangePoints(point)) {
+        return point.conditions.sort((a, b) => a.points - b.points)[0].points;
+    }
+    return point.points;
+}
+export function formattedPointsJsx(value, isUnit = false, isRange = false) {
     if (typeof value === 'number') {
-        return h("span", null, value, " ", salla.lang.get('pages.loyalty_program.point'));
+        if (isUnit) {
+            return h("span", null, isRange ? salla.lang.get('pages.loyalty_program.start_from') : '', " 1 ", salla.config.currency().symbol, " = ", value, " ", salla.lang.get('pages.loyalty_program.point'));
+        }
+        return h("span", null, isRange ? salla.lang.get('pages.loyalty_program.start_from') : '', " ", value, " ", salla.lang.get('pages.loyalty_program.point'));
     }
     if (isUnitOrder(value)) {
-        return h("span", null, "1 ", salla.config.currency().symbol, " = ", value.points, " ", salla.lang.get('pages.loyalty_program.point'));
+        return h("span", null, isRangePoints(value) ? salla.lang.get('pages.loyalty_program.start_from') : '', " 1 ", salla.config.currency().symbol, " = ", getPoints(value), " ", salla.lang.get('pages.loyalty_program.point'));
     }
-    return h("span", null, value.points, " ", salla.lang.get('pages.loyalty_program.point'));
+    return h("span", null, isRangePoints(value) ? salla.lang.get('pages.loyalty_program.start_from') : '', " ", getPoints(value), " ", salla.lang.get('pages.loyalty_program.point'));
 }

package/dist/collection/components/salla-loyalty-program/salla-loyalty-point.js

@@ -2,7 +2,7 @@
  * Crafted with ❤ by Salla
  */
 import { h } from "@stencil/core";
-import { closeModals, formattedPointsJsx } from "./functions";
+import { closeModals, formattedPointsJsx, isUnitOrder } from "./functions";
 import SIGift from "../../assets/svg/gift.svg";
 import SICart2 from "../../assets/svg/cart2.svg";
 import SIStore from "../../assets/svg/store.svg";
@@ -10,6 +10,7 @@ import SIUserAdd from "../../assets/svg/user-add.svg";
 import SIChatConversationAlt from "../../assets/svg/chat-conversation-alt.svg";
 import SILink1 from "../../assets/svg/link1.svg";
 import SIUser from "../../assets/svg/user.svg";
+import SITag from "../../assets/svg/tag.svg";
 import SIMail from "../../assets/svg/mail.svg";
 import SICalendar from "../../assets/svg/calendar.svg";
 import SIiPhoneX from "../../assets/svg/iphone-x.svg";
@@ -26,11 +27,16 @@ import SIShipping from "../../assets/svg/shipping.svg";
  * pos - sicon-store
  * fill profile - sicon-user-add
  */
+const c = (...args) => args.map(i => 's-loyalty-program-' + i).join(' ');
 const sicons = {
     'FIRST_ORDER_STORE_FOR_UNIT': h("span", { innerHTML: SICart2 }),
+    'FIRST_ORDER_STORE_FOR_UNIT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'FIRST_ORDER_STORE_FIX_AMOUNT': h("span", { innerHTML: SICart2 }),
+    'FIRST_ORDER_STORE_FIX_AMOUNT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'ORDER_FROM_APP_FOR_UNIT': h("span", { innerHTML: SICart2 }),
+    'ORDER_FROM_APP_FOR_UNIT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'ORDER_FROM_APP_FIX_AMOUNT': h("span", { innerHTML: SICart2 }),
+    'ORDER_FROM_APP_FIX_AMOUNT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'CONDITION_RATING_SHIPPING_STORE': h("span", { innerHTML: SIStore }),
     'CONDITION_RATING_PRODUCT': h("span", { innerHTML: SIChatConversationAlt }),
     'CONDITION_RATING_SHIPPING_COMPANY': h("span", { innerHTML: SIShipping }),
@@ -39,13 +45,17 @@ const sicons = {
     'CONDITION_COMPLETE_PERSONAL_INFORMATION_MOBILE': h("span", { innerHTML: SIiPhoneX }),
     'CONDITION_COMPLETE_PERSONAL_INFORMATION_GENDER': h("span", { innerHTML: SIUser }),
     'CONDITION_BUY_FROM_STORE_FOR_UNIT': h("span", { innerHTML: SICart2 }),
+    'CONDITION_BUY_FROM_STORE_FOR_UNIT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'CONDITION_BUY_FROM_STORE_FIX_AMOUNT': h("span", { innerHTML: SICart2 }),
+    'CONDITION_BUY_FROM_STORE_FIX_AMOUNT_BY_CATEGORIES': h("span", { innerHTML: SICart2 }),
     'order_from_pos_1': h("span", { innerHTML: SIiPhoneX }),
     'order_from_pos_2': h("span", { innerHTML: SILocation }),
     'buy_from_pos_1': h("span", { innerHTML: SIMapLocation }),
     'buy_from_pos_2': h("span", { innerHTML: SIiPhoneX }),
     'CONDITION_BUY_FROM_POS_FOR_UNIT': h("span", { innerHTML: SIiPhoneX }),
+    'CONDITION_BUY_FROM_POS_FOR_UNIT_BY_CATEGORIES': h("span", { innerHTML: SIiPhoneX }),
     'CONDITION_BUY_FROM_POS_FIX_AMOUNT': h("span", { innerHTML: SIiPhoneX }),
+    'CONDITION_BUY_FROM_POS_FIX_AMOUNT_BY_CATEGORIES': h("span", { innerHTML: SIiPhoneX }),
     'affiliate_link_1': h("span", { innerHTML: SILink1 }),
     'affiliate_link_2': h("span", { innerHTML: SIUserAdd }),
     'affiliate_link_3': h("span", { innerHTML: SICart2 }),
@@ -141,6 +151,22 @@ export class SallaLoyaltyPoint {
                 return '';
         }
     }
+    getSteps(point) {
+        if (!!point.steps.length) {
+            return (h("div", { class: "s-loyalty-program-points-chains-wrapper" }, h("ul", { class: "s-loyalty-program-points-chain-list" }, this.point.steps.map((step, idx) => h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[step.key]), h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", { innerHTML: SIGift }), h("span", null, salla.lang.get(`pages.loyalty_program.step_${idx + 1}`))), h("p", { class: "s-loyalty-program-points-chain-description" }, salla.lang.get(`pages.loyalty_program.${step.key}`, { points: this.point.points }))))))));
+        }
+        return '';
+    }
+    getDetails(point) {
+        if (point.conditions.filter(c => c.key.endsWith('_BY_CATEGORIES')).length > 0) {
+            return (h("div", null, h("div", { class: "s-loyalty-program-point-subheading" }, h("h2", null, salla.lang.get('pages.loyalty_program.how_to_use')), h("p", null, salla.lang.get('pages.loyalty_program.how_to_use_steps'))), h("div", { class: "s-loyalty-program-points-modal-details" }, point.conditions.map((condition) => h("div", { class: "s-loyalty-program-points-chains-wrapper mt-5 mb-5" }, h("div", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[condition.key])), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", { innerHTML: SIGift }), formattedPointsJsx(condition.points, isUnitOrder(point))), h("p", { class: "s-loyalty-program-points-chain-description" }, condition.name), h("div", null, this.getCategoriesJsx(condition.value)))))))));
+        }
+        return (h("div", { class: "s-loyalty-program-points-modal-details" }, h("div", { class: "s-loyalty-program-points-chains-wrapper mt-5 mb-5" }, h("ul", { class: "s-loyalty-program-points-chain-list" }, this.point.conditions.map((condition) => h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[condition.key]), h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", { innerHTML: SIGift }), formattedPointsJsx(condition.points, isUnitOrder(point), condition.value != null)), h("p", { class: "s-loyalty-program-points-chain-description" }, condition.name))))))));
+    }
+    getCategoriesJsx(categories) {
+        return !categories.length ? '' :
+            h("ul", { class: c('reward-details-categories-list') }, categories.map((category) => (h("li", null, h("a", { href: category.url, class: c('reward-details-categories-item') }, h("span", { innerHTML: SITag }), h("span", { class: c('reward-details-categories-item-content') }, category.name))))));
+    }
     getTrailingContent(point) {
         switch (point.type) {
             case 'first_order':
@@ -151,7 +177,7 @@ export class SallaLoyaltyPoint {
         }
     }
     render() {
-        return (h("div", { key: '1a96a88716d9fa2b3e8aac4864a025824c48d36a' }, h("div", { key: '13bc00fa473bfb16b272d751b45ad7384db0fc43', onClick: () => closeModals(() => this.modal.open()), class: "s-loyalty-program-point-wrapper" }, h("div", { key: 'a7d6d5f9692c7454d6bd9aa350c4934ec1704002', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-sm s-loyalty-program-circle-variant-fill" }, h("span", { key: '2e26922099bbc8d1d46d48d807f09b195868a262', class: this.point.icon })), h("div", { key: 'ea7c80d9fd595d1e319fb9840cfa7dc439ad2bbb', class: "s-loyalty-program-points-badge-mobile" }, h("salla-badge", { key: '76c01bd0380e5729989ae4b748d7e59f334b40b8', size: "xs", bg: "transparent" }, h("span", { key: 'b459db33b3926952415e2ac6a9b383a53467bc7f', innerHTML: SIGift }), formattedPointsJsx(this.point))), h("div", { key: '528f5f6e1c36c637b69684d95ec304f9c129400e', class: "s-loyalty-program-points-badge-desktop" }, h("salla-badge", { key: '9360900b49e9b122c3de07ad08de0cc0e8eccec4', size: "sm", bg: "transparent" }, h("span", { key: '7786c402cb6b946f9fd6402e1d066ad58ae4c0d4', innerHTML: SIGift }), formattedPointsJsx(this.point))), h("p", { key: 'e6e4e93f0cdbd7dfd0dc39f279cac0bbb9ca4fa8', class: "s-loyalty-program-point-description" }, this.point.name), this.point.is_completed ?
+        return (h("div", { key: 'da9f8ed073dad418e72c05c54b0362dbd35f3935' }, h("div", { key: '884b4463371c9e806c5a0b050eb977628b46c800', onClick: () => closeModals(() => this.modal.open()), class: "s-loyalty-program-point-wrapper" }, h("div", { key: 'eb992d3f22972cd1bcfd475f35652a99887450c0', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-sm s-loyalty-program-circle-variant-fill" }, h("span", { key: '449c106f8babe36f6cc9b2273886aa4e2b81fe15', class: this.point.icon })), h("div", { key: 'e52de07a850e0e46799aba2f031f492d8f18dcb3', class: "s-loyalty-program-points-badge-mobile" }, h("salla-badge", { key: '4174dd5fa7c2e60725d53b3e9d7868a5f450f7ba', size: "xs", bg: "transparent" }, h("span", { key: 'a8ff60258c58e6901d7438c239296ce2563cafd2', innerHTML: SIGift }), formattedPointsJsx(this.point))), h("div", { key: '2196dee1a40e48a2cb7e53038e7e42a39863ad72', class: "s-loyalty-program-points-badge-desktop" }, h("salla-badge", { key: 'fd3ccf58c671317ceffdd0615c443671354a31de', size: "sm", bg: "transparent" }, h("span", { key: 'f21842a6f380f20d4de80df057852cbd48befa4e', innerHTML: SIGift }), formattedPointsJsx(this.point))), h("p", { key: '7593ae79293d532ec6c3e6456c3434fc5b2beb29', class: "s-loyalty-program-point-description" }, this.point.name), this.point.is_completed ?
             h("a", { class: {
                     's-loyalty-program-points-action': true,
                     's-loyalty-program-points-action-completed': this.point.is_completed,
@@ -161,16 +187,12 @@ export class SallaLoyaltyPoint {
                     's-loyalty-program-points-action': true,
                     's-loyalty-program-points-action-completed': this.point.is_completed,
                     's-loyalty-program-points-action-incomplete': !this.point.is_completed,
-                } }, this.point.description)), h("salla-modal", { key: '1b4bbdf4a31b15a05de6e82eaba7e41623bb7926', ref: modal => this.modal = modal, class: "s-loyalty-program-point-modal s-loyalty-program-modal", width: window.matchMedia('(min-width: 768px)').matches ? 'md' : 'sm', noPadding: true }, h("div", { key: 'dd47de6d728d0e242ba907df2ad5efac90eca3bc', class: "s-loyalty-program-points-modal-header" }, h("h1", { key: '5b683091ac479ada36a8a653379973399ef7a9e9', class: "s-loyalty-program-points-modal-info" }, this.point.name)), h("div", { key: '76a05aedcc3b13f44709e369bf16c9c992689406', class: "s-loyalty-program-modal-scrollable-content" }, h("div", { key: 'a71c0eb9f39a103728974e687dfcb9be5d8d9be7', class: "s-loyalty-program-points-modal-main" }, h("div", { key: 'de83e494131791cae7df3782489be5f1d2ffcb4d', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xl s-loyalty-program-circle-variant-fill" }, h("span", { key: '2c8faf8db0b4984d0c9319e18343e41d9a6d0d26', class: this.point.icon })), h("salla-badge", { key: 'b29e2f350840663bb36dff05124aa58a3c774640', size: "sm", bg: "light" }, h("span", { key: '0d6cc163f3b14710bca60c5e4fb9c602ff8416a1', innerHTML: SIGift }), h("span", { key: 'a9ddb1a5ed1c69e0c2017691f67d360f189d4b37', class: "s-loyalty-program-points-badge-points" }, formattedPointsJsx(this.point)))), this.getSubHeading(this.point), h("div", { key: '3327f05f80fec2ddceed0e6f230f0a99020445cc', class: "s-loyalty-program-points-modal-details" }, h("div", { key: 'd5505b3ab399f5d0b668c02bbf441eee33b4a1b2', class: "s-loyalty-program-points-chains-wrapper" }, h("ul", { key: 'dc9b64ad5795e87a12ffd104c5d6bbbade1c2a2e', class: "s-loyalty-program-points-chain-list" }, !!this.point.steps && Object.keys(this.point.steps).length > 0
-            ? Object.values(this.point.steps).map((step, idx) => {
+                } }, this.point.description)), h("salla-modal", { key: '90be47d92f0ae74242c304c3b8d5c12c5a0a4649', ref: modal => this.modal = modal, class: "s-loyalty-program-point-modal s-loyalty-program-modal", width: window.matchMedia('(min-width: 768px)').matches ? 'md' : 'sm', noPadding: true }, h("div", { key: '00afe4584f14da0fd383f7e3109486541ca157f7', class: "s-loyalty-program-points-modal-header" }, h("h1", { key: 'd6af2b363b64fa2490bcaf1039f7128e63df6121', class: "s-loyalty-program-points-modal-info" }, this.point.name)), h("div", { key: 'e3cf11bcab3be81bfa63f03a75f2d655c38fc95e', class: "s-loyalty-program-modal-scrollable-content" }, h("div", { key: 'ce0a574cbcaabd7ac589e1e3be33708e664dbc08', class: "s-loyalty-program-points-modal-main" }, h("div", { key: 'c974151e5162d8dd0ab2bc75bae20966efb268f1', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xl s-loyalty-program-circle-variant-fill" }, h("span", { key: '81d369d4f8d7ee6650cef1b55ce740c64716b2bd', class: this.point.icon })), h("salla-badge", { key: '0146ac225e7d54d14bcf5e53ba6c5325e0da260f', size: "sm", bg: "light" }, h("span", { key: '0653cb7799ed999c61cd7d5b6d350bcbaf7a5d95', innerHTML: SIGift }), h("span", { key: '67a397aabbc889ceff3cdcf1e37ecc2614702369', class: "s-loyalty-program-points-badge-points" }, formattedPointsJsx(this.point)))), this.getSubHeading(this.point), !!this.point.steps && Object.keys(this.point.steps).length > 0 &&
+            h("div", { key: '3d270563818b923112c889b291ad72ef6a15b9bc', class: "s-loyalty-program-points-modal-details" }, h("div", { key: '0157d2d96b4b7dac9c687cef58af87fdb4871fc1', class: "s-loyalty-program-points-chains-wrapper" }, h("ul", { key: '469624383bad345a97ca9b74980d2a1499aa1b6a', class: "s-loyalty-program-points-chain-list" }, Object.values(this.point.steps).map((step, idx) => {
                 const stepsArray = Object.values(this.point.steps);
                 const isLastItem = idx === stepsArray.length - 1;
                 return (h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[step.key]), !isLastItem && h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", null, salla.lang.get(`pages.loyalty_program.step_${idx + 1}`))), h("p", { class: "s-loyalty-program-points-chain-description" }, step.title || step.name))));
-            })
-            : this.point.conditions?.map((condition, idx) => {
-                const isLastItem = idx === this.point.conditions.length - 1;
-                return (h("li", { class: "s-loyalty-program-points-chain-item" }, h("div", { class: "s-loyalty-program-points-chain-icon" }, h("div", { class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xs s-loyalty-program-circle-variant-outline-primary" }, sicons[condition.key]), !isLastItem && h("div", { class: "s-loyalty-program-points-chain-line" })), h("div", { class: "s-loyalty-program-points-chain-content" }, h("salla-badge", { size: "xs", color: "primary-900", bg: "primary-100" }, h("span", { innerHTML: SIGift }), formattedPointsJsx(condition.points ?? 0)), h("p", { class: "s-loyalty-program-points-chain-description" }, condition.name))));
-            }))), this.getTrailingContent(this.point)), !this.point.branches?.length ? '' : h("div", { class: "s-loyalty-program-points-modal-list" }, h("div", { class: "s-loyalty-program-point-details-branches" }, h("h2", null, salla.lang.get('pages.loyalty_program.branches')), h("p", null, salla.lang.get('pages.loyalty_program.shop_from_branches'))), h("div", { class: "s-loyalty-program-points-modal-list-wrapper" }, h("ul", null, this.point.branches.map((branch) => (h("li", { class: "s-loyalty-program-points-modal-list-item" }, h("p", null, branch.name), h("salla-badge", { size: "sm", bg: "transparent" }, h("span", { innerHTML: SIGift }), h("a", { href: branch.location ? `https://www.google.com/maps?q=${branch.location.lat},${branch.location.lon}` : '#', target: "_blank", rel: "noopener noreferrer" }, branch.address_description))))))))), h("div", { key: '685d0de853bd3becf1c10529768a5952b6365517', class: "s-loyalty-program-points-modal-action" }, h("a", { key: '806543e483c0872139ee395ee9ba2dbe27061564', href: this.point.url, onClick: (e) => (e.stopPropagation(), this.handleAction(e, this.point)), class: {
+            })))), this.getDetails(this.point), h("div", { key: 'bba31447df26e2a50a28cb6af922d49ec52a854b', class: "s-loyalty-program-points-modal-details" }, this.getTrailingContent(this.point)), !this.point.branches?.length ? '' : h("div", { class: "s-loyalty-program-points-modal-list" }, h("div", { class: "s-loyalty-program-point-details-branches" }, h("h2", null, salla.lang.get('pages.loyalty_program.branches')), h("p", null, salla.lang.get('pages.loyalty_program.shop_from_branches'))), h("div", { class: "s-loyalty-program-points-modal-list-wrapper" }, h("ul", null, this.point.branches.map((branch) => (h("li", { class: "s-loyalty-program-points-modal-list-item" }, h("p", null, branch.name), h("salla-badge", { size: "sm", bg: "transparent" }, h("span", { innerHTML: SIGift }), h("a", { href: branch.location ? `https://www.google.com/maps?q=${branch.location.lat},${branch.location.lon}` : '#', target: "_blank", rel: "noopener noreferrer" }, branch.address_description))))))))), h("div", { key: 'c6c84d25fddc848235682d14cc0e4755e91deb95', class: "s-loyalty-program-points-modal-action" }, h("a", { key: '1f7fbf431f89bb0d08e531ea4e6fb41109cad50e', href: this.point.url, onClick: (e) => (e.stopPropagation(), this.handleAction(e, this.point)), class: {
                 's-loyalty-program-points-action': true,
                 's-loyalty-program-points-action-completed': this.point.is_completed,
                 's-loyalty-program-points-action-incomplete': !this.point.is_completed,

package/dist/collection/components/salla-loyalty-program/salla-loyalty-program.js

@@ -89,7 +89,13 @@ export class SallaLoyaltyProgram {
             ? h("span", null, salla.lang.get('pages.loyalty_program.show_more'), "\u00A0\u00A0", h("span", { style: { fontSize: '1.2rem', fontWeight: '300' } }, "+"))
             : h("span", null, salla.lang.get('pages.loyalty_program.show_less'), "\u00A0\u00A0", h("span", { style: { fontSize: '1.2rem', fontWeight: '300' } }, "-"))))), this.program.status !== 'success' ? '' : h("div", { class: "s-loyalty-program-rewards-container s-loyalty-program-slider-arrows-edges" }, h("section", { class: {
                 's-loyalty-program-tabs-hider': prizesGroups.length <= 2 || prizesCount <= 4,
-            } }, h("h1", { class: "s-loyalty-program-rewards-heading-mobile" }, salla.lang.get('pages.loyalty_program.rewards')), h("salla-tabs", null, h("div", { slot: "header", class: "s-loyalty-program-rewards-tab-items" }, prizesGroups.map((group) => (h("salla-tab-header", { slot: "header", name: group.type }, sicons[group.type], h("span", null, group.title))))), h("h1", { slot: "header", class: "s-loyalty-program-rewards-heading-desktop" }, salla.lang.get('pages.loyalty_program.rewards')), prizesGroups.map((group) => (h("salla-tab-content", { slot: "content", name: group.type }, h("salla-slider", { id: group.type, type: "default", "slider-config": '{"loop":false,"slidesPerView":"auto","freeMode":true,"spaceBetween":12,"breakpoints":{"768":{"slidesPerView":4,"spaceBetween":24,"freeMode":false,"speed":300}}}' }, h("div", { slot: "items" }, group.items.map((prize) => h("salla-reward-card", { prize: prize, onAreaClick: () => { this.currentPrize = prize; closeModals(() => this.detailsModal.open()); }, onActionClick: () => { this.currentPrize = prize; closeModals(() => this.detailsModal.open()); } })))))))), h("salla-modal", { ref: modal => this.detailsModal = modal, class: "s-loyalty-program-modal", width: "md", noPadding: true }, !this.currentPrize ? '' : h("salla-reward-details", { onActionClick: () => closeModals(() => this.exchangeModal.open()), prize: this.currentPrize })), h("salla-modal", { ref: modal => this.exchangeModal = modal, class: "s-loyalty-program-modal", width: "sm" }, !this.currentPrize ? '' : h("salla-reward-exchange", { prize: this.currentPrize }))))));
+            } }, h("h1", { class: "s-loyalty-program-rewards-heading-mobile" }, salla.lang.get('pages.loyalty_program.rewards')), h("salla-tabs", null, h("div", { slot: "header", class: "s-loyalty-program-rewards-tab-items" }, prizesGroups.map((group) => (h("salla-tab-header", { slot: "header", name: group.type }, sicons[group.type], h("span", null, group.title))))), h("h1", { slot: "header", class: "s-loyalty-program-rewards-heading-desktop" }, salla.lang.get('pages.loyalty_program.rewards')), prizesGroups.map((group) => (h("salla-tab-content", { slot: "content", name: group.type }, h("salla-slider", { id: group.type, type: "default", "slider-config": '{"loop":false,"slidesPerView":"auto","freeMode":true,"spaceBetween":12,"breakpoints":{"768":{"slidesPerView":4,"spaceBetween":24,"freeMode":false,"speed":300}}}' }, h("div", { slot: "items" }, group.items.map((prize) => h("salla-reward-card", { prize: prize, onAreaClick: () => {
+                this.currentPrize = prize;
+                closeModals(() => this.detailsModal.open());
+            }, onActionClick: () => {
+                this.currentPrize = prize;
+                closeModals(() => this.detailsModal.open());
+            } })))))))), h("salla-modal", { ref: modal => this.detailsModal = modal, class: "s-loyalty-program-modal", width: "md", noPadding: true }, !this.currentPrize ? '' : h("salla-reward-details", { onActionClick: () => closeModals(() => this.exchangeModal.open()), prize: this.currentPrize })), h("salla-modal", { ref: modal => this.exchangeModal = modal, class: "s-loyalty-program-modal", width: "sm" }, !this.currentPrize ? '' : h("salla-reward-exchange", { prize: this.currentPrize }))))));
     }
     static get is() { return "salla-loyalty-program"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-loyalty-program/salla-loyalty-reward.js

@@ -31,10 +31,10 @@ export class SallaLoyaltyReward {
         };
     }
     render() {
-        return (h("div", { key: 'ba9554fee3ffeb4e64410913c6f78217482eaa9b', class: {
+        return (h("div", { key: 'cc64d1446b539fa06a6fea4280992264816fed40', class: {
                 's-loyalty-program-reward-container': true,
                 's-loyalty-program-reward-xs': this.size === 'xs',
-            } }, h("div", { key: '807e949da96e8b307ed252e32ffafac682835a28', onClick: this.handleActionArea, role: "button" }, h("div", { key: '373862674986def57f35e1d006f41cb6b01b1e75', class: "s-loyalty-program-reward-img" }, h("img", { key: 'b8b072e962519aaf78d19c04759ee1590b0dd6de', src: this.prize.image, class: "s-loyalty-program-rewards-img", alt: "" })), h("div", { key: '9866bf65f0a26c3136b3e345094314c6552bd70e', class: "s-loyalty-program-reward-content" }, h("div", { key: 'ee8455df80b61e1c8d86059725e5da5952dab85a', class: "s-loyalty-program-reward-points" }, h("salla-badge", { key: '27b8f31d4b71255f1298bfd2c5705520b349db59', size: "xs" }, h("span", { key: 'e94f13b973bf0b5171b3aa1dd075ad5a0ee732c5', innerHTML: SIGift }), h("span", { key: '7776cb3a470b72ca2239fb2c8452711bf5dc59e2', class: "s-loyalty-program-rewards-points" }, this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.points')))), h("div", { key: '03dbed2bca1a462f8e4a13bbbb373d236f2da8ad', class: "s-loyalty-program-reward-title" }, h("span", { key: 'ca64b8c7378baa7e7c4197580290f71ecead8310' }, this.group)), h("div", { key: '3f8e125da5dc4618f82033c2b9e4b9c97760821f', class: "s-loyalty-program-reward-name" }, h("div", { key: 'a2494d8a25a09dd66871d55c762f90a351a54b52', class: "s-loyalty-program-rewards-name", id: `prize-${this.prize.id}` }, this.prize.name)))), h("div", { key: 'fe4e03bdab2d95b5adee8b6ae4c51f96186d6016', class: "p-4" }, h("button", { key: '1d33bd0616d4c8e51f2b01cad7bff02c2842d935', onClick: this.handleAction, disabled: !this.isActionClickable(this.prize), class: {
+            } }, h("div", { key: 'c50cc16ceff89288dc0bd4199123e0cfb7816732', onClick: this.handleActionArea, role: "button" }, h("div", { key: '7a68197172329f91e7df1e13ca667062131e14b8', class: "s-loyalty-program-reward-img" }, h("img", { key: 'f1d9dc5fc674095bfdfcb5d167f46d896f9a9b0c', src: this.prize.image, class: "s-loyalty-program-rewards-img", alt: "" })), h("div", { key: 'b443d55df65a1f34fdff14a3beda5b159fe687f8', class: "s-loyalty-program-reward-content" }, h("div", { key: '292dcd5f9997f82fd0695fdd80380180e781b77f', class: "s-loyalty-program-reward-points" }, h("salla-badge", { key: '083348231855223ff3ffc66b61847af85d274e19', size: "xs" }, h("span", { key: '5939fae8cd6737c98f6cab437cefdb89b0847bbb', innerHTML: SIGift }), h("span", { key: '155ad221e00b1d21db2b16a8c1d394b302897cda', class: "s-loyalty-program-rewards-points" }, this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.points')))), h("div", { key: 'ab9d0e10acfc7e1bd5464a971cd6ff7eedf90d52', class: "s-loyalty-program-reward-title" }, h("span", { key: '3fcc04b5a81dd29b1b40411c95bebe8805ffb2bb' }, this.group)), h("div", { key: '2ffe9cb9c295cf817224b8d8aab7f1b413893f2f', class: "s-loyalty-program-reward-name" }, h("div", { key: 'e384ac797eb91704951e91f6fadf4863a9e9971c', class: "s-loyalty-program-rewards-name", id: `prize-${this.prize.id}` }, this.prize.name)))), h("div", { key: '887bb1eb44d945a66af21a88de60d09275fd5042', class: "p-4" }, h("button", { key: '704b697973f51cdcc67ba62a8b4d806d4abb5461', onClick: this.handleAction, disabled: !this.isActionClickable(this.prize), class: {
                 's-loyalty-program-rewards-action-base': true,
                 's-loyalty-program-rewards-action-on': this.isActionClickable(this.prize),
                 's-loyalty-program-rewards-action-off': !this.isActionClickable(this.prize),

package/dist/collection/components/salla-loyalty-program/salla-reward-action.js

@@ -20,7 +20,10 @@ export class SallaRewardAction {
         };
     }
     render() {
-        return (h("div", { key: '95d6e753d49c7cb69e6f5e25ef6ccf3f916f4022', class: "s-loyalty-program-rewards-modal-action" }, this.isShopNow(this.prize) ? (h("a", { href: this.prize.prize_url || salla.url.get(''), class: {
+        if (!this.isClickable(this.prize)) {
+            return null;
+        }
+        return (h("div", { class: "s-loyalty-program-rewards-modal-action" }, this.isShopNow(this.prize) ? (h("a", { href: this.prize.prize_url || salla.url.get(''), class: {
                 's-loyalty-program-rewards-action-base': true,
                 's-loyalty-program-rewards-action-on': true,
             } }, salla.lang.get('pages.loyalty_program.shop_now'))) : (h("button", { onClick: this.handleClick, class: {

package/dist/collection/components/salla-loyalty-program/salla-reward-card.js

@@ -5,7 +5,7 @@ import { h, Host } from "@stencil/core";
 import SIGift from "../../assets/svg/gift.svg";
 export class SallaRewardCard {
     render() {
-        return (h(Host, { key: '900a20618e1b3ce82778aa99715baf61689f3eee', class: "s-loyalty-program-reward-host" }, h("div", { key: '95b326008c2799ee7d38b48bc57e0860a9386184', class: "s-loyalty-program-reward-container" }, h("div", { key: 'd846dc36fa4494ed9ac6152a982f18598936969f', onClick: (e) => this.areaClick.emit(e), role: "button" }, h("div", { key: 'b8d23796827e4b07f6c271c50fa0e4aeb59f82fc', class: "s-loyalty-program-reward-img" }, h("img", { key: '04a52401941d8a731e8d310397b1ad735bfe44db', alt: "", src: this.prize.image || salla.url.cdn('images/s-empty.png'), class: "s-loyalty-program-rewards-img" })), h("div", { key: '64fa967c98d615d7b16859c9d14b60e0c53fc5aa', class: "s-loyalty-program-reward-content" }, h("div", { key: 'bb8c34ce8f3bcec9599c87b56bea6abd793187df', class: "s-loyalty-program-reward-points" }, h("salla-badge", { key: 'f7d0a396cf754d1e8f9e8fddee53a7d545311148', size: "xs" }, h("span", { key: '36f4e1ed873f1a231e2d5e51a2a8cc36bdcedfee', innerHTML: SIGift }), h("span", { key: '638b3ecefbfcb424869987ab33478e67d9b5d9b8', class: "s-loyalty-program-rewards-points" }, this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.points')))), h("div", { key: '6f8386fccf201836d76a86e7fe5e6d3461bb5540', class: "s-loyalty-program-reward-title" }, h("span", { key: '6d6692c44d6bac35da40108514471a3c56884d81' }, this.prize.group_title)), h("div", { key: '6ad9ad90728ac7f882ff8db9cfadb5a6e12f3e25', class: "s-loyalty-program-reward-name" }, h("div", { key: 'ef4344c7cb67785a4cd66d36e303e40a610a5375', class: "s-loyalty-program-rewards-name", id: `prize-${this.prize.id}` }, this.prize.name, this.prize.description ? `: ${this.prize.description}` : '')))), h("div", { key: '5eee5a4f8b10cd790ce41e4a99d94f86bd26dd3b', class: "p-4" }, h("slot", { key: '359d50033cdd3cce41901401bf0b75ba9c5aea1f', name: "action" }, h("button", { key: 'ea7aa1c5cd50937a27cef7580e508a1e3f8f852d', onClick: (e) => this.actionClick.emit(e.detail), class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-on" }, salla.lang.get('pages.loyalty_program.show_reward')))))));
+        return (h(Host, { key: '8e688793dec09f19093df23deacfd7ecaac100b7', class: "s-loyalty-program-reward-host" }, h("div", { key: '12663908467c428e861f999fa6449810207b9399', class: "s-loyalty-program-reward-container" }, h("div", { key: '8b01e444f083bafcd1036962113921e876be942a', onClick: (e) => this.areaClick.emit(e), role: "button" }, h("div", { key: 'a90032821b870b9fe915a3bdceb5422bacc66c3c', class: "s-loyalty-program-reward-img" }, h("img", { key: '70f872cb5c17cb8c05df6cdcd767f5b0b018f182', alt: "", src: this.prize.image || salla.url.cdn('images/s-empty.png'), class: "s-loyalty-program-rewards-img" })), h("div", { key: 'af161adc0a211ddb2c3702ee81cc47bf275a8b3d', class: "s-loyalty-program-reward-content" }, h("div", { key: '5f420a70d14120075ac394ced39b7d37477b8042', class: "s-loyalty-program-reward-points" }, h("salla-badge", { key: '58df0147fce4aa22479474ff4e3b327dca4165c0', size: "xs" }, h("span", { key: 'e59fc1b27e38e45560d4469d2e8fad0ef1c80915', innerHTML: SIGift }), h("span", { key: '9272311f41a78628c2ff6b78acb25e0b04cc3a95', class: "s-loyalty-program-rewards-points" }, this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.points')))), h("div", { key: '297b130a68d6b64659a6eb832baccf8a5884db78', class: "s-loyalty-program-reward-title" }, h("span", { key: '7e9d42268e77dffb2dda963cc046fb09015c4ee7' }, this.prize.group_title)), h("div", { key: 'f70b7369222792657b02909aed7bacf2a61f24f6', class: "s-loyalty-program-reward-name" }, h("div", { key: '8f1bd6ffb8190d455006e111a013946b3569c24e', class: "s-loyalty-program-rewards-name", id: `prize-${this.prize.id}` }, this.prize.name, this.prize.description ? `: ${this.prize.description}` : '')))), h("div", { key: 'a5a7d0acba4a00be16db6b277a0a5eb39b88153b', class: "p-4" }, h("slot", { key: 'e2fcb1189b103f419884b05518af74cfd1c5eeb7', name: "action" }, h("button", { key: 'e0522ba4b684bcabae4483dfd36d00cafb86d511', onClick: (e) => this.actionClick.emit(e.detail), class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-on" }, salla.lang.get('pages.loyalty_program.show_reward')))))));
     }
     static get is() { return "salla-reward-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-loyalty-program/salla-reward-details.js

@@ -113,11 +113,11 @@ export class SallaRewardDetails {
     }
     render() {
         const termsAndConditions = this.getTermsAndConditions();
-        return (h("div", { key: '280d646eff094c16596ca31ee57f4bd104958f8c', class: "s-loyalty-program-reward-modal" }, h("div", { key: 'a39d376f170684f754c4357dc64d02b5ffbb1ed2', class: "s-loyalty-program-points-modal-header" }, h("h1", { key: '654e061c8852461a5248248ed2d95ef02a8a4711', class: "s-loyalty-program-points-modal-info" }, !salla.url.is_page('cart') ? ''
+        return (h("div", { key: '2b8f4348fb0e728665b53db47719686629c1836d', class: "s-loyalty-program-reward-modal" }, h("div", { key: '1c838eaa84818ee590a36062b68a505bca8e7c68', class: "s-loyalty-program-points-modal-header" }, h("h1", { key: '2912070e266711897fec27c3a3e663677fd605df', class: "s-loyalty-program-points-modal-info" }, !salla.url.is_page('cart') ? ''
             : h("button", { class: "s-loyalty-program-back-btn", onClick: () => closeModals(() => salla.event.dispatch('modal::open', 'loyalty-rewards-modal')) }, h("span", { class: {
                     'sicon-arrow-right': document.documentElement.getAttribute('dir') === 'rtl',
                     'sicon-arrow-left': document.documentElement.getAttribute('dir') === 'ltr',
-                } })), this.prize.name)), h("div", { key: '8dce07ce81b0d6879efc0cba88523b6d3daf42bb', class: "s-loyalty-program-modal-scrollable-content" }, h("div", { key: 'f288d7483911af0bbc17a824ee4397ad0b3ef367', class: "s-loyalty-program-reward-details-header" }, h("div", { key: '87686174a3a8c17558d0a97180cb4756a1edbefe', class: "s-loyalty-program-aspect-container" }, h("img", { key: '31461e1503c50715f160e75cf7ffad59939fb93c', src: this.prize.image, alt: this.prize.name })), h("salla-badge", { key: 'ed1fc08260885fa865279a9d2fc6af35c01e2bdc', size: "sm", bg: "light" }, h("span", { key: '26eec953f9c5f3fa5aa118828faec50a4477e013', innerHTML: SIGift }), h("span", { key: 'db3bf908be0f28534e121da9e692d801d2ee6cf9', class: "s-loyalty-program-points-badge-points" }, formattedPointsJsx(this.prize.cost_points)))), !termsAndConditions.length ? '' : h("div", { class: "s-loyalty-program-terms-and-conditions" }, h("h1", { class: "s-loyalty-program-terms-and-conditions-heading" }, salla.lang.get('pages.loyalty_program.terms_and_conditions')), h("ul", { class: "s-loyalty-program-terms-and-conditions-list" }, termsAndConditions.map(([title, points]) => (h("li", { class: "s-loyalty-program-terms-and-conditions-item" }, h("span", { class: "s-loyalty-program-terms-and-conditions-content" }, title), h("span", { class: "s-loyalty-program-terms-and-conditions-content" }, points)))))), h("div", { key: 'bfdc4d22117ae86f3bb2140546b4b5a8ecd35f8e', class: "s-loyalty-program-reward-info-message" }, h("h1", { key: 'f03b30c0372fd83e4fa7815bbd76d307c6fbe3c1', class: "s-loyalty-program-reward-info-message-heading" }, salla.lang.get('pages.loyalty_program.how_to_benefit_from_this_reward')), h("p", { key: '245acd0b8438230ff5d503e5819abb581f0ba14a', class: "s-loyalty-program-reward-info-message-content" }, this.getItemsMarkersText())), (this.prize.key === 'FREE_SHIPPING' || this.getItemsMarkers('both') === '000000') ? '' : h("div", { class: "s-loyalty-program-reward-details" }, h("salla-tabs", { key: this.refreshKey }, this.getItemsMarkers('included') === '000' ? '' : [
+                } })), this.prize.name)), h("div", { key: '0d7f102d7031fcae33670435d9fa3a7d40a0fbc4', class: "s-loyalty-program-modal-scrollable-content" }, h("div", { key: '0aa1b6206852391cae2bdd83452b3ed1dca4ef52', class: "s-loyalty-program-reward-details-header" }, h("div", { key: 'b8de08abbd4ed24367312ecd8e36b9b203dc24cb', class: "s-loyalty-program-aspect-container" }, h("img", { key: 'd327bd9cc47042cc694fda8f38a130686caeaeb6', src: this.prize.image, alt: this.prize.name })), h("salla-badge", { key: 'dbb6d24e2f647bd93bc2cb2d174c747e8117b1cb', size: "sm", bg: "light" }, h("span", { key: '8e78d674f565f2274796a57b218a14f683e29149', innerHTML: SIGift }), h("span", { key: '3e959d7d67a899a429c2c2100236527268c98905', class: "s-loyalty-program-points-badge-points" }, formattedPointsJsx(this.prize.cost_points)))), !termsAndConditions.length ? '' : h("div", { class: "s-loyalty-program-terms-and-conditions" }, h("h1", { class: "s-loyalty-program-terms-and-conditions-heading" }, salla.lang.get('pages.loyalty_program.terms_and_conditions')), h("ul", { class: "s-loyalty-program-terms-and-conditions-list" }, termsAndConditions.map(([title, points]) => (h("li", { class: "s-loyalty-program-terms-and-conditions-item" }, h("span", { class: "s-loyalty-program-terms-and-conditions-content" }, title), h("span", { class: "s-loyalty-program-terms-and-conditions-content" }, points)))))), h("div", { key: 'b09d181ad0587d4d6f99020adc2b944778e3d491', class: "s-loyalty-program-reward-info-message" }, h("h1", { key: '7538f340d33fd34fd55728c3df1d43ff676ffa57', class: "s-loyalty-program-reward-info-message-heading" }, salla.lang.get('pages.loyalty_program.how_to_benefit_from_this_reward')), h("p", { key: '927078b3615900c8377c1563f7bfe3b6a4cd28d3', class: "s-loyalty-program-reward-info-message-content" }, this.getItemsMarkersText())), (this.prize.key === 'FREE_SHIPPING' || this.getItemsMarkers('both') === '000000') ? '' : h("div", { class: "s-loyalty-program-reward-details" }, h("salla-tabs", { key: this.refreshKey }, this.getItemsMarkers('included') === '000' ? '' : [
             h("salla-tab-header", { slot: "header", name: "included", style: {
                     display: this.getItemsMarkers('excluded') === '000' ? 'none' : 'block',
                 } }, h("span", { class: "s-loyalty-program-reward-details-tab-icon", innerHTML: SICheck }), h("span", null, salla.lang.get(`pages.loyalty_program.included`))),
@@ -127,7 +127,7 @@ export class SallaRewardDetails {
                     display: this.getItemsMarkers('included') === '000' ? 'none' : 'block',
                 } }, h("span", { class: "s-loyalty-program-reward-details-tab-icon", innerHTML: SICancel }), h("span", null, salla.lang.get(`pages.loyalty_program.excluded`))),
             h("salla-tab-content", { slot: "content", name: "excluded" }, h("div", { class: "s-loyalty-program-reward-details-items-wrapper" }, this.getCategoriesJsx(this.getIncludedItems(this.prize.excludedCategories, this.prize.excluded_category_ids), salla.lang.get('pages.loyalty_program.excluded_categories')), this.getBrandsJsx(this.getIncludedItems(this.prize.excludedBrands, this.prize.excluded_brand_ids), salla.lang.get('pages.loyalty_program.excluded_brands')), this.getProductsJsx(this.getProductIds(this.prize.excluded_product_ids), salla.lang.get('pages.loyalty_program.excluded_products')))),
-        ]))), h("salla-reward-action", { key: 'e129546afde7da7fe66e250ce4de67d4523727be', onActionClick: e => this.actionClick.emit(e.detail), prize: this.prize })));
+        ]))), h("salla-reward-action", { key: '0d03ebd0fcf1f7469b75b04d9ad82b71a284d0d1', onActionClick: e => this.actionClick.emit(e.detail), prize: this.prize })));
     }
     static get is() { return "salla-reward-details"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-loyalty-program/salla-reward-exchange.js

@@ -43,11 +43,11 @@ export class SallaRewardExchange {
         this.reset(0);
     }
     render() {
-        return (h(Host, { key: 'ceecba37884a11443b52b76dad69bd164b52b788' }, h("div", { key: '598f185363b917969b9de0fb6a536884d6578c95', class: "s-loyalty-program-exchange-heading" }, h("div", { key: 'a2aa6b15d97533a973f7f2fb6a2cf517c147367d', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xl s-loyalty-program-circle-variant-fill" }, h("span", { key: '9745001d514643add62fe9a64df7fc2c0a694513', innerHTML: SIGift })), h("h2", { key: '4819327aacc1307c0f75014d9faef50f55115289' }, salla.lang.get('pages.loyalty_program.redeem_reward')), h("p", { key: 'b39c99abcefb0f3baf609cd21049b083a115cdef' }, salla.lang.get('pages.loyalty_program.redeem_confirmation'), " ", h("span", { key: '50852d87c9686f66beddc7b0a0a3062f0ced1a61' }, "(", this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.point'), ")"), " ", salla.lang.get('pages.loyalty_program.for'), " ", h("span", { key: '5a4baa0f02859ced6fdcf7ce77c31bf9b27c45e6' }, "(", this.prize.name, ")"))), h("div", { key: 'b1f1067bd0f3a84231ac017f4b66a71277a5d209', class: "s-loyalty-program-exchange-btns" }, h("button", { key: '7d4ce6c08fcac58290b364a0df55f8acb715d362', class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-confirm", onClick: () => this.handleConfirm() }, h("span", { key: 'ef1deb96c4bbb2843ae088b539848c15aacdb244', style: {
+        return (h(Host, { key: '44934c0c0574ea61c4ef293a9deb796a2d42c02b' }, h("div", { key: 'eca62e786a5d13d4578cc5badcd464ee1570541b', class: "s-loyalty-program-exchange-heading" }, h("div", { key: '14b346e172b9859449b780ec7c22e81ec2e97a8c', class: "s-loyalty-program-circle-base s-loyalty-program-circle-size-xl s-loyalty-program-circle-variant-fill" }, h("span", { key: '472753cc4742c2b010729ed98cdbf58192b548fa', innerHTML: SIGift })), h("h2", { key: 'e77eeb994a91e36a8b04c213484221a6db2f99fd' }, salla.lang.get('pages.loyalty_program.redeem_reward')), h("p", { key: '7c9b9d6400ddeeb7a6ad8bdc1a2f364e9d67187b' }, salla.lang.get('pages.loyalty_program.redeem_confirmation'), " ", h("span", { key: '07eea7e08a596dd284ceb2d60d2489012457585e' }, "(", this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.point'), ")"), " ", salla.lang.get('pages.loyalty_program.for'), " ", h("span", { key: '70d6c67bd78400626c1e2d91753a494df5e6d94d' }, "(", this.prize.name, ")"))), h("div", { key: '49d98bbcbb017bf3f9195734fbb80f1da8559746', class: "s-loyalty-program-exchange-btns" }, h("button", { key: 'a1775e84ef7c17effb54b6fdff83bad9ac8cf8ec', class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-confirm", onClick: () => this.handleConfirm() }, h("span", { key: '28977f2f6990322cb194c19b01feeffd8117d1b8', style: {
                 opacity: this.exchange.status !== 'pending' ? '1' : '0',
-            } }, salla.lang.get('common.elements.confirm')), h("span", { key: '0f949386c85d7544f7098e2bdc8c7ce4390c4383', class: "s-loyalty-program-exchange-loading", style: {
+            } }, salla.lang.get('common.elements.confirm')), h("span", { key: '2ff77b13d468e5096d777e0179db9e257468ca53', class: "s-loyalty-program-exchange-loading", style: {
                 opacity: this.exchange.status === 'pending' ? '1' : '0',
-            } }, h("salla-loading", { key: '9cdfbfdc7ebfb2e1874f1956560dc464e4aa2a9f', color: "primary", size: 24 }))), h("button", { key: '79a2e8b44be5eb4b3ec5f1a285a8f4eba5324814', class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-cancel", onClick: () => this.handleCancel() }, salla.lang.get('common.elements.cancel')))));
+            } }, h("salla-loading", { key: '415c1d497b93718ac0bc67e18442c28246e589e7', color: "primary", size: 24 }))), h("button", { key: '32d1a3f2e221261bd4ff459cc85dec5c780dd5e8', class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-cancel", onClick: () => this.handleCancel() }, salla.lang.get('common.elements.cancel')))));
     }
     static get is() { return "salla-reward-exchange"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-loyalty-program/translations.js

@@ -22,6 +22,14 @@ const translations = {
         ar: 'خطوات بسيطة تفصلك عن المزيد من نقاط الولاء!',
         en: 'Two simple steps separate you from great rewards!',
     },
+    'pages.loyalty_program.how_to_use': {
+        ar: 'آلية الإستخدام',
+        en: 'How to use?',
+    },
+    'pages.loyalty_program.how_to_use_steps': {
+        ar: 'يمكنك اكتساب النقاط عند الشراء من التصنيفات المحددة',
+        en: 'You can earn points when you purchase from the selected categories.',
+    },
     'pages.loyalty_program.register': {
         ar: 'سجِّل',
         en: 'Register',
@@ -58,6 +66,10 @@ const translations = {
         ar: 'نقطة',
         en: 'points',
     },
+    'pages.loyalty_program.start_from': {
+        ar: 'يبدأ من',
+        en: 'Start from',
+    },
     'pages.loyalty_program.redeem_reward': {
         ar: 'استبدل النقاط',
         en: 'Redeem Reward',

package/dist/components/functions.js

@@ -36,33 +36,60 @@ function brand_path(brand) {
     return [brand.name.replace(/\s/g, '-'), `brand-${brand.id}`].join('/');
 }
 function isUnitOrder(point) {
-    for (const condition of (point.conditions ?? [])) {
-        if (condition.key?.endsWith('_FOR_UNIT')) {
+    for (const condition of point.conditions) {
+        if (condition.key.endsWith('_FOR_UNIT') || condition.key.endsWith('_FOR_UNIT_BY_CATEGORIES')) {
             return true;
         }
     }
-    return false;
 }
-function formattedPointsJsx(value) {
+function isRangePoints(point) {
+    for (const condition of point.conditions) {
+        if (condition.key.endsWith('_BY_CATEGORIES') && point.conditions.length > 1) {
+            return true;
+        }
+    }
+}
+function getPoints(point) {
+    if (isRangePoints(point)) {
+        return point.conditions.sort((a, b) => a.points - b.points)[0].points;
+    }
+    return point.points;
+}
+function formattedPointsJsx(value, isUnit = false, isRange = false) {
     if (typeof value === 'number') {
+        if (isUnit) {
+            return h("span", null,
+                isRange ? salla.lang.get('pages.loyalty_program.start_from') : '',
+                " 1 ",
+                salla.config.currency().symbol,
+                " = ",
+                value,
+                " ",
+                salla.lang.get('pages.loyalty_program.point'));
+        }
         return h("span", null,
+            isRange ? salla.lang.get('pages.loyalty_program.start_from') : '',
+            " ",
             value,
             " ",
             salla.lang.get('pages.loyalty_program.point'));
     }
     if (isUnitOrder(value)) {
         return h("span", null,
-            "1 ",
+            isRangePoints(value) ? salla.lang.get('pages.loyalty_program.start_from') : '',
+            " 1 ",
             salla.config.currency().symbol,
             " = ",
-            value.points,
+            getPoints(value),
             " ",
             salla.lang.get('pages.loyalty_program.point'));
     }
     return h("span", null,
-        value.points,
+        isRangePoints(value) ? salla.lang.get('pages.loyalty_program.start_from') : '',
+        " ",
+        getPoints(value),
         " ",
         salla.lang.get('pages.loyalty_program.point'));
 }
 
-export { nearestLowerMultiple as a, brand_path as b, closeModals as c, formattedPointsJsx as f, normalizeLoyaltyData as n };
+export { nearestLowerMultiple as a, brand_path as b, closeModals as c, formattedPointsJsx as f, isUnitOrder as i, normalizeLoyaltyData as n };