@salla.sa/twilight-components 2.14.597 → 2.14.599

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DIEWuq3M.js');
+var index = require('./index-Bm1Ew-5K.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-DIEWuq3M.js');
+var index = require('./index-Bm1Ew-5K.js');
 var mail = require('./mail-CO8cFZH7.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-DIEWuq3M.js');
+var index = require('./index-Bm1Ew-5K.js');
 
 const sallaWalletCss = "/*!twlt*/@charset \"UTF-8\";.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}.s-wallet-summary{display:flex;align-items:stretch;gap:16px;margin-bottom:28px}.s-wallet-balance-card{flex:0 0 34%;max-width:240px;background:#fff;border-radius:12px;padding:20px;box-sizing:border-box}.s-wallet-balance-mark{width:48px;height:48px;border-radius:9999px;background:var(--color-primary-reverse, #eaf7f0);color:var(--color-primary, #2e8b57);display:inline-flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:12px}.s-wallet-balance-figure{font-size:18px;font-weight:700;color:#1c1c1c}.s-wallet-balance-label{margin-top:2px;font-size:12px;color:#9aa0a6}.s-wallet-amount{display:inline-flex;align-items:center;gap:4px;font-weight:700;white-space:nowrap}.s-wallet-amount-credit{color:#00af6c}.s-wallet-amount-debit{color:#f55157}.s-wallet-transaction-type{display:flex;align-items:center;color:#4b5563}@media screen and (min-width: 768px){.s-wallet-balance-card{display:flex;flex-direction:column;justify-content:center}}@media screen and (max-width: 767px){.s-wallet-summary{gap:12px;margin-bottom:20px}.s-wallet-balance-card{flex:0 0 38%;padding:16px;text-align:center}.s-wallet-balance-mark{margin-bottom:8px}}.absolute{position:absolute}.relative{position:relative}.flex{display:flex}.table{display:table}.hidden{display:none}.items-center{align-items:center}.p-3{padding:0.75rem}.text-center{text-align:center}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-normal{font-weight:400}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.s-wallet-container>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.625rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.625rem * var(--tw-space-y-reverse))}@media (min-width: 768px){.s-wallet-container>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}}.s-wallet-mobile-title{display:inline-block;width:8rem;font-weight:400;--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}@media (min-width: 768px){.s-wallet-mobile-title{display:none}}.s-wallet-reference-id{display:none}@media (min-width: 768px){.s-wallet-reference-id{display:inline-block}}.s-wallet-buy-as-gift-icon{margin-left:0.25rem;margin-right:0.25rem;display:inline-block;color:var(--color-primary)}.s-wallet-copy-to-clipboard-button{display:flex;align-items:center}@media (min-width: 768px){.s-wallet-copy-to-clipboard-button{display:none}}.s-wallet-copy-to-clipboard-button salla-button{position:relative}.s-wallet-copy-to-clipboard-button-icon{pointer-events:none;font-size:0.75rem;line-height:1rem}.s-wallet-copy-to-clipboard-button-icon:where([dir=\"ltr\"],[dir=\"ltr\"] *){margin-left:0.25rem}.s-wallet-copy-to-clipboard-button-icon:where([dir=\"rtl\"],[dir=\"rtl\"] *){margin-right:0.25rem}@media (min-width: 768px){.s-wallet-status-container{margin-left:0px;margin-right:0px}}.s-wallet-status-container:where([dir=\"ltr\"],[dir=\"ltr\"] *){margin-left:auto}.s-wallet-status-container:where([dir=\"rtl\"],[dir=\"rtl\"] *){margin-right:auto}.s-wallet-status-container i{margin-top:0.25rem}.s-wallet-status-container i:where([dir=\"ltr\"],[dir=\"ltr\"] *){margin-right:0.25rem}.s-wallet-status-container i:where([dir=\"rtl\"],[dir=\"rtl\"] *){margin-left:0.25rem}.s-wallet-rated-text{--tw-text-opacity:1;color:rgb(251 191 36 / var(--tw-text-opacity, 1))}.s-wallet-unrated-text{--tw-text-opacity:1;color:rgb(229 231 235 / var(--tw-text-opacity, 1))}.s-wallet-no-content{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding-top:2.5rem;padding-bottom:5rem;--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.s-wallet-no-content .icon{margin-bottom:1rem;display:flex;height:8rem;width:8rem;align-items:center;justify-content:center;border-radius:9999px;--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1));font-size:3rem;line-height:1;--tw-text-opacity:1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}.s-wallet-no-content p{margin-bottom:1rem;font-size:1rem;line-height:1.5rem;--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.s-wallet-table{min-width:100%;border-collapse:separate}@media (min-width: 768px){.s-wallet-table{margin-bottom:-0.75rem;--tw-border-spacing-y:1.25rem;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}}.s-wallet-table-head{margin-bottom:1.25rem;display:none;--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}@media (min-width: 768px){.s-wallet-table-head{display:table-header-group}}.s-wallet-table-head-tr-th{padding-left:1.5rem;padding-right:1.5rem;text-align:start;font-size:0.875rem;line-height:1.25rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em}.s-wallet-table-head-tr-th:where([dir=\"ltr\"],[dir=\"ltr\"] *){text-align:left}.s-wallet-table-head-tr-th:last-child:where([dir=\"ltr\"],[dir=\"ltr\"] *){text-align:right}.s-wallet-table-head-tr-th:where([dir=\"rtl\"],[dir=\"rtl\"] *){text-align:right}.s-wallet-table-head-tr-th:last-child:where([dir=\"rtl\"],[dir=\"rtl\"] *){text-align:left}.s-wallet-table-tbody-tr{position:relative;display:flex;flex-direction:row;flex-wrap:wrap;overflow:hidden;border-radius:var(--s-radius, 0.25rem);border-bottom-width:8px;border-top-width:8px;--tw-border-opacity:1;border-color:rgb(249 250 251 / var(--tw-border-opacity, 1));--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));padding:0.5rem;transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:500ms}@media (min-width: 768px){.s-wallet-table-tbody-tr{display:table-row;flex-direction:row;flex-wrap:nowrap;padding:0px}}.s-wallet-table-tbody-tr-td{width:100%;white-space:nowrap;font-size:0.875rem;line-height:1.25rem}.s-wallet-table-tbody-tr-td:first-child{font-weight:700}@media (min-width: 768px){.s-wallet-table-tbody-tr-td{height:5rem;width:auto}.s-wallet-table-tbody-tr-td:last-child{text-align:end}.s-wallet-table-tbody-tr-td:first-child:where([dir=\"ltr\"],[dir=\"ltr\"] *){border-top-left-radius:0.375rem;border-bottom-left-radius:0.375rem}.s-wallet-table-tbody-tr-td:first-child:where([dir=\"rtl\"],[dir=\"rtl\"] *){border-top-right-radius:0.375rem;border-bottom-right-radius:0.375rem}}.s-wallet-table-tbody-tr-td:first-child{font-weight:700}.s-wallet-table-tbody-tr-td-content{position:relative;display:flex;align-items:center;justify-content:space-between;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.25rem;padding-bottom:0.25rem;font-size:0.75rem;line-height:1rem}@media (min-width: 768px){.s-wallet-table-tbody-tr-td-content{padding-left:1.5rem;padding-right:1.5rem;padding-top:1.5rem;padding-bottom:1.5rem}}.s-wallet-table-tbody-tr-td-content:where([dir=\"ltr\"],[dir=\"ltr\"] *){padding-right:0.5rem}.s-wallet-table-tbody-tr-td-content:where([dir=\"rtl\"],[dir=\"rtl\"] *){padding-left:0.5rem}.s-wallet-table-tbody-tr a{position:absolute;top:0px;bottom:0px;display:block;width:100%}.s-wallet-table-tbody-tr a:where([dir=\"ltr\"],[dir=\"ltr\"] *){left:0px}.s-wallet-table-tbody-tr a:where([dir=\"rtl\"],[dir=\"rtl\"] *){right:0px}@media (min-width: 768px){.md\\:mx-0{margin-left:0px;margin-right:0px}.md\\:inline-block{display:inline-block}.md\\:hidden{display:none}}.ltr\\:ml-auto:where([dir=\"ltr\"],[dir=\"ltr\"] *){margin-left:auto}.ltr\\:mr-4:where([dir=\"ltr\"],[dir=\"ltr\"] *){margin-right:1rem}.rtl\\:ml-4:where([dir=\"rtl\"],[dir=\"rtl\"] *){margin-left:1rem}.rtl\\:mr-auto:where([dir=\"rtl\"],[dir=\"rtl\"] *){margin-right:auto}";
 

