@salla.sa/twilight-components 2.14.393 → 2.14.394

package/dist/components/salla-login-modal2.js

@@ -1,4 +1,362 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import{transformTag as t,proxyCustomElement as a,HTMLElement as s,h as e,Fragment as i}from"@stencil/core/internal/client";import{d as l}from"./salla-loading2.js";import{d as o}from"./salla-modal2.js";const r=a(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.isMobileAllowed=!0,this.isEmailRequired=!1,this.supportWebAuth=!0,this.withoutReload=!1,this.source="",this.htmlElement=document.documentElement,this.messages=[],this.isClosable=!0,this.iframeLoaded=!1,this.scrolling="no",this.direction=document.dir,this.canRenderIframe=!1,salla.event.on("login::open",(t=>{this.isEmailAllowed||this.isMobileAllowed?(this.source=t?.source??!1,this.withoutReload=t?.withoutReload??this.withoutReload,this.open(t),this.openModal()):salla.logger.warn("Please enable atleast one login type to use this component.")})),salla.event.on("modal::close",(t=>{this.iframe&&this.sendMessageToIframe({source:"login",type:"modal_closed",data:t})})),salla.onReady((()=>{this.api=salla.config.get("store.api"),this.storeId=salla.config.get("store.id")}))}componentDidLoad(){window.addEventListener("message",(t=>{if("login"!=t.data.source)return;if(!this.inline&&!this.canRenderIframe)return;salla.log("salla-account:: recived an event",t.data);let a=t.data?.type?.replace("iframe::",""),s=t.data.message;if("ready"==a)return s.isPasskeyPage?void this.createPassKey.postMessage({source:"login",type:"init_passkey_page",data:{token:salla.storage.get("token"),store_id:salla.config.get("store.id"),locale:salla.config.get("user.language_code"),redirect:salla.config.get("store.url")}},salla.config.get("login.url")):void this.handleIframeReadyAction();if("height"==a)return this.iframe.height=s?.height+"px";if("storage"==a)return this.handleIframeStorageAction(s);if("scrolling"==a)return this.scrolling=s,void(this.isClosable=!1);if("direction"==a)return document.dir=this.direction=s?"rtl":"ltr";if("notify"==a)return salla.notify[s.type](s.message);if("authenticated"==a||"authenticated_web_auth"==a)return!s?.withoutClose&&this.close(),salla.auth.api.handlAfterAuthenticatedResponse(s,this.supportWebAuth).then((()=>!(s?.withoutReload||this.withoutReload)&&setTimeout((()=>window.location.reload()),1e3)));if("dispatchEvent"!=a||"auth::verified"!=s.event){if("dispatchEvent"==a)return salla.event.emit(s.event,...s.payload);if("reload"==a)return s?.withClose&&this.modal.close(),window.location.reload();if("open_page"===a)return window.location.href=s.url;if("open_passkey_page"!==a)return"guest-checkout"===a?this.handleGuestCheckout():void("close"==a&&this.close());this.createPassKey=window.open(`${salla.config.get("login.url")}/create-passkey`)}else salla.log("Ignored dispatchEvent `auth::verified` from iframe")})),this.observeDarkModeChanges(),setTimeout((()=>Salla.event.emit("salla-login::ready")),1)}async open(t=null){return salla.config.isGuest()?this.modal.open():this.withoutReload?void 0:location.reload()}close(){Salla.event.emit("salla-login::closing"),this.modal.close(),this.iframeLoaded=!1,this.canRenderIframe=!1,this.host.dispatchEvent(new CustomEvent("salla-login:closed",{cancelable:!0,bubbles:!0,detail:null})),Salla.event.emit("salla-login::closed")}handleIframeReadyAction(){this.sendInitMessage(),this.sendMessageToIframe({source:"login",type:"width",data:document.body.clientWidth})}observeDarkModeChanges(){new MutationObserver((t=>{t.forEach((t=>{"class"===t.attributeName&&this.sendMessageToIframe({source:"login",type:"darkMode",data:{isDark:!!this.htmlElement.classList.contains("dark")}})}))})).observe(this.htmlElement,{attributes:!0})}async handleIframeStorageAction(t){let a,s=salla.storage.get("cart.user_id"),e=!1;if(Object.entries(t).filter((t=>!Salla.storage.get(t[0]))).forEach((([t,i])=>{salla.log("Shared storage from accounts domain",t,i);let l="string"==typeof i?i?.replace(/^"|"$/g,""):i;salla.storage.set(t,l),"token"===t&&(a=l),"user"===t&&s&&l.id!==s&&(e=!0)})),a){this.modal.close(),Salla.auth.event.tokenFetched(a);try{await Salla.api.cart.assign()}catch(t){Salla.log("Error on assign after handle iframe",t)}e&&Salla.cart.reset();try{!Salla.auth.api.isSessionless()&&await Salla.auth.api.request("auth/jwt"),Salla.auth.api.canRedirect()?setTimeout((()=>window.location.reload()),100):await Salla.auth.event.loggedIn({data:{token:a}}).then((()=>Salla.auth.api.afterUserLogin()))}catch(t){this.modal.open(),Salla.log("Error on request auth/jwt after handle iframe",t)}}else e&&Salla.cart.reset()}sendMessageToIframe(t){if(this.iframe)return this.iframe.contentWindow.postMessage(t,"*")}sendInitMessage(){let t=this.headers;try{t="string"==typeof t?JSON.parse(t):t}catch(a){console.error("Failed to parse headers!",this.headers,a),t=void 0}const a={user:salla.storage.get("user"),s_translations:salla.storage.get("s_translations"),token:salla.storage.get("token")};a.user||delete a.user,a.s_translations||delete a.s_translations,a.token||delete a.token,this.sendMessageToIframe({source:"login",type:"init",data:{id:this.storeId,lang:salla.lang.locale,isDark:!!this.htmlElement.classList.contains("dark"),apiUrl:this.api?.replace(/\/+$/,""),supportWebAuth:this.supportWebAuth,withoutReload:this.withoutReload,inline:this.inline,settings:salla.config.all(),headers:t,storage:a}})}async handleGuestCheckout(){if(this.modal.close(),salla.config.isGuest())return salla.cart.submit(!1,!0)}openModal(){this.canRenderIframe||(this.canRenderIframe=!0),this.modal.open()}render(){return this.inline?this.getLoginDom():e("salla-modal",{class:"s-login-modal",ref:t=>this.modal=t,width:"xs"},this.getLoginDom())}getLoginDom(){if(this.canRenderIframe)return e(i,null,e("iframe",{src:`${salla.config.get("login.url","https://accounts.salla.com")}?src=${this.source}`,title:"Salla Login",class:"hide-scroll",loading:"lazy",ref:t=>{this.iframe=t},allow:"publickey-credentials-get; publickey-credentials-create",scrolling:this.scrolling,frameborder:"0",width:"100%"}))}get host(){return this}static get style(){return"iframe{-moz-transition:height 0.3s;-ms-transition:height 0.3s;-o-transition:height 0.3s;-webkit-transition:height 0.3s;transition:height 0.3s;width:100%}"}},[0,"salla-login-modal",{isEmailAllowed:[1028,"is-email-allowed"],isMobileAllowed:[1028,"is-mobile-allowed"],isEmailRequired:[1028,"is-email-required"],supportWebAuth:[516,"support-web-auth"],inline:[516],storeId:[1032,"store-id"],api:[1],headers:[1025],withoutReload:[1028,"without-reload"],source:[32],messages:[32],isClosable:[32],iframeLoaded:[32],scrolling:[32],direction:[32],canRenderIframe:[32],open:[64]}]);function n(){"undefined"!=typeof customElements&&["salla-login-modal","salla-loading","salla-modal"].forEach((a=>{switch(a){case"salla-login-modal":customElements.get(t(a))||customElements.define(t(a),r);break;case"salla-loading":customElements.get(t(a))||l();break;case"salla-modal":customElements.get(t(a))||o()}}))}n();export{r as S,n as d}
+import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './salla-loading2.js';
+import { d as defineCustomElement$1 } from './salla-modal2.js';
+
+const sallaLoginModalCss = "iframe{-moz-transition:height 0.3s;-ms-transition:height 0.3s;-o-transition:height 0.3s;-webkit-transition:height 0.3s;transition:height 0.3s;width:100%}";
+
+const SallaLoginModal = /*@__PURE__*/ proxyCustomElement(class SallaLoginModal extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        /**
+         * Does the merchant/current location for visitor allow to login using mobile, By default outside KSA is `false`
+         */
+        this.isMobileAllowed = true;
+        /**
+         * Does the merchant require registration with email & mobile
+         */
+        this.isEmailRequired = false;
+        /**
+         * Once the api verify success, it will be login the customer in web pages
+         */
+        this.supportWebAuth = true;
+        /**
+         * Reload after a successful login
+         */
+        this.withoutReload = false;
+        /**
+         * The source of opening login modal
+         */
+        this.source = '';
+        this.htmlElement = document.documentElement;
+        this.messages = [];
+        this.isClosable = true;
+        this.iframeLoaded = false;
+        this.scrolling = 'no';
+        this.direction = document.dir;
+        this.canRenderIframe = false;
+        salla.event.on('login::open', (data) => {
+            if (!this.isEmailAllowed && !this.isMobileAllowed) {
+                salla.logger.warn('Please enable atleast one login type to use this component.');
+                return;
+            }
+            this.source = data?.source ?? false;
+            this.withoutReload = data?.withoutReload ?? this.withoutReload;
+            this.open(data);
+            this.openModal();
+        });
+        salla.event.on('modal::close', (data) => {
+            if (this.iframe)
+                this.sendMessageToIframe({
+                    source: 'login',
+                    type: 'modal_closed',
+                    data,
+                });
+        });
+        salla.onReady(() => {
+            this.api = salla.config.get('store.api');
+            this.storeId = salla.config.get('store.id');
+        });
+    }
+    componentDidLoad() {
+        window.addEventListener('message', (event) => {
+            if (event.data.source != "login") {
+                return;
+            }
+            if (!this.inline && !this.canRenderIframe) {
+                return;
+            }
+            salla.log(`salla-account:: recived an event`, event.data);
+            let action = event.data?.type?.replace('iframe::', '');
+            let value = event.data.message;
+            //if we need skip some events
+            // if (action === 'dispatchEvent' && [].includes(value.event)) {
+            //     return;
+            // }
+            // if (action == "dispatchEvent") {
+            //   return this.host.dispatchEvent(new CustomEvent(value.name, {
+            //     cancelable: true,
+            //     bubbles: true,
+            //     detail: value.payload
+            //   }));
+            // }
+            if (action == 'ready') {
+                if (value.isPasskeyPage) {
+                    this.createPassKey.postMessage({ source: "login", type: "init_passkey_page", data: {
+                            token: salla.storage.get('token'),
+                            store_id: salla.config.get('store.id'),
+                            locale: salla.config.get('user.language_code'),
+                            redirect: salla.config.get('store.url')
+                        } }, salla.config.get('login.url'));
+                    return;
+                }
+                this.handleIframeReadyAction();
+                return;
+            }
+            if (action == 'height') {
+                return (this.iframe.height = value?.height + 'px');
+            }
+            //share the iframe storage, so login too
+            if (action == "storage") {
+                return this.handleIframeStorageAction(value);
+            }
+            // if (action == "success") {
+            //   this.isClosable = true;
+            //   confetti.startConfetti(1200, 50, 150);
+            // }
+            if (action == "scrolling") {
+                this.scrolling = value;
+                this.isClosable = false;
+                return;
+            }
+            if (action == "direction") {
+                return document.dir = this.direction = value ? "rtl" : "ltr";
+            }
+            if (action == 'notify') {
+                return salla.notify[value.type](value.message);
+            }
+            // temporary condition until we handle both cases separately
+            if (action == 'authenticated' || action == 'authenticated_web_auth') {
+                !value?.withoutClose && this.close();
+                return salla.auth.api.handlAfterAuthenticatedResponse(value, this.supportWebAuth)
+                    .then(() => !(value?.withoutReload || this.withoutReload) && setTimeout(() => window.location.reload(), 1000));
+            }
+            if (action == 'dispatchEvent' && value.event == 'auth::verified') {
+                salla.log('Ignored dispatchEvent `auth::verified` from iframe');
+                //we don't need to fire this event because it have listeners for it, and already it's fired/firing from `salla.auth.api.handlAfterAuthenticatedResponse` already we are handling it
+                return;
+            }
+            if (action == 'dispatchEvent') {
+                return salla.event.emit(value.event, ...value.payload);
+            }
+            if (action == 'reload') {
+                if (value?.withClose)
+                    this.modal.close();
+                return window.location.reload();
+            }
+            if (action === 'open_page') {
+                return window.location.href = value.url;
+            }
+            if (action === 'open_passkey_page') {
+                this.createPassKey = window.open(`${salla.config.get('login.url')}/create-passkey`);
+                return;
+            }
+            if (action === 'guest-checkout') {
+                return this.handleGuestCheckout();
+            }
+            if (action == "close") {
+                this.close();
+            }
+        });
+        this.observeDarkModeChanges();
+        setTimeout(() => Salla.event.emit('salla-login::ready'), 1);
+    }
+    /**
+     * Open login component
+     */
+    async open(_event = null) {
+        /**
+         * This is a workaround until we remove all the user objet from twig files
+         * When the user is already login, let's reload the page
+         */
+        if (!salla.config.isGuest()) {
+            if (!this.withoutReload) {
+                return location.reload();
+            }
+            // Fire an event if withoutReload is true
+            return;
+        }
+        return this.modal.open();
+    }
+    close() {
+        Salla.event.emit('salla-login::closing');
+        this.modal.close();
+        this.iframeLoaded = false;
+        this.canRenderIframe = false;
+        this.host.dispatchEvent(new CustomEvent('salla-login:closed', {
+            cancelable: true,
+            bubbles: true,
+            detail: null
+        }));
+        Salla.event.emit('salla-login::closed');
+    }
+    handleIframeReadyAction() {
+        this.sendInitMessage();
+        this.sendMessageToIframe({
+            source: 'login',
+            type: 'width',
+            data: document.body.clientWidth,
+        });
+    }
+    observeDarkModeChanges() {
+        const observer = new MutationObserver((mutations) => {
+            mutations.forEach((mutation) => {
+                if (mutation.attributeName === 'class') {
+                    this.sendMessageToIframe({
+                        source: 'login',
+                        type: 'darkMode',
+                        data: { isDark: this.htmlElement.classList.contains('dark') ? true : false },
+                    });
+                }
+            });
+        });
+        // observing the HTML element for attribute changes
+        observer.observe(this.htmlElement, { attributes: true });
+    }
+    async handleIframeStorageAction(value) {
+        let token, cartUserId = salla.storage.get('cart.user_id');
+        let withCartReset = false;
+        Object.entries(value).filter(item => !Salla.storage.get(item[0]))
+            .forEach(([key, value]) => {
+            salla.log('Shared storage from accounts domain', key, value);
+            let cleanedValue = (typeof value === 'string') ? value?.replace(/^"|"$/g, '') : value;
+            salla.storage.set(key, cleanedValue);
+            if (key === 'token') {
+                token = cleanedValue;
+            }
+            if (key === 'user' && cartUserId && (cleanedValue.id !== cartUserId)) {
+                withCartReset = true;
+            }
+        });
+        if (token) {
+            this.modal.close();
+            Salla.auth.event.tokenFetched(token);
+            try {
+                await Salla.api.cart.assign();
+            }
+            catch (err) {
+                Salla.log('Error on assign after handle iframe', err);
+            }
+            withCartReset && Salla.cart.reset();
+            try {
+                !Salla.auth.api.isSessionless() && await Salla.auth.api.request('auth/jwt');
+                if (Salla.auth.api.canRedirect()) {
+                    setTimeout(() => window.location.reload(), 100);
+                }
+                else {
+                    // Match handlAfterAuthenticatedResponse order: loggedIn (fetches profile + emits) -> afterUserLogin
+                    // Note: auth::verified is omitted here since cart.assign() already handles cart sync above
+                    await Salla.auth.event.loggedIn({ data: { token } }).then(() => Salla.auth.api.afterUserLogin());
+                }
+            }
+            catch (err) {
+                this.modal.open();
+                Salla.log('Error on request auth/jwt after handle iframe', err);
+            }
+            return;
+        }
+        withCartReset && Salla.cart.reset();
+    }
+    sendMessageToIframe(message) {
+        if (!this.iframe)
+            return;
+        return this.iframe.contentWindow.postMessage(message, '*');
+    }
+    sendInitMessage() {
+        let headers = this.headers;
+        try {
+            headers = typeof headers === 'string' ? JSON.parse(headers) : headers;
+        }
+        catch (error) {
+            console.error('Failed to parse headers!', this.headers, error);
+            headers = undefined;
+        }
+        const storageObject = {
+            user: salla.storage.get('user'),
+            s_translations: salla.storage.get('s_translations'),
+            token: salla.storage.get('token'),
+        };
+        storageObject.user || (delete storageObject.user);
+        storageObject.s_translations || (delete storageObject.s_translations);
+        storageObject.token || (delete storageObject.token);
+        this.sendMessageToIframe({
+            source: "login",
+            type: "init",
+            data: {
+                id: this.storeId,
+                lang: salla.lang.locale,
+                isDark: this.htmlElement.classList.contains('dark') ? true : false,
+                apiUrl: this.api?.replace(/\/+$/, ''),
+                supportWebAuth: this.supportWebAuth,
+                withoutReload: this.withoutReload,
+                inline: this.inline,
+                settings: salla.config.all(),
+                headers: headers,
+                storage: storageObject,
+            }
+        });
+    }
+    async handleGuestCheckout() {
+        this.modal.close();
+        if (salla.config.isGuest()) {
+            return salla.cart.submit(false, true);
+        }
+    }
+    openModal() {
+        if (!this.canRenderIframe) {
+            this.canRenderIframe = true;
+        }
+        this.modal.open();
+    }
+    render() {
+        if (this.inline) {
+            return this.getLoginDom();
+        }
+        return (h("salla-modal", { class: "s-login-modal", ref: modal => this.modal = modal, width: "xs" }, this.getLoginDom()));
+    }
+    getLoginDom() {
+        if (!this.canRenderIframe) {
+            return;
+        }
+        return h(Fragment, null, h("iframe", { src: `${salla.config.get('login.url', 'https://accounts.salla.com')}?src=${this.source}`, title: "Salla Login", class: "hide-scroll", loading: 'lazy', ref: iframe => { this.iframe = iframe; }, allow: "publickey-credentials-get; publickey-credentials-create", scrolling: this.scrolling, frameborder: "0", width: "100%" }));
+    }
+    get host() { return this; }
+    static get style() { return sallaLoginModalCss; }
+}, [0, "salla-login-modal", {
+        "isEmailAllowed": [1028, "is-email-allowed"],
+        "isMobileAllowed": [1028, "is-mobile-allowed"],
+        "isEmailRequired": [1028, "is-email-required"],
+        "supportWebAuth": [516, "support-web-auth"],
+        "inline": [516],
+        "storeId": [1032, "store-id"],
+        "api": [1],
+        "headers": [1025],
+        "withoutReload": [1028, "without-reload"],
+        "source": [32],
+        "messages": [32],
+        "isClosable": [32],
+        "iframeLoaded": [32],
+        "scrolling": [32],
+        "direction": [32],
+        "canRenderIframe": [32],
+        "open": [64]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["salla-login-modal", "salla-loading", "salla-modal"];
+    components.forEach(tagName => { switch (tagName) {
+        case "salla-login-modal":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SallaLoginModal);
+            }
+            break;
+        case "salla-loading":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "salla-modal":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { SallaLoginModal as S, defineCustomElement as d };

package/dist/components/salla-loyalty-prize-item.js

@@ -1,4 +1,42 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import{transformTag as e,proxyCustomElement as t,HTMLElement as a,createEvent as i,h as s,Host as l}from"@stencil/core/internal/client";const o=t(class extends a{constructor(e){super(),!1!==e&&this.__registerHost(),this.prizeItemSelected=i(this,"prizeItemSelected",7)}onPrizeItemClick(){this.prizeItemSelected.emit(this.item)}render(){return s(l,{key:"91162ebf1e2f76c4b90df9518d57a136e71fa573"},s("div",{key:"80416871b0f60857b3279525bdaa87327b75890a",onClick:this.onPrizeItemClick.bind(this)},s("img",{key:"d7afdc106a822c0f7640136bec591bfa48fe1802",class:"s-loyalty-prize-item-image",src:this.item.image,alt:this.item.name}),s("div",{key:"727f131b7fa00b75aab57f2bb5ea4616f0d3929a",class:"s-loyalty-prize-item-title"},this.item.name),s("div",{key:"6e2b9263b7d2c1b7a9e372ede63a6b10a23b0d1d",class:"s-loyalty-prize-item-subtitle"},this.item.description),s("div",{key:"97b7710e76e3d73afe68abe6e8094483960884da",class:"s-loyalty-prize-item-points"},this.item.cost_points," ",salla.lang.get("pages.loyalty_program.point"))))}static get style(){return"salla-loyalty-prize-item:hover{box-shadow:0 5px 15px 1px rgba(0, 0, 0, 0.04) !important}"}},[0,"salla-loyalty-prize-item",{item:[16]}]);function r(){"undefined"!=typeof customElements&&["salla-loyalty-prize-item"].forEach((t=>{"salla-loyalty-prize-item"===t&&(customElements.get(e(t))||customElements.define(e(t),o))}))}r();const c=o,y=r;export{c as SallaLoyaltyPrizeItem,y as defineCustomElement}
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+
+const sallaLoyaltyPrizeItemCss = "salla-loyalty-prize-item:hover{box-shadow:0 5px 15px 1px rgba(0, 0, 0, 0.04) !important}";
+
+const SallaLoyaltyPrizeItem$1 = /*@__PURE__*/ proxyCustomElement(class SallaLoyaltyPrizeItem extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.prizeItemSelected = createEvent(this, "prizeItemSelected", 7);
+    }
+    onPrizeItemClick() {
+        this.prizeItemSelected.emit(this.item);
+    }
+    render() {
+        return (h(Host, { key: '91162ebf1e2f76c4b90df9518d57a136e71fa573' }, h("div", { key: '80416871b0f60857b3279525bdaa87327b75890a', onClick: this.onPrizeItemClick.bind(this) }, h("img", { key: 'd7afdc106a822c0f7640136bec591bfa48fe1802', class: "s-loyalty-prize-item-image", src: this.item.image, alt: this.item.name }), h("div", { key: '727f131b7fa00b75aab57f2bb5ea4616f0d3929a', class: "s-loyalty-prize-item-title" }, this.item.name), h("div", { key: '6e2b9263b7d2c1b7a9e372ede63a6b10a23b0d1d', class: "s-loyalty-prize-item-subtitle" }, this.item.description), h("div", { key: '97b7710e76e3d73afe68abe6e8094483960884da', class: "s-loyalty-prize-item-points" }, this.item.cost_points, " ", salla.lang.get('pages.loyalty_program.point')))));
+    }
+    static get style() { return sallaLoyaltyPrizeItemCss; }
+}, [0, "salla-loyalty-prize-item", {
+        "item": [16]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["salla-loyalty-prize-item"];
+    components.forEach(tagName => { switch (tagName) {
+        case "salla-loyalty-prize-item":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SallaLoyaltyPrizeItem$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SallaLoyaltyPrizeItem = SallaLoyaltyPrizeItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SallaLoyaltyPrizeItem, defineCustomElement };

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

@@ -1,4 +1,118 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import{transformTag as a,proxyCustomElement as l,HTMLElement as t,h as s,Host as o}from"@stencil/core/internal/client";import{l as e}from"./gift.js";import{d as r}from"./salla-button2.js";import{d as y}from"./salla-loading2.js";const i=a=>a?new Date(Number(a)).toLocaleDateString(salla.lang.locale,{weekday:"long",year:"numeric",month:"long",day:"numeric",hour:"numeric"}):"",n=a=>{if(!a)return"";try{const l=a.toLowerCase(),t=salla.lang.get("pages.loyalty_program."+l);return t==="pages.loyalty_program."+l?a:t}catch{return a}},c=l(class extends t{constructor(a){super(),!1!==a&&this.__registerHost(),this.loyaltyPointsArray=[],this.isLoadingLoyalty=!1,this.nextPageUrlLoyalty="",this.handleClick=()=>{this.loadMoreLoyaltyPoints()}}componentWillLoad(){return salla.onReady().then((()=>{this.loadLoyaltyPoints()}))}async loadLoyaltyPoints(){this.isLoadingLoyalty=!0;try{let a="/balance/points?page=1",l=await salla.api.request(a);this.loyaltyPointsArray=l.data,this.nextPageUrlLoyalty=l.cursor.next}catch(a){console.error("Error loading loyalty points transactions",a)}finally{this.isLoadingLoyalty=!1}}async loadMoreLoyaltyPoints(){if(this.nextPageUrlLoyalty){this.isLoadingLoyalty=!0;try{let a=await salla.api.request(this.nextPageUrlLoyalty);this.loyaltyPointsArray=[...this.loyaltyPointsArray,...a.data],this.nextPageUrlLoyalty=a.cursor?.next||""}catch(a){console.error("Error loading more loyalty points",a)}finally{this.isLoadingLoyalty=!1}}}render(){return s(o,{key:"4a8cb15322b005a124eb5792044d6435fd52922e"},s("div",{key:"54a08cfdb24116455b8c137d20ec5ef22a34ff85"},this.isLoadingLoyalty?s("salla-loading",null):s("div",null,this.loyaltyPointsArray.length>0?s("div",null,s("table",{class:"s-loyalty-program-table"},s("thead",{class:"s-loyalty-program-table-head"},s("tr",{class:"s-loyalty-program-table-head-tr"},s("th",{scope:"col",class:"s-loyalty-program-table-head-tr-th"},salla.lang.get("pages.wallet.points")),s("th",{scope:"col",class:"s-loyalty-program-table-head-tr-th"},salla.lang.get("pages.wallet.date")),s("th",{scope:"col",class:"s-loyalty-program-table-head-tr-th"},salla.lang.get("pages.wallet.expiry_date")),s("th",{scope:"col",class:"s-loyalty-program-table-head-tr-th"},salla.lang.get("common.elements.note")),s("th",{scope:"col",class:"s-loyalty-program-table-head-tr-th"},salla.lang.get("common.elements.status")))),s("tbody",{class:"s-loyalty-program-table-tbody"},this.loyaltyPointsArray.map((a=>s("tr",{class:"s-loyalty-program-table-tbody-tr"},s("td",{class:"s-loyalty-program-table-tbody-tr-td"},"plus"===a?.type?"+":"",a?.points||""," ",salla.lang.get("pages.loyalty_program.point")),s("td",{class:"s-loyalty-program-table-tbody-tr-td"},i(a?.created_at?1e3*Number(a.created_at):void 0)),s("td",{class:"s-loyalty-program-table-tbody-tr-td"},i(a?.points_expire_date)),s("td",{class:"s-loyalty-program-table-tbody-tr-td"},n(a?.key)),s("td",{class:"s-loyalty-program-table-tbody-tr-td"},n(a?.status_key))))))),s("div",{class:"s-infinite-scroll-wrapper"},!!this.nextPageUrlLoyalty&&s("salla-button",{onClick:this.handleClick,loading:this.isLoadingLoyalty},salla.lang.get("common.elements.load_more")))):s("div",null,s("div",{class:"s-loyalty-program-table-empty-state"},s("span",{innerHTML:e}),s("div",{class:"s-loyalty-program-table-placeholder-title"},salla.lang.get("pages.loyalty_program.no_loyality_points_title")),s("div",{class:"s-loyalty-program-table-placeholder-sub-title"},salla.lang.get("pages.loyalty_program.no_loyality_points_sub_title")))))))}static get style(){return""}},[0,"salla-loyalty-program",{loyaltyPointsArray:[32],isLoadingLoyalty:[32],nextPageUrlLoyalty:[32]}]);function d(){"undefined"!=typeof customElements&&["salla-loyalty-program","salla-button","salla-loading"].forEach((l=>{switch(l){case"salla-loyalty-program":customElements.get(a(l))||customElements.define(a(l),c);break;case"salla-button":customElements.get(a(l))||r();break;case"salla-loading":customElements.get(a(l))||y()}}))}d();const m=c,p=d;export{m as SallaLoyaltyProgram,p as defineCustomElement}
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { l as loyaltyProgramIcon } from './gift.js';
+import { d as defineCustomElement$3 } from './salla-button2.js';
+import { d as defineCustomElement$2 } from './salla-loading2.js';
+
+const sallaLoyaltyProgramCss = "";
+
+const formatDate = (timestamp) => {
+    if (!timestamp)
+        return '';
+    return new Date(Number(timestamp)).toLocaleDateString(salla.lang.locale, {
+        weekday: 'long',
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: 'numeric',
+    });
+};
+const translateKey = (key) => {
+    if (!key)
+        return '';
+    try {
+        const k = key.toLowerCase();
+        const translation = salla.lang.get(`pages.loyalty_program.${k}`);
+        return translation === `pages.loyalty_program.${k}` ? key : translation;
+    }
+    catch {
+        return key;
+    }
+};
+const SallaWalletTable = /*@__PURE__*/ proxyCustomElement(class SallaWalletTable extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.loyaltyPointsArray = [];
+        this.isLoadingLoyalty = false;
+        this.nextPageUrlLoyalty = '';
+        this.handleClick = () => {
+            this.loadMoreLoyaltyPoints();
+        };
+    }
+    componentWillLoad() {
+        return salla.onReady().then(() => {
+            this.loadLoyaltyPoints();
+        });
+    }
+    async loadLoyaltyPoints() {
+        this.isLoadingLoyalty = true;
+        try {
+            let url = `/balance/points?page=1`;
+            let resp = await salla.api.request(url);
+            this.loyaltyPointsArray = resp.data;
+            this.nextPageUrlLoyalty = resp.cursor.next;
+        }
+        catch (error) {
+            console.error('Error loading loyalty points transactions', error);
+        }
+        finally {
+            this.isLoadingLoyalty = false;
+        }
+    }
+    async loadMoreLoyaltyPoints() {
+        if (!this.nextPageUrlLoyalty)
+            return;
+        this.isLoadingLoyalty = true;
+        try {
+            let resp = await salla.api.request(this.nextPageUrlLoyalty);
+            this.loyaltyPointsArray = [...this.loyaltyPointsArray, ...resp.data];
+            this.nextPageUrlLoyalty = resp.cursor?.next || '';
+        }
+        catch (error) {
+            console.error('Error loading more loyalty points', error);
+        }
+        finally {
+            this.isLoadingLoyalty = false;
+        }
+    }
+    render() {
+        return (h(Host, { key: '4a8cb15322b005a124eb5792044d6435fd52922e' }, h("div", { key: '54a08cfdb24116455b8c137d20ec5ef22a34ff85' }, this.isLoadingLoyalty ? (h("salla-loading", null)) : (h("div", null, this.loyaltyPointsArray.length > 0 ? (h("div", null, h("table", { class: "s-loyalty-program-table" }, h("thead", { class: "s-loyalty-program-table-head" }, h("tr", { class: "s-loyalty-program-table-head-tr" }, h("th", { scope: "col", class: "s-loyalty-program-table-head-tr-th" }, salla.lang.get('pages.wallet.points')), h("th", { scope: "col", class: "s-loyalty-program-table-head-tr-th" }, salla.lang.get('pages.wallet.date')), h("th", { scope: "col", class: "s-loyalty-program-table-head-tr-th" }, salla.lang.get('pages.wallet.expiry_date')), h("th", { scope: "col", class: "s-loyalty-program-table-head-tr-th" }, salla.lang.get('common.elements.note')), h("th", { scope: "col", class: "s-loyalty-program-table-head-tr-th" }, salla.lang.get('common.elements.status')))), h("tbody", { class: "s-loyalty-program-table-tbody" }, this.loyaltyPointsArray.map(point => (h("tr", { class: "s-loyalty-program-table-tbody-tr" }, h("td", { class: "s-loyalty-program-table-tbody-tr-td" }, point?.type === 'plus' ? '+' : '', point?.points || '', " ", salla.lang.get('pages.loyalty_program.point')), h("td", { class: "s-loyalty-program-table-tbody-tr-td" }, formatDate(point?.created_at ? Number(point.created_at) * 1000 : undefined)), h("td", { class: "s-loyalty-program-table-tbody-tr-td" }, formatDate(point?.points_expire_date)), h("td", { class: "s-loyalty-program-table-tbody-tr-td" }, translateKey(point?.key)), h("td", { class: "s-loyalty-program-table-tbody-tr-td" }, translateKey(point?.status_key))))))), h("div", { class: "s-infinite-scroll-wrapper" }, !!this.nextPageUrlLoyalty && (h("salla-button", { onClick: this.handleClick, loading: this.isLoadingLoyalty }, salla.lang.get('common.elements.load_more')))))) : (h("div", null, h("div", { class: "s-loyalty-program-table-empty-state" }, h("span", { innerHTML: loyaltyProgramIcon }), h("div", { class: "s-loyalty-program-table-placeholder-title" }, salla.lang.get('pages.loyalty_program.no_loyality_points_title')), h("div", { class: "s-loyalty-program-table-placeholder-sub-title" }, salla.lang.get('pages.loyalty_program.no_loyality_points_sub_title'))))))))));
+    }
+    static get style() { return sallaLoyaltyProgramCss; }
+}, [0, "salla-loyalty-program", {
+        "loyaltyPointsArray": [32],
+        "isLoadingLoyalty": [32],
+        "nextPageUrlLoyalty": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["salla-loyalty-program", "salla-button", "salla-loading"];
+    components.forEach(tagName => { switch (tagName) {
+        case "salla-loyalty-program":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SallaWalletTable);
+            }
+            break;
+        case "salla-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "salla-loading":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SallaLoyaltyProgram = SallaWalletTable;
+const defineCustomElement = defineCustomElement$1;
+
+export { SallaLoyaltyProgram, defineCustomElement };