package/dist/cjs/salla-wishlist-actions.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DIEWuq3M.js');
+var index = require('./index-Bm1Ew-5K.js');
 
 const sallaWishlistActionsCss = "/*!twlt*/:host{display:block}.s-wishlist-actions-menu{min-width:200px;inset-inline-end:0;inset-inline-start:auto;list-style:none;margin:0;padding:4px 0;box-shadow:0 4px 16px rgba(0, 0, 0, 0.12)}.s-wishlist-actions-menu-item{display:block;width:100%;padding:10px 16px;text-align:start;font-size:0.875rem;color:#374151;background:transparent;cursor:pointer;white-space:nowrap}.s-wishlist-actions-menu-item:hover{background-color:#f3f4f6;color:var(--color-primary)}.s-wishlist-actions-panel{box-shadow:0 1px 3px rgba(0, 0, 0, 0.08)}.s-wishlist-actions-panel-select-all{user-select:none}.s-wishlist-actions-select-all:indeterminate,.s-wishlist-actions-select-all:indeterminate:hover,.s-wishlist-actions-select-all:indeterminate:focus{background-color:var(--color-primary);border-color:var(--color-primary)}.s-wishlist-actions-select-all:indeterminate::after{content:\"\";position:absolute;top:50%;left:50%;width:10px;height:2px;background:#fff;border:none;transform:translate(-50%, -50%)}.s-wishlist-actions-social-anchor{display:none}h1.s-wishlist-actions-page-title{text-align:start !important}.static{position:static}.absolute{position:absolute}.relative{position:relative}.z-20{z-index:20}.mb-3{margin-bottom:0.75rem}.mt-1{margin-top:0.25rem}.mt-3{margin-top:0.75rem}.flex{display:flex}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:0.5rem}.gap-3{gap:0.75rem}.gap-4{gap:1rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-4{padding:1rem}.text-sm{font-size:0.875rem;line-height:1.25rem}.font-bold{font-weight:700}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.outline{outline-style:solid}";
 

package/dist/cjs/salla-wishlist-summary.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-DIEWuq3M.js');
+var index = require('./index-Bm1Ew-5K.js');
 var heart = require('./heart-ClVn_Co8.js');
 var Helper = require('./Helper-DgRzYZwR.js');
 require('./anime.es-BqW8JHZi.js');

package/dist/cjs/twilight.cjs.js

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

package/dist/cjs/{vanilla-picker-BaSDLxjI.js → vanilla-picker-BpuzEJnJ.js}

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

package/dist/collection/Helpers/money-text.js

@@ -0,0 +1,37 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+const escapeHtml = (value) => String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+/** Riyal icon swap, the same rule `salla.money()` applies when the store enables `use_sar_symbol`. */
+const withSarIcon = (html) => salla?.config?.get?.('store.settings.use_sar_symbol') ? html.replace(/SAR|ر\.س\.?/g, '<i class=sicon-sar></i>') : html;
+/**
+ * Money in a given currency as HTML, without ever borrowing another currency's symbol.
+ * `salla.money()` resolves currencies from the page config, which under Multimarket only holds the
+ * selected market's currencies, and silently falls back to them — so an order placed in SAR (or KWD)
+ * would show the current market's symbol. Known currencies keep `salla.money()`'s store formatting;
+ * unknown ones use the ISO symbol from `Intl`, separated by a non-breaking space.
+ */
+export function moneyHtml(amount, currency) {
+    // Only bypass salla.money when the page's currency list is known and lacks this code.
+    const currencies = salla?.config?.get?.('currencies');
+    if (!currency || !currencies || typeof currencies !== 'object' || currencies[currency]) {
+        return salla.money({ amount, currency });
+    }
+    let symbol = currency;
+    try {
+        symbol = new Intl.NumberFormat(salla?.lang?.locale || 'ar', { style: 'currency', currency, currencyDisplay: 'narrowSymbol' })
+            .formatToParts(0)
+            .find(part => part.type === 'currency')?.value || currency;
+    }
+    catch {
+        // unknown ISO code: show the code itself
+    }
+    return withSarIcon(`${escapeHtml(salla.helpers.number(amount))} ${escapeHtml(symbol)}`);
+}
+/**
+ * Server-formatted money text (twig `|money`) as safe HTML: escaped, then the riyal icon swap.
+ * Kept for payloads that still send formatted strings.
+ */
+export function moneyTextHtml(text) {
+    return withSarIcon(escapeHtml(text));
+}

package/dist/collection/components/salla-comments/salla-comment-item.js

@@ -67,6 +67,8 @@ export class SallaCommentItem {
         catch {
             salla.log('Bad json for liked_comments');
         }
+        // back from an SSO login redirect: finish the like the guest asked for
+        salla.auth?.api?.takeResume?.('comment.like', this.comment.id) && this.toggleLike();
     }
     getReplies() {
         return Array.isArray(this.comment.replies) ? this.comment.replies : [this.comment.replies];
@@ -91,7 +93,7 @@ export class SallaCommentItem {
     }
     async toggleLike() {
         if (salla.config.isGuest()) {
-            return salla.notify.error(salla.lang.get('common.messages.must_login'));
+            return salla.api.auth.requireLoginThen(`comment::like.after-login.${this.comment.id}`, () => this.toggleLike(), { action: 'comment.like', payload: this.comment.id });
         }
         this.likedComments = JSON.parse(localStorage.getItem('liked_comments') || '[]');
         const isLiked = this.likedComments.includes(this.comment.id);

package/dist/collection/components/salla-file-upload/salla-file-upload.js

@@ -7,6 +7,8 @@ import CancelIcon from "../../assets/svg/cancel.svg";
 import PlayIcon from "../../assets/svg/play-circle.svg";
 import { setTranslationDefault } from "../../Helpers/translate";
 const VIDEO_METADATA_TIMEOUT_MS = 10000;
+// store feature (`store.features`) that switches profile avatars to the `upload` endpoint + url-only `profile/update`
+const AVATAR_UPLOAD_FEATURE = 'avatar-upload-endpoint';
 export class SallaFileUpload {
     /**
      * Lazy load FilePond and all plugins
@@ -38,6 +40,12 @@ export class SallaFileUpload {
     }
     constructor() {
         this.filePondLoaded = false;
+        /** true when the uploaded url must be saved on the profile as the avatar (avatar upload endpoint flag is on) */
+        this.savesAvatarOnUpload = false;
+        /** the profile image uses the default `profile/update` url (no custom `url` given) */
+        this.usesDefaultProfileUrl = false;
+        this.avatarSaveGeneration = 0; // bumped when the avatar is removed, so pending saves are dropped
+        this.avatarSaveQueue = Promise.resolve();
         this.max_images_count = (count) => salla.lang.get('common.uploader.max_images_count', { count });
         this.max_videos_count = (count) => salla.lang.get('common.uploader.max_videos_count', { count });
         this.max_count_hint = (count) => salla.lang.get('common.uploader.max_count_hint', { count });
@@ -189,9 +197,12 @@ export class SallaFileUpload {
             this.instantUpload = true;
         }
         if (!this.url && this.profileImage) {
+            // default: the file goes straight to `profile/update`. With the `avatar-upload-endpoint` store feature
+            // the url is switched to the `upload` endpoint once the store features are known (see componentDidLoad).
             this.url = salla.url.api('profile/update');
             this.instantUpload = true;
             this.host.hasAttribute('name') || (this.name = 'avatar');
+            this.usesDefaultProfileUrl = true;
         }
         if (!this.name) {
             this.name = 'file';
@@ -551,6 +562,19 @@ export class SallaFileUpload {
     notifyUploadError(error, file) {
         salla.notify?.error?.(this.getUploadErrorMessageForFile(error, file));
     }
+    /**
+     * Save an already uploaded avatar url on the customer profile (text-only request).
+     */
+    async saveProfileAvatar(url) {
+        try {
+            await salla.profile.update({ avatar: url });
+            return true;
+        }
+        catch (error) {
+            salla.notify?.error?.(error?.response?.data?.error?.message || salla.lang.get('common.errors.error_occurred'));
+            return false;
+        }
+    }
     removeFailedFile(file) {
         if (!this.filepond?.getFiles().some(pondFile => pondFile.id === file.id)) {
             return;
@@ -891,16 +915,23 @@ export class SallaFileUpload {
         this.revokeAllPreviewObjectUrls();
     }
     render() {
-        return (h(Host, { key: '68b9fdc913b0e64080e71fe0e79d8bfb2e614ccb', class: {
+        return (h(Host, { key: 'af7edd83879313df0a142890044c2bb02d5de73b', class: {
                 "s-file-upload": true,
                 "s-file-upload-profile-image": this.profileImage,
                 "s-file-upload-multiple": this.allowMultiple,
                 "s-file-upload-has-gallery": this.usesGalleryPreview(),
-            } }, h("input", { key: '6594ba9b70d8b0be560ea461d32cf2d0139e75d3', type: "file", name: this.name, ref: ele => this.fileUploader = ele, required: this.required, class: "s-file-upload-wrapper s-file-upload-input", accept: this.accept }), this.allowMultiple && this.showMaxCountHint ? h("div", { class: "s-file-upload-hint s-hidden" }, this.max_count_hint(this.getTotalMaxFiles())) : '', h("input", { key: 'f462d17fa2ed78a95b486e1880f4d84a6cc937b3', class: "s-hidden", name: 'hidden-' + this.name, required: this.required, value: this.getHiddenInputValue(), ref: input => this.hiddenInput = input }), this.renderPreviewGallery()));
+            } }, h("input", { key: 'ea630bd56caac801e7f69f602d3553321cd81b17', type: "file", name: this.name, ref: ele => this.fileUploader = ele, required: this.required, class: "s-file-upload-wrapper s-file-upload-input", accept: this.accept }), this.allowMultiple && this.showMaxCountHint ? h("div", { class: "s-file-upload-hint s-hidden" }, this.max_count_hint(this.getTotalMaxFiles())) : '', h("input", { key: '884b42abe4b9cd832ab1d078af93c9cbe4164112', class: "s-hidden", name: 'hidden-' + this.name, required: this.required, value: this.getHiddenInputValue(), ref: input => this.hiddenInput = input }), this.renderPreviewGallery()));
     }
     async componentDidLoad() {
         await Salla.onReady();
         await Salla.lang.onLoaded();
+        if (this.usesDefaultProfileUrl && Salla.config.get('store.features', []).includes(AVATAR_UPLOAD_FEATURE)) {
+            // Avatars are uploaded to the store `upload` endpoint first (`files[]` + `type`, images only),
+            // then saved on the profile as a plain URL, so `profile/update` never receives a file part.
+            this.url = salla.url.api('upload');
+            this.host.hasAttribute('accept') || (this.accept = 'image/png, image/jpeg, image/jpg'); // upload only allows jpg/png
+            this.savesAvatarOnUpload = true;
+        }
         if (this.profileImage && !this.value) {
             this.value = Salla.config.get('user.avatar');
         }
@@ -996,6 +1027,9 @@ export class SallaFileUpload {
                 }
             },
             onremovefile: (_error, file) => {
+                if (this.savesAvatarOnUpload) {
+                    this.avatarSaveGeneration++;
+                }
                 if (this.usesGalleryPreview()) {
                     if (file) {
                         this.emitRemovedFile(file);
@@ -1052,6 +1086,26 @@ export class SallaFileUpload {
                         catch {
                             return null;
                         }
+                        if (this.savesAvatarOnUpload) {
+                            // `upload` answers with a list of urls
+                            const item = Array.isArray(responseData) ? responseData[0] : responseData;
+                            const avatarUrl = typeof item === 'object' && item !== null ? item.filePath || item.url : item;
+                            if (!this.isValidUploadResult(avatarUrl))
+                                return null;
+                            const generation = this.avatarSaveGeneration;
+                            // saves run one after the other so an older upload can never overwrite a newer one
+                            this.avatarSaveQueue = this.avatarSaveQueue.then(async () => {
+                                if (generation !== this.avatarSaveGeneration)
+                                    return; // removed while waiting in the queue
+                                const saved = await this.saveProfileAvatar(avatarUrl);
+                                // expose the value and emit `uploaded` only once the profile holds this avatar (unless it was removed meanwhile)
+                                if (saved && generation === this.avatarSaveGeneration) {
+                                    this.value = { id: this.generateUploadFileId(), url: avatarUrl };
+                                    this.uploadedHandler();
+                                }
+                            });
+                            return avatarUrl;
+                        }
                         if ((this.instantUpload || this.allowMultiple) && Array.isArray(responseData) && responseData.length > 0) {
                             const item = responseData[0];
                             const fileUrl = typeof item === 'object' && item !== null ? item.filePath || item.url : item;
@@ -1094,7 +1148,13 @@ export class SallaFileUpload {
                         }
                     },
                     ondata: formData => {
-                        if (this.allowMultiple) {
+                        if (this.savesAvatarOnUpload) {
+                            const avatarFormData = new FormData();
+                            formData.forEach((value) => avatarFormData.append('files[]', value));
+                            avatarFormData.append('type', 'avatar');
+                            formData = avatarFormData; // continue below so `payloadParams` / `formData` are still applied
+                        }
+                        else if (this.allowMultiple) {
                             const newFormData = new FormData();
                             // ? This line suppose to send all files in one request but its not working properly
                             // const filesArray = this.filepond.getFiles().map(file => file.file);

package/dist/collection/components/salla-login-modal/salla-login-modal.css

@@ -10,6 +10,9 @@ iframe {
   transition: height 0.3s;
   width: 100%;
 }
+.visible {
+  visibility: visible;
+}
 .inline {
   display: inline;
 }

package/dist/collection/components/salla-login-modal/salla-login-modal.js

@@ -31,6 +31,7 @@ export class SallaLoginModal {
         this.scrolling = 'no';
         this.direction = document.dir;
         this.canRenderIframe = false;
+        this.loginSucceeded = false;
         salla.event.on('login::open', (data) => this.onLoginOpen(data));
         salla.event.on('modal::close', (data) => {
             if (this.iframe)
@@ -125,6 +126,7 @@ export class SallaLoginModal {
             }
             // temporary condition until we handle both cases separately
             if (action == 'authenticated' || action == 'authenticated_web_auth') {
+                this.loginSucceeded = true;
                 !value?.withoutClose && this.close();
                 return salla.auth.api.handlAfterAuthenticatedResponse(value, this.supportWebAuth)
                     .then(() => !(value?.withoutReload || this.withoutReload) && setTimeout(() => window.location.reload(), 1000));
@@ -178,6 +180,14 @@ export class SallaLoginModal {
         // Fire an event if withoutReload is true
         return;
     }
+    /** Tell the listeners waiting for a login (e.g. `requireLoginThen`) that the popup was closed without one. */
+    onVisibilityChanged(visible) {
+        if (visible) {
+            this.loginSucceeded = false;
+            return;
+        }
+        !this.loginSucceeded && Salla.event.emit('salla-login::dismissed');
+    }
     close() {
         Salla.event.emit('salla-login::closing');
         this.modal.close();
@@ -229,6 +239,7 @@ export class SallaLoginModal {
             }
         });
         if (token) {
+            this.loginSucceeded = true;
             this.modal.close();
             Salla.auth.event.tokenFetched(token);
             try {
@@ -343,7 +354,7 @@ export class SallaLoginModal {
         if (this.inline) {
             return this.getLoginDom();
         }
-        return (h("salla-modal", { class: "s-login-modal", ref: modal => this.modal = modal, width: "xs" }, this.getLoginDom()));
+        return (h("salla-modal", { class: "s-login-modal", ref: modal => this.modal = modal, width: "xs", onModalVisibilityChanged: e => this.onVisibilityChanged(e.detail) }, this.getLoginDom()));
     }
     getLoginDom() {
         if (!this.canRenderIframe) {

package/dist/collection/components/salla-order-totals-card/salla-order-totals-card.js

@@ -36,21 +36,28 @@ export class SallaOrderTotalsCard {
     renderRefundRow(amount) {
         return (h("div", { class: "s-order-totals-card-row" }, h("div", { class: "s-order-totals-card-row-inner" }, h("dt", { class: "s-order-totals-card-refund-label" }, h("span", { class: "s-order-totals-card-refund-icon" }, h("i", { class: "sicon-info" })), h("span", null, " ", salla.lang.get('pages.orders.refund_amount'))), h("dd", { class: "s-order-totals-card-refund-value" }, h("b", { innerHTML: salla.money(amount) })))));
     }
+    /** Totals arrive either as a money object or a plain float, depending on the presenter. */
+    toAmount(value) {
+        return (typeof value === 'number' ? value : value?.amount) || 0;
+    }
     render() {
         if (!this.summary) {
             return h(Host, { class: "s-order-totals-card-wrapper" });
         }
         const { summary } = this;
         const hasOptions = Array.isArray(summary.options) ? summary.options.length > 0 : false;
+        const refundAmount = this.toAmount(summary.refund_amount);
+        // Independent of the refund: a partially refunded order can still owe a balance.
+        const isPartiallyPaid = summary.has_remaining_amount ?? this.toAmount(summary.remaining_amount) > 0;
         return (h(Host, { class: "s-order-totals-card-wrapper" }, h("div", { class: "s-order-totals-card-panel" }, h("h2", { id: "summary-heading", class: "s-order-totals-card-heading" }, salla.lang.get('pages.orders.summary')), h("div", { class: "s-order-totals-card-flow" }, h("dl", { class: "s-order-totals-card-list" }, this.renderTotalRow(salla.lang.get('pages.cart.items_total'), summary.sub_total), hasOptions &&
             this.renderTotalRow(salla.lang.get('pages.cart.order_options_total'), summary.options_total), summary.discounts && this.renderDiscountRow(), summary.cod_cost &&
             this.renderTotalRow(salla.lang.get('pages.orders.cod_cost'), summary.cod_cost, ''), summary.shipping_cost &&
             this.renderTotalRow(salla.lang.get('pages.orders.shipping_cost'), summary.shipping_cost, 's-order-totals-card-shipping'), summary.tax &&
-            this.renderTotalRow(`${salla.lang.get('pages.cart.tax')} ${summary.tax.percent}%`, summary.tax.amount, ''), summary.has_remaining_amount && summary.paid_amount
+            this.renderTotalRow(`${salla.lang.get('pages.cart.tax')} ${summary.tax.percent}%`, summary.tax.amount, ''), isPartiallyPaid && summary.paid_amount != null
             ? this.renderTotalRow(salla.lang.get('pages.orders.partially_paid'), summary.paid_amount, '')
-            : null, summary.remaining_amount
+            : null, isPartiallyPaid
             ? this.renderTotalRow(salla.lang.get('pages.orders.remaining_amount'), summary.remaining_amount, '')
-            : null, h("div", { class: "s-order-totals-card-total" }, this.renderTotalRow(salla.lang.get('pages.orders.final_total'), summary.total, 's-order-totals-card-total-label', 's-order-totals-card-total-value', true)), summary.refund_amount ? (h("div", { class: "s-order-totals-card-refund" }, this.renderRefundRow(summary.refund_amount))) : null)))));
+            : null, h("div", { class: "s-order-totals-card-total" }, this.renderTotalRow(salla.lang.get('pages.orders.final_total'), summary.total, 's-order-totals-card-total-label', 's-order-totals-card-total-value', true)), refundAmount > 0 ? (h("div", { class: "s-order-totals-card-refund" }, this.renderRefundRow(summary.refund_amount))) : null)))));
     }
     static get is() { return "salla-order-totals-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-orders/salla-orders.js

@@ -3,6 +3,7 @@
  */
 import { h } from "@stencil/core";
 import Helper from "../../Helpers/Helper";
+import { moneyHtml } from "../../Helpers/money-text";
 import { addMissingTranslations } from "../../Helpers/translate";
 const FEEDBACK_STATUS_WAITING = 'waiting';
 const TAB_QUERY_PARAM = 'tab';
@@ -370,7 +371,9 @@ export class SallaOrder {
         span4.classList.add('s-orders-mobile-title');
         span4.textContent = `${this.totalOrderText}:`;
         const div4 = document.createElement('div');
-        div4.innerHTML = salla.money(order.total);
+        // In the order's own currency: salla.money alone falls back to the selected market's currency
+        // when the page config does not list the order currency (Multimarket).
+        div4.innerHTML = moneyHtml(Number(order.total?.amount), order.total?.currency);
         const anchor2 = document.createElement('a');
         if (order.url)
             anchor2.href = order.url;

package/dist/collection/components/salla-product-card/salla-product-card.js

@@ -33,6 +33,8 @@ export class SallaProductCard {
             this.fitImageHeight = salla.config.get('store.settings.product.fit_type');
             salla.wishlist.event.onAdded((_res, id) => this.toggleFavoriteIcon(true, id));
             salla.wishlist.event.onRemoved((_res, id) => this.toggleFavoriteIcon(false, id));
+            // e.g. a guest signs into an account that already saved this product
+            salla.event.on('wishlist::storage.synced', () => this.productData && this.toggleFavoriteIcon(this.isInWishlist()));
             this.placeholder = salla.url.asset(salla.config.get('theme.settings.placeholder'));
         });
         // Parse product data

package/dist/collection/components/salla-scopes/salla-scopes.css

@@ -173,6 +173,20 @@
 .s-scopes-input:where([dir="rtl"], [dir="rtl"] *) {
   margin-left: 0.75rem;
 }
+.s-scopes-icon {
+  display: inline-block;
+  height: 2rem;
+  width: 2rem;
+  border-radius: var(--s-radius, 0.25rem);
+  object-fit: contain;
+  vertical-align: middle;
+}
+.s-scopes-icon:where([dir="ltr"], [dir="ltr"] *) {
+  margin-right: 0.75rem;
+}
+.s-scopes-icon:where([dir="rtl"], [dir="rtl"] *) {
+  margin-left: 0.75rem;
+}
 .s-scopes-label {
   display: flex;
   flex-grow: 1;

package/dist/collection/components/salla-scopes/salla-scopes.js

@@ -157,7 +157,7 @@ export class SallaScopees {
         return h("salla-placeholder", { alignment: "center", class: "s-scopes-placeholder" }, h("span", { slot: "title" }, salla.lang.get("blocks.scope.branch_looking_for_not_found")), h("span", { slot: "description" }, salla.lang.get("blocks.scope.our_services_not_available_in_this_branch")));
     }
     defaultContent() {
-        return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes?.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.name))))), this.footerContent()];
+        return [h("div", { class: "s-scopes-container s-scrollbar" }, this.scopes?.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("input", { id: `${this.selection} + '_scope_' + ${scope.id}`, name: "lang", type: "radio", value: scope.id, onChange: (event) => this.handleScopeSelection(event), class: "s-scopes-input", checked: !!this.current_scope && this.current_scope.id == scope.id }), h("label", { htmlFor: `${this.selection} + '_scope_' + ${scope.id}`, class: "s-scopes-label s-scopes-clickable" }, h("span", null, scope.icon && h("img", { src: scope.icon, alt: "", loading: "lazy", class: "s-scopes-icon" }), scope.name))))), this.footerContent()];
     }
     availabilityContent() {
         return h("div", { class: "s-scopes-container" }, this.scopes?.map((scope) => h("div", { class: "s-scopes-input-wrap", "data-selection": this.selection }, h("h2", { class: { "s-scopes-label": true, "s-scopes-clickable": this.mode === ModeType.DEFAULT } }, h("span", null, scope.name)), h("h2", { style: { 'color': scope?.availability?.color }, class: `s-scopes-${scope?.availability?.key}` }, scope?.availability?.label))));

package/dist/collection/components/salla-trust-badges/salla-trust-badges.css

@@ -1,21 +1,26 @@
-/*!twlt*/.s-trust-badges-wrapper {
-    display: flex;
-    align-items: center
+/*!twlt*/.s-trust-badges-image {
+  width: 55px;
+  height: 55px;
+  flex-shrink: 0;
+}
+.s-trust-badges-wrapper {
+  display: flex;
+  align-items: center;
 }
 .s-trust-badges-wrapper > :not([hidden]) ~ :not([hidden]) {
-    --tw-space-x-reverse: 0;
-    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
 }
 .s-trust-badges-wrapper:where([dir="rtl"], [dir="rtl"] *) > :not([hidden]) ~ :not([hidden]) {
-    --tw-space-x-reverse: 1
+  --tw-space-x-reverse: 1;
 }
 .s-trust-badges-label {
-    margin-bottom: 0.25rem;
-    font-size: 0.875rem;
-    line-height: 1.25rem
+  margin-bottom: 0.25rem;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
 }
 .s-trust-badges-number {
-    font-size: 0.875rem;
-    line-height: 1.25rem
+  font-size: 0.875rem;
+  line-height: 1.25rem;
 }

package/dist/collection/components/salla-user-menu/salla-user-menu.js

@@ -222,7 +222,17 @@ export class SallaUserMenu {
             window.addEventListener('click', this.onClickOutside);
         }
     }
+    /**
+     * Read consent at the moment of navigation: a link built earlier could be stale (consent accepted,
+     * withdrawn or removed on logout after the menu rendered). Only touches the profile link's href.
+     */
+    prepareProfileLink(event, itemKey) {
+        if (itemKey === 'profile' && this.profileUrl && this.sallaAccountEnabled) {
+            event.currentTarget.href = this.withAnonymousId(this.profileUrl);
+        }
+    }
     menuItemClicked(event, itemKey) {
+        this.prepareProfileLink(event, itemKey);
         if (itemKey !== 'logout') {
             return;
         }
@@ -261,7 +271,7 @@ export class SallaUserMenu {
         return (h("li", { class: {
                 's-user-menu-dropdown-item': true,
                 's-user-menu-dropdown-item-logout': i + 1 === Object.entries(this.items).length,
-            } }, h("a", { ...this.getItemAnchorLinkAttrs(itemKey), class: "s-user-menu-dropdown-item-link", onClick: event => this.menuItemClicked(event, itemKey) }, h("i", { class: "s-user-menu-dropdown-item-prefix", innerHTML: itemValue }), h("span", { class: "s-user-menu-dropdown-item-title" }, this[itemKey]), itemKey === 'wallet' && !this.inline && (this.walletBalance || this.walletBalanceLoading) ? (h("span", { class: "s-user-menu-dropdown-item-balance", style: { display: 'inline-flex', alignItems: 'center', gap: '4px' } }, this.walletBalance ? h("span", { innerHTML: this.walletBalance }) : '', this.walletBalanceLoading ? h("salla-loading", { size: "14" }) : '')) : (''), !['٠', '0', undefined].includes(this.badges[itemKey]) ? (h("span", { class: "s-user-menu-dropdown-item-badge" }, this.badges[itemKey])) : (''))));
+            } }, h("a", { ...this.getItemAnchorLinkAttrs(itemKey), class: "s-user-menu-dropdown-item-link", onClick: event => this.menuItemClicked(event, itemKey), onMouseDown: event => this.prepareProfileLink(event, itemKey), onFocus: event => this.prepareProfileLink(event, itemKey), onContextMenu: event => this.prepareProfileLink(event, itemKey) }, h("i", { class: "s-user-menu-dropdown-item-prefix", innerHTML: itemValue }), h("span", { class: "s-user-menu-dropdown-item-title" }, this[itemKey]), itemKey === 'wallet' && !this.inline && (this.walletBalance || this.walletBalanceLoading) ? (h("span", { class: "s-user-menu-dropdown-item-balance", style: { display: 'inline-flex', alignItems: 'center', gap: '4px' } }, this.walletBalance ? h("span", { innerHTML: this.walletBalance }) : '', this.walletBalanceLoading ? h("salla-loading", { size: "14" }) : '')) : (''), !['٠', '0', undefined].includes(this.badges[itemKey]) ? (h("span", { class: "s-user-menu-dropdown-item-badge" }, this.badges[itemKey])) : (''))));
     }
     componentShouldUpdate() {
         if (!this.opened) {
@@ -287,6 +297,27 @@ export class SallaUserMenu {
     buildProfileUrl(token) {
         return `${Salla.config.get('account.url', 'https://accounts.salla.com')}/${salla.config.get('user.language_code')}/user?store=${Salla.config.get('store.id')}&info=${encodeURIComponent(token)}`;
     }
+    /** Appends the analytics anonymous id (`aid`) when the customer currently consents. */
+    withAnonymousId(url) {
+        const anonymousId = this.getAnalyticsAnonymousId();
+        return anonymousId ? `${url}&aid=${encodeURIComponent(anonymousId)}` : url;
+    }
+    /**
+     * Analytics anonymous id, handed to Salla Account so its events share the
+     * store visitor's identity. Only shared with the customer's consent, the same
+     * rule analytics applies to user ids.
+     */
+    getAnalyticsAnonymousId() {
+        try {
+            if (Salla.storage.get('cookies-consent') !== 'accepted') {
+                return null;
+            }
+            return Salla.analytics?.getAnonymousId?.() || null;
+        }
+        catch (e) {
+            return null;
+        }
+    }
     static get is() { return "salla-user-menu"; }
     static get originalStyleUrls() {
         return {