@salla.sa/twilight 1.6.13 → 1.6.15-alpha.0

package/dist/cjs/index.js

@@ -1,2 +1,4028 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@salla.sa/base"),t=require("infinite-scroll"),a=require("lang.js"),r=require("axios"),s=require("jwt-decode");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e),l=i(t),o=i(a),d=i(r),c=i(s);let u=function(e,t,a){return alert(e)},h=function(e,t){return u(e,p.error,t)},p={error:"error",success:"success",info:"info"};var f={fire:function(e,t,a){return u(e,t,a)},setNotifier:function(e){u=e},error:h,success:function(e,t){return u(e,p.success,t)},info:function(e,t){return u(e,p.info,t)},sallaInitiated:function(){let e=window.location.href.match(/([\?\&]danger=)[^&]+/g);e&&e.forEach((e=>{h(decodeURI(e.replace("?danger=","").replace("&danger=","")))}))},types:p};class g{constructor(e,t){return this.api=e,this.event=t,new Proxy(this,{get:function(a,r){return"event"===r?t:"api"===r?e:e&&e[r]||a[r]}})}}String.prototype.toStudlyCase=function(){return this.trim().replace(/([^a-zA-Z\d].)/g,(function(e){return e.toUpperCase().replace(/[^a-zA-Z\d]/g,"")}))},String.prototype.toDatasetName=function(){return this.startsWith("data-")?this.substr(5).toStudlyCase():this.toStudlyCase()},String.prototype.toSelector=function(){return this.trim().startsWith(".")||this.trim().startsWith("#")?this:"#"+this},String.prototype.replaceArray=function(e,t){for(var a,r=this,s=0;s<e.length;s++)a=new RegExp(e[s],"g"),r=r.replace(a,t[s]);return r},String.prototype.rtrim=function(e){return void 0===e&&(e="\\s"),this.replace(new RegExp("["+e+"]*$"),"")},String.prototype.ltrim=function(e){return void 0===e&&(e="\\s"),this.replace(new RegExp("^["+e+"]*"),"")},String.prototype.digitsOnly=function(){return Salla.helpers.digitsOnly(this)},Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector),Element.prototype.closest||(Element.prototype.closest=function(e){for(var t=this;t;){if(t.matches(e))return t;t=t.parentElement}}),Element.prototype.getElementSallaData=function(e,...t){if(!this.getAttribute)return;if(this.hasAttribute("data-json"))try{return JSON.parse(this.getAttribute("data-json"))}catch(e){}let a=this.getAttribute("data-function");if(a&&window[a])return"function"==typeof window[a]?this.getFilteredData(window[a].call(this,...t)):this.getFilteredData(window[a]);let r=this.hasAttribute("data-form-selector")?document.querySelector(this.dataset.formSelector):void 0;if(r="FORM"===this.tagName?this:r||this.closest("form")||this.closest("[salla-form-data]")||this,r&&"FORM"===r.tagName)return this.getFilteredData(new FormData(r),null,r);let s=r.querySelectorAll("[name]");if(!s.length)return this.getFilteredData();let i=Object.assign({},this.dataset);return s.forEach((e=>{if(!["checkbox","radio"].includes(e.type)||e.checked)try{let t=Salla.helpers.inputData(e.name,e.value,i);i[t.name]=t.value}catch(t){Salla.log(e.name+" can't be send")}})),this.getFilteredData(i)},Element.prototype.canEventFireHook=function(e){return!!this.hasAttribute&&this.hasAttribute(Salla.api.hooksPrefix+e.type)},Element.prototype.hasAttributeStartsWith=function(e,t){e=e.toLowerCase();for(var a=0;a<this.attributes.length;a++){let r=this.attributes[a].name.toLowerCase();if(0===r.indexOf(e))return!t||r}return!1},HTMLFormElement.prototype.getAjaxFormData=function(e){var t=this.querySelectorAll('input[type="file"]');t.forEach((e=>{e.files.length||e.setAttribute("disabled","")}));var a=new FormData(this);return t.forEach((e=>{e.files.length||e.removeAttribute("disabled")})),{formData:this.getFilteredData(a,e),url:this.getAttribute("action"),method:this.getAttribute("method")||"post",events:{success:this.dataset.onSuccess,fail:this.dataset.onFail}}},Element.prototype.getFilteredData=function(e=null,t=null,a=null){return e=e||a?.dataset||this.dataset,a&&this.name&&void 0!==this.value&&(e=function(e,t,a){e instanceof FormData?e.append(t,a):e[t]=a;return e}(e,this.name,this.value)),["filterBeforeSubmit","filterBeforeSend"].forEach((r=>{let s=a?.dataset[r]||this.dataset[r];if(s){var i=window[s];if("function"==typeof i){if(!i(e,a||this,t)&&e)throw`Data failed to be pass verify function window.${s}(formData, element, event)!`;return i(e,a||this,t)}Salla.log("window."+s+"() not found!")}})),e},HTMLAnchorElement.prototype.getAjaxFormData=function(e){return{formData:this.getFilteredData(null,e),url:this.getAttribute("href"),method:this.dataset.type||"get",events:{success:this.dataset.onSuccess,fail:this.dataset.onFail}}};class m{constructor(){this.events={},this.namespace="";let e=/function (.{1,})\(/.exec(this.constructor.toString());this.className=(e&&e.length>1?e[1]:"").toLowerCase()}after_init(){this.createDynamicFunctions()}createDynamicFunctions(){Object.keys(this.events).forEach((e=>{this.createDynamicEventFuns(e),this.createDynamicListenerFuns(e)}))}createDynamicEventFuns(e){if(this[e])return;let t=this;this[e]=function(...a){return t.dispatch(e,...a)}}createDynamicListenerFuns(e){let t="on"+e.charAt(0).toUpperCase()+e.slice(1);if(this[t])return;let a=this;this[t]=function(t){return a.on(e,t)}}getEventName(e){return e=this.events[e]||e,!this.namespace||e.includes("::")?e:this.namespace+Salla.event.delimiter+e}dispatch(e,...t){return Salla.event.dispatch(this.getEventName(e),...t)}on(e,t){return Salla.event.addListener(this.getEventName(e),t)}once(e,t){return Salla.event.once(this.getEventName(e),t)}}function v(e){e&&e.sallaInitiated&&!e.initiated&&(e.sallaInitiated(),e.initiated=!0)}Salla.event.auth=new class extends m{constructor(){super(),this.namespace="auth",this.events={login:"login",logout:"logout",codeSent:"code.sent",codeNotSent:"code.not-sent",verified:"verified",verificationFailed:"verification.failed",loggedIn:"logged.in",registered:"registered",registrationFailed:"registration.failed",loggedOut:"logged.out",failedLogout:"failed.logout",refreshFailed:"refresh.failed",tokenFetched:"token.fetched"},this.after_init()}login(e){return e?(e.type&&this.setTypeActionOnVerified(e.type),this.next_event=e.next_event||null,this.dispatch("login",...arguments)):(this.next_event=null,this.dispatch("login",...arguments))}loggedIn(e){Salla.profile.info().then((e=>{salla.config.set("user",{id:e.data.id,type:"user",email:e.data.email,mobile:e.data.phone.code+e.data.phone.number,country_code:e.data.phone.country,language_code:e.data.language,currency_code:e.data.currency})})).finally((()=>this.dispatch("loggedIn",e)))}setTypeActionOnVerified(e){this.type_action_on_verified=e}getTypeActionOnVerified(){return this.type_action_on_verified||"redirect"}},Salla.event.cart=new class extends m{constructor(){super(),this.namespace="cart",this.events={latestFetched:"latest.fetched",latestFailed:"latest.failed",updated:"updated",itemUpdated:"item.updated",itemUpdatedFailed:"item.updated.failed",itemAdded:"item.added",itemAddedFailed:"item.added.failed",itemDeleted:"item.deleted",itemDeletedFailed:"item.deleted.failed",submitted:"submitted",submitFailed:"submit.failed",imageDeleted:"image.deleted",imageNotDeleted:"image.not.deleted",detailsFetched:"details.fetched",detailsNotFetched:"details.not.fetched",successReset:"success.reset",couponAdded:"coupon.added",couponDeleted:"coupon.deleted",couponAdditionFailed:"coupon.addition.failed",couponDeletionFailed:"coupon.deletion.failed"},this.after_init()}updated(e){return Salla.cookie.set("fresh_summary",1),e&&"object"==typeof e?(e.offer&&salla.product.event.offerExisted(e.offer),salla.storage.set("cart.summary",{total:e.cart.total,sub_total:e.cart.sub_total,discount:e.cart.discount,real_shipping_cost:e.cart.real_shipping_cost,count:e.cart.count,shipping_cost:e.cart.free_shipping_bar?.has_free_shipping?0:e.cart.real_shipping_cost}),this.dispatch("updated",e.cart)):(Salla.logger.info("Cart summary not an object!",e),this.dispatch("updated"))}latestFetched(e){return this.updated(e.data),this.dispatch("latestFetched",e)}itemAdded(e,t){return this.updated(e.data),this.dispatch("itemAdded",e,t)}itemDeleted(e,t){return this.updated(e.data),this.dispatch("itemDeleted",e,t)}itemUpdated(e,t){return this.updated(e.data),this.dispatch("itemUpdated",e,t)}couponAdded(e,t){return this.updated(e.data),this.dispatch("couponAdded",e,t)}couponDeleted(e,t){return this.updated(e.data),this.dispatch("couponDeleted",e,t)}},Salla.event.order=new class extends m{constructor(){super(),this.namespace="order",this.events={canceled:"canceled",notCanceled:"not.canceled",orderCreated:"order.created",orderCreationFailed:"order.creation.failed",invoiceSent:"invoice.sent",invoiceNotSent:"invoice.not.sent"},this.after_init()}},Salla.event.scope=new class extends m{constructor(){super(),this.namespace="scope",this.events={fetched:"fetched",notFetched:"not.fetched",productAvailabilityFetched:"product-availability.fetched",productAvailabilityNotFetched:"product-availability.not.fetched",changeSucceeded:"changed",changeFailed:"not.changed"},this.after_init()}},Salla.event.rating=new class extends m{constructor(){super(),this.namespace="rating",this.events={orderNotFetched:"order.not.fetched",orderFetched:"order.fetched",storeRated:"store.rated",storeFailed:"store.failed",productsRated:"products.rated",productsFailed:"products.failed",shippingRated:"shipping.rated",shippingFailed:"shipping.failed"},this.after_init()}},Salla.event.comment=new class extends m{constructor(){super(),this.namespace="comment",this.events={added:"added",additionFailed:"addition.failed"},this.after_init()}},Salla.event.loyalty=new class extends m{constructor(){super(),this.namespace="loyalty",this.events={exchangeSucceeded:"exchange.succeeded",exchangeFailed:"exchange.failed",programFetched:"program.fetched",programNotFetched:"program.not.fetched",resetSucceeded:"exchange-reset.succeeded",resetFailed:"exchange-reset.failed"},this.after_init()}},Salla.event.product=new class extends m{constructor(){super(),this.namespace="product",this.events={priceUpdated:"price.updated",priceUpdateFailed:"price.updated.failed",availabilitySubscribed:"availability.subscribed",availabilitySubscribeFailed:"availability.subscribe.failed",categoriesFetched:"categories.fetched",categoriesFailed:"categories.failed",searchFailed:"search.failed",searchResults:"search.results",offerExisted:"offer.existed",fetchOffersFailed:"fetch.offers.failed",offersFetched:"offers.fetched",sizeGuideFetched:"size-guide.fetched",SizeGuideFetchFailed:"size-guide.failed",giftFetched:"gift.fetched",giftFetchFailed:"gift.failed",addGiftToCartSucceeded:"gift.add-to-cart.succeeded",addGiftToCartFailed:"gift.add-to-cart.failed",giftImageUploadSucceeded:"gift.image-upload.succeeded",giftImageUploadFailed:"gift.image-upload.failed"},this.after_init()}},Salla.event.profile=new class extends m{constructor(){super(),this.namespace="profile",this.events={updated:"updated",updateFailed:"update.failed",verificationCodeSent:"verification.code.sent",updateContactsFailed:"update.contacts.failed",verified:"verified",unverified:"unverified",infoFetched:"info.fetched",infoNotFetched:"info.not.fetched"},this.after_init()}},Salla.event.currency=new class extends m{constructor(){super(),this.namespace="currency",this.events={changed:"changed",failed:"failed",fetched:"fetched",failedToFetch:"failed.to.fetch"},this.after_init()}},Salla.event.document=new class extends m{constructor(){super(),this.namespace="document",this.events={click:"click",change:"change",submit:"submit",keyup:"keyup",leaving:"leaving",request:"request",requestFailed:"request.failed"},this.after_init()}onClick(e,t){this.fireCallableFuns("click",e,t)}onChange(e,t){this.fireCallableFuns("change",e,t)}onSubmit(e,t){this.fireCallableFuns("submit",e,t)}onKeyup(e,t){this.fireCallableFuns("keyup",e,t)}fireCallableFuns(e,t,a){this.on(e,(e=>{"function"!=typeof t?"function"==typeof a&&e.target.matches(t)&&a(e):t(e)}))}fireEvent(e,t,...a){return this.fireEventForElements(e,t,!1,...a)}fireEventForAll(e,t,...a){return this.fireEventForElements(e,t,!0,...a)}fireEventForElements(e,t,a,...r){if("string"==typeof e){if(a)return document.querySelectorAll(e).forEach((e=>this.fireEventForElements(e,t,!1,...r)));e=document.querySelector(e)}if(!e)return void salla.log("Failed To get element to fire event: "+t);const s=new CustomEvent(t,...r);return e.dispatchEvent(s)}},Salla.event.wishlist=new class extends m{constructor(){super(),this.namespace="wishlist",this.events={added:"added",removed:"removed",additionFailed:"addition.failed",removingFailed:"removing.failed"},this.after_init()}},Salla.event.infiniteScroll=new class extends m{constructor(){super(),this.namespace="infiniteScroll",this.events={scrollThreshold:"scroll.threshold",request:"request",load:"load",append:"append",error:"error",last:"last",history:"history"},this.after_init()}},Salla.event.on("twilight::initiated",(()=>{Object.keys(Salla).forEach((e=>{"object"==typeof(e=Salla[e])&&(v(e),Object.keys(e).forEach((t=>{v(e[t])})))}))})),Salla.config.default_properties={debug:"undefined"!=typeof process&&"development"===process.env.NODE_ENV,token:null,fastRequests:!0,canLeave:!0,store:{api:"https://api.salla.dev/store/v1/"},currencies:{SAR:{code:"SAR",name:"ريال سعودي",symbol:"ر.س",amount:1,country_code:"sa"}}},Salla.config.merge(Salla.config.default_properties),Salla.config.triedToGetCurrencies_=!1,Salla.config.triedToGetLanguages_=!1,Salla.config.isUser=()=>"user"===Salla.config.get("user.type"),Salla.config.isGuest=()=>!Salla.config.isUser(),Salla.config.languages=async()=>{if(Salla.config.triedToGetLanguages_)return Salla.config.get("languages");Salla.config.triedToGetLanguages_=!0;let e=!0,t=[];return(await salla.document.api.request("languages",null,"get"))?.data?.map((a=>{e&&(t=[],e=!1),a.code=a.code||a.iso_code,a.url=salla.url.get(a.code),a.is_rtl=a.is_rtl||a.rtl,t.push(a)})),Salla.config.set("languages",t),t},Salla.config.currencies=async()=>{if(Salla.config.triedToGetCurrencies_)return Salla.config.get("currencies");Salla.config.triedToGetCurrencies_=!0;let e=!0,t={};return(await salla.currency.api.list())?.data?.map((a=>{e&&(t={},e=!1),a.country_code=a.code.substr(0,2).toLowerCase(),t[a.code]=a})),Salla.config.set("currencies",t),t},Salla.config.currency=e=>(e=e||Salla.config.get("user.currency_code"),Salla.config.get("currencies."+e)||Object.values(Salla.config.get("currencies"))[0]);class y extends o.default{constructor(e){(e=e||{}).messages=e.messages||window.translations,e.locale=e.locale||(window.locale||navigator.language||navigator.userLanguage||"ar").split("-")[0],e.fallback=e.fallback||e.locale,super(e),this.translationsLoaded=!1}onLoaded(e){if(this.translationsLoaded)return e();Salla.event.once("languages::translations.loaded",e)}loadStoreTranslations(){if(this.messages)return void window.addEventListener("load",(e=>{salla.event.dispatch("languages::translations.loaded"),salla.logger.info("The messages of transactions is already loaded")}));if(!salla.url.get(""))return void this.loadScript("https://cdn.salla.network/js/translations.js",!1);let e=salla.config.get("theme.translations_hash",salla.config.get("store.id","twilight"));this.loadScript(salla.url.get(`languages/assets/${e}.js`))}setMessages(e){super.setMessages(e),salla.event.dispatch("languages::translations.loaded"),this.translationsLoaded=!0}loadScript(e,t=!0){let a=document.createElement("script");a.src=e,a.onload=()=>{if(window.translations)return this.setMessages(window.translations);a.onerror()},a.onerror=()=>{if(t)return salla.logger.warn("Failed to load Translations for store, lets try load it from CDN"),this.loadScript("https://cdn.salla.network/js/translations.js",!1);salla.logger.error("Failed to load Translations, check your network logs for more details\nor: salla.lang.setMessages({....}), see https://docs.salla.dev for more information's.")},document.head.appendChild(a)}get(e,t,a){return window.translations&&(e="trans."+e),super.get(e,t,a)}set(e,t){return salla.helpers.setNested(this.messages[this.getLocale()+".trans"],e,t),this}}class w{constructor(){this.endpoints={},this.webEndpoints=[],this.namespace="BaseApi",this.endpointsMethods={},this.endpointsHeaders={};let e=/function (.{1,})\(/.exec(this.constructor.toString());this.className=(e&&e.length>1?e[1]:"").toLowerCase(),this.debounce={request:void 0,time:300,enabled:!0,exclude:[]}}after_init(){}normalRequest(e,t,a=null){let r=Array.isArray(e),s=r?this.getUrl(...e):this.getUrl(e);e=r?e[0]:e,a=a||this.endpointsMethods[e]||"post";let i=this.endpointsHeaders[e];if("get"===a&&t instanceof FormData){let e={};Array.from(t.entries()).forEach((function(t){e[t[0]]=t[1]})),t={params:e}}return i&&"get"===a&&(t=t?Object.assign(t,i):i),this.webEndpoints.includes(e)?s=salla.url.get(s):"http"!==s.substring(0,4)&&(s=salla.url.api(s)),Salla.api.request(s,t,a,{headers:i})}request(e,t,a=null){return!salla.api.isFastRequestsAllowed()&&this.debounce.enabled?(this.debounce.request||(this.debounce.request=salla.helpers.debounce(this.normalRequest.bind(this),this.debounce.time)),this.debounce.request(e,t,a)):this.normalRequest(e,t,a)}getUrl(e){let t=this.endpoints[e]||e;const a=/{[^{}]+}/i;for(let e=1;e<arguments.length;e++)t=t.replace(a,arguments[e]);return t}event(){return salla.event[this.className]}}class b extends w{constructor(){super(),this.namespace="cart",this.endpoints={latest:"cart/latest",details:"cart/{cart}",quickAdd:"cart/{cart}/item/{product}/quick-add",addItem:"cart/{cart}/item/{product}/add",deleteItem:"cart/{cart}/item/{item}",updateItem:"cart/{cart}/item/{item}",deleteImage:"cart/{cart}/image/{image}",uploadImage:"cart/{cart}/image",status:"cart/{cart}/status",addCoupon:"cart/{id}/coupon",deleteCoupon:"cart/{id}/coupon"},this.endpointsMethods={latest:"get",details:"get",status:"get",updateItem:"post",deleteItem:"delete",deleteImage:"delete",deleteCoupon:"put"},this.webEndpoints=["latest"],this.after_init()}async getCurrentCartId(){return salla.storage.get("cart.id")||(await this.latest()).data.cart.id}getUploadImageEndpoint(e){return salla.url.api(this.getUrl("uploadImage",e||salla.storage.get("cart.id")))}latest(){return this.request("latest",{params:{source:""}}).then((e=>(salla.storage.set("cart",e.data.cart),salla.event.cart.latestFetched(e),e))).catch((e=>{throw salla.storage.set("cart",""),salla.event.cart.latestFailed(e),e}))}async details(){let e=await this.getCurrentCartId();return this.request(["details",e]).then((function(e){return salla.cart.event.detailsFetched(e),e})).catch((function(e){throw salla.cart.event.detailsNotFetched(e),e}))}async quickAdd(e){return this.addItem(e)}async addItem(e){let t=this.getCartPayload(e);if(!t.id){let e='There is no product "id"!';return salla.cart.event.itemAddedFailed(e),salla.api.errorPromise(e)}let a=salla.form.getPossibleValue(t.payload,["quantity","donating_amount"])?"addItem":"quickAdd",r=await this.getCurrentCartId();return this.request([a,r,t.id],t.payload).then((function(e){return salla.cart.event.itemAdded(e,t.id),e})).catch((function(e){throw salla.cart.event.itemAddedFailed(e,t.id),e}))}async deleteItem(e){let t=this.getCartPayload(e);if(!t.id){let e='There is no "id"!';return salla.cart.event.itemDeletedFailed(e),salla.api.errorPromise(e)}let a=await this.getCurrentCartId();return this.request(["deleteItem",a,t.id]).then((function(e){return salla.cart.event.itemDeleted(e,t.id),e})).catch((function(e){throw salla.cart.event.itemDeletedFailed(e,t.id),e}))}async updateItem(e){let t=this.getCartPayload(e);if(!t.id){let e='There is no "id"!';return salla.cart.event.itemUpdatedFailed(e),salla.api.errorPromise(e)}let a=await this.getCurrentCartId();return"Object"===t.payload.constructor?.name?t.payload._method="PUT":t.payload.append("_method","PUT"),this.request(["updateItem",a,t.id],t.payload).then((function(e){return salla.cart.event.itemUpdated(e,t.id),e})).catch((function(e){throw salla.cart.event.itemUpdatedFailed(e,t.id),e}))}async deleteImage(e){if(!(e=salla.form.getPossibleValue(e,["id","image_id","photo_id"]))){let e='There is no "id"!';return salla.cart.event.imageNotDeleted(e),salla.api.errorPromise(e)}let t=await this.getCurrentCartId();return this.request(["deleteImage",t,e]).then((function(t){return salla.cart.event.imageDeleted(t,e),t})).catch((function(t){throw salla.cart.event.imageNotDeleted(t,e),t}))}async status(e){return this.request(["status",e||await this.getCurrentCartId()])}async submit(){this.status(await this.getCurrentCartId()).then((e=>{let t=e.data.next_step.to;if(!["checkout","refresh","login"].includes(t)){let e="Can't find next_step );";throw salla.cart.event.submitFailed(e),e}if(salla.cart.event.submitted(e),"login"===t)return salla.auth.setCanRedirect(!1),salla.event.dispatch("login::open"),void salla.auth.event.onLoggedIn((e=>{salla.event.dispatch("login::close"),this.submit()}));"checkout"===t?window.location.href=e.data.next_step.url+(window.ApplePaySession?"?has_apple_pay=true":""):window.location.reload()})).catch((function(e){throw salla.cart.event.submitFailed(e),e}))}getCartPayload(e){let t=e?.data||("object"==typeof e?e:void 0);return e=t?salla.form.getPossibleValue(t,["prod_id","product_id","item_id","id"]):e,t="object"==typeof t?t:void 0,{id:e,payload:t}}normalRequest(e,t,a=null){return super.normalRequest(e,t,a).catch((e=>{throw 403===e?.response?.status&&(salla.storage.remove("cart"),salla.error(salla.lang.get("pages.checkout.try_again"))),e}))}reset(){salla.storage.remove("cart"),salla.cart.event.successReset()}async addCoupon(e){if(e=e.data||e,!(e=salla.form.getPossibleValue(e,["coupon"]))){let e=new Error('There is no "Coupon Code"!');return e.name="EmptyCoupon",salla.event.cart.couponAdditionFailed(e),salla.api.errorPromise(e)}let t=await salla.cart.api.getCurrentCartId();return this.request(["addCoupon",t],{coupon:e}).then((function(e){return salla.event.cart.couponAdded(e,t),e})).catch((function(e){throw salla.event.cart.couponAdditionFailed(e,t),e}))}async deleteCoupon(){let e=await salla.cart.api.getCurrentCartId();return this.request(["deleteCoupon",e],{}).then((function(t){return salla.event.cart.couponDeleted(t,e),t})).catch((function(t){throw salla.event.cart.couponDeletionFailed(t,e),t}))}}class S extends w{constructor(){super(),this.namespace="loyalty",this.endpoints={getProgram:"loyalty",exchange:"loyalty/exchange",reset:"loyalty/exchange"},this.endpointsMethods={getProgram:"get",reset:"put"},this.after_init()}getProgram(){return this.request("getProgram").then((e=>(salla.loyalty.event.programFetched(e),e))).catch((e=>{throw salla.loyalty.event.programNotFetched(e),e}))}async exchange(e,t=null){if(!(e=salla.form.getPossibleValue(e,["id","loyalty_prize_id","prize_id"]))){let e="Unable to find cart id. Please provide one.";return salla.loyalty.event.exchangeFailed(e),salla.api.errorPromise(e)}if(!(t=t||await salla.cart.getCurrentCartId())){let e="Unable to find cart id. Please provide one.";return salla.loyalty.event.exchangeFailed(e),salla.api.errorPromise(e)}return this.request("exchange",{loyalty_prize_id:e,cart_id:t}).then((function(t){return salla.loyalty.event.exchangeSucceeded(t,e),t})).catch((function(t){throw salla.loyalty.event.exchangeFailed(t,e),t}))}async reset(e=null){if(!(e=e||await salla.cart.getCurrentCartId())){let e="Unable to find cart id. Please provide one.";return salla.loyalty.event.resetFailed(e),salla.api.errorPromise(e)}return this.request("reset",{cart_id:e}).then((e=>(salla.loyalty.event.resetSucceeded(e),e))).catch((e=>{throw salla.loyalty.event.resetFailed(e),e}))}}class F extends w{constructor(){super(),this.namespace="auth",this.canRedirect_=!0,this.endpoints={login:"auth/{type}/send_verification",resend:"auth/resend_verification",verify:"auth/{type}/verify",register:"auth/register",logout:"logout",refresh:"auth/refresh"},this.webEndpoints=["logout","auth/jwt","refresh"],this.endpointsMethods={logout:"get"},this.after_init()}setCanRedirect(e){salla.api.auth.canRedirect_=e}canRedirect(){return salla.api.auth.canRedirect_}login(e){e?.data&&(e=e.data);let t=salla.form.getPossibleValue(e,["type"]);if(!["email","mobile"].includes(t)){let e="Login type should be in: [email, mobile]";return salla.auth.event.codeNotSent(e),salla.api.errorPromise(e)}return this.request(["login",t],e).then((function(e){return salla.auth.event.codeSent(e,t),e})).catch((function(e){throw salla.auth.event.codeNotSent(e,t),e}))}async verify(e,t=!0){let a=salla.form.getPossibleValue(e,["type"]);if(!a){let e="Failed to know what's login type!";return salla.auth.event.verificationFailed(e),salla.api.errorPromise(e)}t=!1!==salla.form.getPossibleValue(e,["supportWebAuth"])&&t,salla.auth.event.next_event&&(e.next_event=salla.auth.event.next_event);let r=await this.request(["verify",a],e);if(200!==r?.status)return salla.auth.event.verificationFailed(r,a),salla.api.errorPromise(r);let s="authenticated"===r.data?.case;return s&&salla.auth.event.tokenFetched(r.data.token),t&&await this.request("auth/jwt"),s&&salla.auth.event.loggedIn(r),salla.auth.event.verified(r,a),salla.api.successPromise(r)}resend(e){let t;return(e=e.data||e).type=e.type||"mobile","mobile"!==e.type||e.phone&&e.country_code?"email"!==e.type||e.email?this.request("resend",e).then((function(t){return salla.auth.event.codeSent(t,e),t})).catch((function(t){throw salla.auth.event.codeNotSent(t,e),t})):(salla.auth.event.codeNotSent(t="There is no email!",e),salla.api.errorPromise(t)):(salla.auth.event.codeNotSent(t="There is no phone or country_code!",e),salla.api.errorPromise(t))}register(e){let t;return e.data&&(t=e.element,e=e.data),salla.auth.event.next_event&&(e.next_event=salla.auth.event.next_event),this.request("register",e).then((function(e){return salla.auth.event.registered.call(t,e),"authenticated"===e.data?.case&&salla.auth.event.loggedIn(e),e})).catch((function(e){throw salla.auth.event.registrationFailed.call(t,e),e}))}logout(){return this.request("logout").then((function(e){return salla.auth.event.loggedOut(e),salla.log("Reloading after 0.1 sec..."),setTimeout((()=>location.reload()),100),e})).catch((function(e){throw salla.auth.event.failedLogout(e),e}))}refresh(){return this.request("refresh").catch((function(e){throw salla.auth.event.refreshFailed(e),e}))}}class _ extends w{constructor(){super(),this.namespace="order",this.endpoints={cancel:"orders/cancel/{id}",createCartFromOrder:"reorder/{id}",sendInvoice:"orders/send/{id}"},this.endpointsMethods={createCartFromOrder:"get"},this.after_init()}show(e){let t=salla.form.getPossibleValue(e?.data||e,["id","order_id"]);salla.event.dispatch("mobile::order.placed",{order_id:t}),location.href=salla.form.getPossibleValue(e?.data||e,["url"])}cancel(e){return e=e||Salla.config.get("page.id"),this.request(["cancel",e],{params:{has_apple_pay:!!window.ApplePaySession}}).then((function(t){return salla.event.order.canceled(t,e),t})).catch((function(t){throw salla.event.order.notCanceled(t,e),t}))}createCartFromOrder(e){return e=e||salla.config.get("page.id"),this.request(["createCartFromOrder",e]).then((function(t){return salla.storage.set("cart",{id:t.data.cart_id,user_id:salla.config.get("user.id")}),salla.event.order.orderCreated(t,e),window.location.href=t.data.url,t})).catch((function(t){throw salla.event.order.orderCreationFailed(t,e),t}))}sendInvoice(e){let t=salla.form.getPossibleValue(e,["id"])||salla.config.get("page.id");if(!t||isNaN(t)){let e="There is no id!";return salla.order.event.invoiceNotSent(e),salla.api.errorPromise(e)}return this.request(["sendInvoice",t],e).then((e=>(salla.event.order.invoiceSent(e,t),e))).catch((e=>{throw salla.event.order.invoiceNotSent(e,t),e}))}}class A extends w{constructor(){super(),this.namespace="product",this.previousQuery="",this.endpoints={getPrice:"products/{id}/price",availabilitySubscribe:"products/{id}/availability-notify",search:"products/search",categories:"products/categories/{?id}",offers:"products/{product_id}/specialoffer",getSizeGuides:"products/{prod_id}/size-guides",giftDetail:"products/{product_id}/buy-as-gift",giftToCart:"products/{product_id}/buy-as-gift",giftImage:"products/buy-as-gift/image"},this.endpointsMethods={giftDetail:"get"},this.after_init()}getPrice(e){let t=e.data||e,a=salla.form.getPossibleValue(t,["id","prod_id","product_id"]);return this.request(["getPrice",a],"object"==typeof t?t:void 0).then((function(e){return salla.product.event.priceUpdated(e,a),e})).catch((function(e){throw salla.product.event.priceUpdateFailed(e,a),e}))}categories(e){return this.request(["categories",e||""],null,"get").then((function(e){return salla.product.event.categoriesFetched(e),e})).catch((function(e){throw salla.product.event.categoriesFailed(e),e}))}availabilitySubscribe(e){let t=e.data||e;return e=salla.form.getPossibleValue(t,["id","prod_id"]),this.request(["availabilitySubscribe",e],"object"==typeof t?t:void 0).then((function(t){return salla.product.event.availabilitySubscribed(t,e),t})).catch((function(t){throw salla.product.event.availabilitySubscribedFailed(t,e),t}))}search(e){let t=e.data;if(t||(t={params:"string"==typeof e?{query:e}:e}),!(e=t instanceof FormData?t.get("query"):t.query||t.params?.query)){let e='There is no "query"!';return salla.product.event.searchFailed(e),salla.api.errorPromise(e)}if(e===salla.api.product.previousQuery){let e="Query is same as previous one!";return salla.product.event.searchFailed(e),salla.api.product.previousQuery=null,salla.api.errorPromise(e)}return salla.api.product.previousQuery=e,this.request("search",t,"get").then((function(t){return salla.product.event.searchResults(t,e),t})).catch((function(t){throw salla.product.event.searchFailed(t,e),t}))}offers(e){if(!(e=salla.form.getPossibleValue(e?.data|e,["product_id","id"]))){let e='There is no "product_id"!';return salla.offer.event.fetchDetailsFailed(e),salla.api.errorPromise(e)}return this.request(["offers",e]).then((function(t){return salla.product.event.offersFetched(t,e),t})).catch((function(t){throw salla.product.event.fetchOffersFailed(t,e),t}))}getSizeGuides(e){return this.request(`products/${e}/size-guides`,null,"get").then((t=>(salla.product.event.sizeGuideFetched(t,e),t))).catch((t=>{throw salla.product.event.sizeGuideFetchFailed(t,e),t}))}getGiftDetails(e){return this.request(["giftDetail",e]).then((t=>(salla.product.event.giftFetched(t,e),t))).catch((t=>{throw salla.product.event.giftFetchFailed(t,e),t}))}addGiftToCart(e,t,a=!1){return this.request(["giftToCart",e],t).then((t=>(salla.product.event.addGiftToCartSucceeded(t,e),a&&(window.location.href=t.redirect),response))).catch((t=>{throw salla.product.event.addGiftToCartFailed(t,e),t}))}uploadGiftImage(e){return this.request("giftImage",e).then((e=>(salla.product.event.giftImageUploadSucceeded(e),e))).catch((e=>{throw salla.product.event.giftImageUploadFailed(e),e}))}}class E extends w{constructor(){super(),this.namespace="profile",this.endpoints={info:"auth/user",update:"profile/update",updateContacts:"profile/contacts/update",verify:"profile/verify"},this.after_init()}info(){return this.request("info",null,"get").then((e=>(salla.profile.event.infoFetched(e),e))).catch((e=>{throw salla.profile.event.infoNotFetched(e),e}))}update(e){return this.request("update",e).then((e=>(salla.profile.event.updated(e),e))).catch((e=>{throw salla.event.profile.updateFailed(e),e}))}updateContacts(e){return this.request("updateContacts",e).then((e=>(salla.profile.event.verificationCodeSent(e),e))).catch((e=>{throw salla.event.profile.updateContactsFailed(e),e}))}verify(e){return this.request("verify",e).then((e=>(salla.profile.event.verified(e),e))).catch((e=>{throw salla.event.profile.unVerified(e),e}))}}class q extends w{constructor(){super(),this.namespace="comment",this.endpoints={add:"{type}/{id}/comments"},this.after_init()}add(e){e?.data&&(e=e.data);let t,{id:a,type:r,comment:s}=Object.fromEntries(e);return a?r&&["products","pages","product","page"].includes(r)?s?(r+=["product","page"].includes(r)?"s":"",this.request(["add",r,a],{comment:s}).then((function(e){return salla.event.comment.added(e,a),e})).catch((function(e){throw salla.event.comment.additionFailed(e,a),e}))):(salla.event.comment.additionFailed(t="can't find comment content!"),salla.api.errorPromise(t)):(salla.event.comment.additionFailed(t="Failed to get type one of:(products, product, page, pages)!"),salla.api.errorPromise(t)):(salla.event.comment.additionFailed(t="Failed to get id!"),salla.api.errorPromise(t))}}class x extends w{constructor(){super(),this.namespace="currency",this.endpoints={change:"/",list:"currencies"},this.endpointsMethods={change:"get",list:"get"},this.webEndpoints=["change"],this.after_init()}change(e){if(!(e=salla.form.getPossibleValue(e.data||e,["currency","code"]))){let e="Can't find currency code!";return salla.currency.event.failed(e),salla.api.errorPromise(e)}return this.request("change",{params:{change_currency:"",currency:e}}).then((function(t){return salla.cookie.set("fresh_summary",1),salla.storage.set("cart",""),salla.currency.event.changed(t,e),t})).catch((function(t){throw salla.currency.event.failed(t,e),t}))}list(){return this.request("list").then((function(e){return salla.currency.event.fetched(e),e})).catch((function(e){throw salla.currency.event.failedToFetch(e),e}))}}class C extends w{constructor(){super(),this.namespace="document"}}class P extends w{constructor(){super(),this.namespace="rating",this.endpoints={store:"rating/store",products:"rating/products",shipping:"rating/shipping",order:"rating/{order_id}"},this.endpointsMethods={order:"get"},this.after_init()}order(e){let t="object"==typeof e?e:{},a=salla.form.getPossibleValue(e?.data||e,["order_id","id"]);if(!a){let e='There is no "order_id"!';return salla.event.rating.orderNotFetched(e),salla.api.errorPromise(e)}return this.request(["order",a],t).then((function(e){return salla.event.rating.orderFetched(e,a),e})).catch((function(e){throw salla.event.rating.orderNotFetched(e,a),e}))}store(e){if(!(e=e.data||e)){let e='There is no "data"!';return salla.event.rating.storeFailed(e),salla.api.errorPromise(e)}return this.request("store",e).then((function(t){return salla.event.rating.storeRated(t,e),t})).catch((function(t){throw salla.event.rating.storeFailed(t,e),t}))}products(e){if(!(e=e.data||e)){let e='There is no "data"!';return salla.event.rating.productsFailed(e),salla.api.errorPromise(e)}return this.request("products",e).then((function(t){return salla.event.rating.productsRated(t,e),t})).catch((function(t){throw salla.event.rating.productsFailed(t,e),t}))}shipping(e){if(!(e=e.data||e)){let e='There is no "data"!';return salla.event.rating.shippingFailed(e),salla.api.errorPromise(e)}return this.request("shipping",e).then((function(t){return salla.event.rating.shippingRated(t,e),t})).catch((function(t){throw salla.event.rating.shippingFailed(t,e),t}))}}class T extends w{constructor(){super(),this.namespace="wishlist",this.endpoints={add:"products/favorites/{id}",remove:"products/favorites/{id}"},this.endpointsMethods={remove:"delete"},this.after_init()}toggle(e){return salla.storage.get("salla::wishlist",[]).includes(e)?this.remove(e):this.add(e)}add(e){let t;return salla.config.isGuest()?(salla.wishlist.event.additionFailed(t=salla.lang.get("common.messages.must_login")),salla.error(t),salla.api.errorPromise(t)):(e=salla.form.getPossibleValue(e?.data||e,["product_id","id"]))?this.request(["add",e]).then((t=>(this.updateWishlistStorage(e),salla.wishlist.event.added(t,e),t))).catch((function(t){throw salla.wishlist.event.additionFailed(t,e),t})):(salla.wishlist.event.additionFailed(t="Failed to get product id!"),salla.api.errorPromise(t))}remove(e){let t;return salla.config.isGuest()?(salla.wishlist.event.additionFailed(t=salla.lang.get("common.messages.must_login")),salla.error(t),salla.api.errorPromise(t)):(e=salla.form.getPossibleValue(e?.data||e,["product_id","id"]))?this.request(["remove",e]).then((t=>(this.updateWishlistStorage(e,!1),salla.wishlist.event.removed(t,e),t))).catch((function(t){throw salla.wishlist.event.removingFailed(t,e),t})):(salla.wishlist.event.removingFailed(t="Failed to get id!"),salla.api.errorPromise(t))}updateWishlistStorage(e,t=!0){let a=salla.storage.get("salla::wishlist",[]);t?a.push(e):a.splice(a.indexOf(e),1),salla.storage.set("salla::wishlist",a)}}class k extends w{constructor(){super(),this.namespace="scopes",this.endpoints={get:"scopes",change:"scopes",getProductAvailability:"scopes/availability?product_id={id}"},this.after_init()}get(){return this.request("scopes",null,"get").then((e=>(salla.scope.event.fetched(e),e))).catch((e=>{throw salla.scope.event.notFetched(e),e}))}change(e){return this.request("scopes",e).then((e=>(salla.scope.event.changeSucceeded(e),e))).catch((e=>{throw salla.scope.event.changeFailed(e),e}))}getProductAvailability(e=null){return this.request(`scopes/availability?product_id=${e}`,null,"get").then((t=>(salla.scope.event.productAvailabilityFetched(t,e),t))).catch((e=>{throw salla.scope.event.productAvailabilityNotFetched(e),resp}))}}class D{constructor(e){e?(n.default.config.merge(e),e?.events&&n.default.event.dispatchEvents(e?.events),e._token&&salla.api.setHeader("X-CSRF-TOKEN",e._token),this.injectMaintenanceAlert(),this.injectThemePreviewAlert(),this.injectEditAlert(),e?.user?.language_code&&salla.lang.setLocale(e?.user?.language_code),salla.lang.loadStoreTranslations(),n.default.event.dispatch("twilight::initiated",e)):n.default.event.dispatch("twilight::initiated",e)}injectMaintenanceAlert(){salla.config.get("maintenance")&&(document.querySelector(".store-notify")?salla.logger.warn(".store-notify element Existed before!"):salla.lang.onLoaded((()=>{const e=document.createElement("div");e.classList.add("store-notify"),e.style="background-color: #d63031; color: #fff; padding: 10px 15px; text-align: center; font-size: 17px;",e.innerHTML=`<p style="margin:0 !important;">${salla.lang.get("blocks.header.maintenance_alert")}</p>`,document.body.prepend(e)})))}injectThemePreviewAlert(){"preview"===salla.config.get("theme.mode")&&(document.querySelector("#s-theme_preview_bar")?salla.logger.warn("#s-theme_preview_bar element Existed before!"):salla.lang.onLoaded((()=>{let e=document.createElement("div");e.id="s-theme_preview_bar",e.setAttribute("style","display: flex; justify-content: space-between; text-align: center; background-color: #232323; color: #fff; padding: 10px; font-size: 0.875rem; line-height: 1.25rem; position: relative;"),e.innerHTML=`\n              <div style="display:flex; align-items:center;">\n                <img width="32" src="https://assets.salla.sa/cp/assets/images/logo-new.png">\n                <span style="margin:0 10px;">${salla.lang.get("blocks.header.preview_mode")}: <span style="background:rgba(255,255,255,0.25);border-radius:15px; padding:2px 15px 4px">${salla.config.get("theme.name")}</span></span>\n              </div>\n              <a href="${salla.url.get("preview_theme/cancel/preview")}" style="line-height:32px; width:32px;"><i class="sicon-cancel"></i></a>\n            `,document.body.prepend(e)})))}injectEditAlert(){let e=salla.config.get("edit");e&&(document.querySelector("#s-edit-alert")?salla.logger.warn("#s-edit-alert element Existed before!"):salla.lang.onLoaded((()=>{let t=document.createElement("div");t.id="s-edit-alert",t.innerHTML=`\n              <a href="${e}" style="display:block; background-color:${salla.config.get("theme.color.primary","#5cd5c4")}; color:${salla.config.get("theme.color.reverse","#fff")}; padding: 10px; text-align:center; font-size: 0.875rem; line-height: 1.25rem;">\n                <i class="sicon-edit"></i> \n                ${salla.lang.get("pages.products.quick_edit")}\n              </a>\n            `,document.body.prepend(t)})))}handleElementAjaxRequest(e,t){if(!(t instanceof HTMLFormElement||t instanceof HTMLAnchorElement))return salla.logger.warn("trying to call ajax from non Element!!"),!1;e.preventDefault();let a=t.getAjaxFormData(e),r=a.method?a.method.toLowerCase():void 0;salla.api.request(a.url,a.formData,r).then((e=>(e.data&&e.request&&(e=e.data),salla.api.handleAfterResponseActions(e),this.callAjaxEvent(a.events.success,e,a.formData),e))).catch((e=>{throw salla.api.handleErrorResponse(e),this.callAjaxEvent(a.events.fail,e,a.formData),e}))}callAjaxEvent(e,t,a){if(e){if(a instanceof FormData){const e={};Array.from(a.entries()).forEach((function(t){e[t[0]]=t[1]})),a=e}window[e]?window[e](t,a):salla.event.dispatch(e,t,a)}}}n.default.notify=f,n.default.lang=new y,n.default.form=new class{async submit(e,t=null){let a=t;if("SubmitEvent"===t?.constructor?.name){if(t.preventDefault(),"FORM"!==t.target?.tagName)return Salla.logger.warn("Failed find the target element for submit action. make sure you submit a form element"),new Promise((()=>{throw"Failed find the target element for submit action. make sure you submit a form element"}));"SALLA-BUTTON"===t?.submitter?.parentElement?.tagName&&t.submitter.parentElement.load(),a=t.target.getElementSallaData(),salla.log("Data from element",a)}if(/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)$/gm.test(e))return salla.api.normalRequest(e,a,"post").finally((()=>{loaderSupported&&t?.submitter?.parentElement.stop()}));let r=e.split("."),s=r.splice(-1);return await salla.call(r.join("."))[s](a).finally((()=>t?.submitter?.parentElement?.stop())).catch((e=>{throw salla.logger.warn(e),e}))}onSubmit(e,t){return salla.form.submit(e,t),!1}onChange(e,t){return t?.currentTarget?"FORM"!==t?.currentTarget?.tagName||t.currentTarget.checkValidity()?(salla.form.submit(e,t.currentTarget.getElementSallaData()),!0):(salla.logger.warn(`Trying to trigger '${e}' without filling required fields!`),!1):(salla.logger.warn(`Trying to trigger '${e}' without event!`),!1)}getPossibleValue(e,t,a=!1){if(!e)return;if("object"!=typeof e)return e;let r;for(let a=0;a<t.length&&!(r=e[t[a]])&&!("undefined"!=typeof FormData&&e instanceof FormData&&(r=e.get(t[a])));a++);return r=r||e,"object"!=typeof r||a?r:void 0}},n.default.AppHelpers=class{toggleClassIf(e,t,a,r){return document.querySelectorAll(e).forEach((e=>this.toggleElementClassIf(e,t,a,r))),this}toggleElementClassIf(e,t,a,r){t=Array.isArray(t)?t:t.split(" "),a=Array.isArray(a)?a:a.split(" ");let s=r(e);return e?.classList.remove(...s?a:t),e?.classList.add(...s?t:a),this}isValidEmail(e){return/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(String(e).toLowerCase())}element(e){return"object"==typeof e?e:document.querySelector(e)}watchElement(e,t){return this[e]=this.element(t),this}watchElements(e){return Object.entries(e).forEach((e=>this.watchElement(e[0],e[1]))),this}on(e,t,a,r={}){return"object"==typeof t?(this.element(t).addEventListener(e,a,r),this):(document.querySelectorAll(t).forEach((t=>t.addEventListener(e,a,r))),this)}onClick(e,t){return this.on("click",e,t)}onKeyUp(e,t){return this.on("keyup",e,t)}onEnter(e,t){return this.onKeyUp(e,(e=>13===e.keyCode&&t(e))),this}all(e,t){return document.querySelectorAll(e).forEach(t),this}hideElement(e){return this.element(e).style.display="none",this}showElement(e,t="block"){return this.element(e).style.display=t,this}removeClass(e,t){return this.element(e).classList.remove(...Array.from(arguments).slice(1)),this}addClass(e,t){return this.element(e).classList.add(...Array.from(arguments).slice(1)),this}debounce(e,...t){return this.debounce_||(this.debounce_=Salla.helpers.debounce(((e,...t)=>e(...t)),500)),this.debounce_(e,...t)}},n.default.infiniteScroll=new class extends g{constructor(e,t){super(e,t),this.options={path:".infinite-scroll-btn",history:"push",status:".infinite-scroll-status",append:".list-block"},this.fetchOptions={headers:{"S-INFINITE-SCROLL":!0}},this.instances=[]}initiate(e,t,a){a=this.getCustomOptions(t,a);let r="string"!=typeof e?e:document.querySelector(e),s=a.path;if(!r||!s||"string"==typeof s&&!document.querySelector(s))return void Salla.logger.warn(r?"Path Option (a link that has next page link) Not Existed!":"Container For InfiniteScroll not Existed!");let i=new l.default(r,a);return i.on("scrollThreshold",Salla.infiniteScroll.event.scrollThreshold),i.on("request",Salla.infiniteScroll.event.request),i.on("load",Salla.infiniteScroll.event.load),i.on("append",Salla.infiniteScroll.event.append),i.on("error",Salla.infiniteScroll.event.error),i.on("last",Salla.infiniteScroll.event.last),i.on("history",Salla.infiniteScroll.event.history),this.instances.push(i),i}getCustomOptions(e,t){return(t="object"==typeof e&&e||t||this.options).fetchOptions=this.fetchOptions,t.path=t.path||this.options.path,t.button=t.button||t.path,t.status=t.status||this.options.status,t.hasOwnProperty("history")||(t.history=this.options.history),t.nextPage=t.nextPage||t.next_page,t.append="string"==typeof e&&e||t.append||this.options.append,t}}(void 0,salla.event.infiniteScroll),n.default.api=new class extends class{constructor(){salla.event.on("twilight::initiated",(()=>this.initiateRequest())),salla.event.on("profile::info.fetched",(e=>this.setCurrencyAndLanguage(e))),salla.event.on("auth::token.fetched",(e=>{salla.storage.set("token",e),this.setToken(e),salla.cart.api.reset()})),this.notifier_handler_disabled=!1,this.axios=d.default.create({headers:{common:{"X-Requested-With":"XMLHttpRequest","S-SOURCE":"twilight","S-APP-VERSION":"v2.0.0","S-APP-OS":"browser"}}})}getHeaders(){return this.axios.defaults.headers.common}setHeaders(e){return Object.entries(e).forEach((e=>this.setHeader(e[0],e[1]))),this}setHeader(e,t){return salla.infiniteScroll.fetchOptions.headers[e]=this.axios.defaults.headers.common[e]=t,this}async withoutNotifier(e){return this.notifier_handler_disabled=!0,await e().finally((()=>{this.notifier_handler_disabled=!1}))}initiateRequest(){this.axios.defaults.baseURL=Salla.config.get("store.api",Salla.config.get("store.url")),this.setHeaders({"Store-Identifier":Salla.config.get("store.id"),currency:Salla.config.get("user.currency_code","SAR"),"accept-language":salla.lang.getLocale(),"s-user-id":Salla.config.get("user.id")});let e=salla.storage.get("scope");e&&this.setHeaders({"s-scope-type":e.type,"s-scope-id":e.id}),this.injectTokenToTheRequests()}injectTokenToTheRequests(){let e=salla.storage.get("token"),t=Salla.config.isGuest(),a=salla.storage.get("cart");if(a&&(a.user_id!==Salla.config.get("user.id")||a.store_id!==Salla.config.get("store.id")))return salla.log("Auth:: The cart is not belong to current "+(a.user_id!==Salla.config.get("user.id")?"user":"store")+"!"),void salla.cart.api.reset();if(t&&!e)return;if(t&&e)return salla.log("Auth:: Token without user!"),salla.storage.remove("token"),void salla.cart.api.reset();if(!e)return salla.cart.api.reset(),void salla.auth.api.refresh();let r=c.default(e);return Date.now()/1e3>r.exp?(salla.log("Auth:: An expired token!"),salla.storage.remove("token"),salla.cart.api.reset(),void salla.auth.api.refresh()):r.sub!==Salla.config.get("user.id")?(salla.log("Auth:: The user id is not match the token details!"),salla.storage.remove("token"),salla.cart.api.reset(),void salla.auth.api.refresh()):void this.setToken(e)}setToken(e){return this.setHeader("Authorization","Bearer "+e)}setCurrencyAndLanguage(e){return this.setHeaders({currency:e.data.currency,"accept-language":e.data.language})}request(e,t,a="get",r={}){let s={endPoint:e,payload:t,method:a,options:r},i="undefined"!=typeof event?event.currentTarget:null,n=!1;return"SALLA-BUTTON"===i?.tagName&&(n=!0),n&&i?.load(),this.axios[s.method](s.endPoint,s.payload,s.options).then((e=>(n&&i?.stop(),e.data&&e.request&&(e=e.data),this.handleAfterResponseActions(e),e))).catch((e=>{throw n&&i?.stop(),salla.event.document.requestFailed(s,e),this.handleErrorResponse(e),e}))}handleAfterResponseActions(e){if(!e)return;let{data:t,googleTags:a=null}=e,r=t&&t.googleTags?t.googleTags:a;dataLayer&&r&&dataLayer.push(r),this.fireEventsForResponse(e),this.showAlert(e),this.renderSections(e)}fireEventsForResponse(e){let t=e?.events||e.data?.events||e.error?.events;"string"==typeof t&&(t=JSON.parse(t)),t&&Object.keys(t).forEach((e=>salla.event.dispatch(e,t[e])))}handleErrorResponse(e){if(e.response&&e.response.data)return e.response.data.error&&e.response.data.error.fields&&!this.notifier_handler_disabled?this.handleInvalidFields(e):this.handleAfterResponseActions(e.response.data)}showAlert(e){if(e&&!this.notifier_handler_disabled)return e.case&&e.msg?salla.notify.fire(e.msg,e.case,e):e.hasOwnProperty("success")&&e.data?.message?salla.notify.fire(e.data?.message,e.success?salla.notify.types.success:salla.notify.types.error,e):e.error&&e.error.message&&"FORBIDDEN"!==e.error.message?salla.error(e.error.message,e):void 0}handleInvalidFields(e){let t=e.response.data.error.fields,a=[];Object.keys(t).forEach((e=>{let r=t[e];Array.isArray(r)?r.forEach((e=>a.push(e))):a.push(r)}));let r=(a.length>1?"* ":"")+a.join("\n* ");salla.error(r,e)}isFastRequestsAllowed(){return Salla.config.get("fastRequests")}promise(e,t=!0){return new Promise(((a,r)=>t?a(e):r(e)))}errorPromise(e){return this.promise(e,!1)}successPromise(e){return this.promise(e,!0)}renderSections(e){e.sections&&Object.keys(e.sections).forEach((t=>{document.querySelectorAll(t.toSelector()).forEach((function(a){a.innerHTML=e.sections[t]}))}))}}{constructor(){super(),this.auth=new F,this.cart=new b,this.loyalty=new S,this.order=new _,this.rating=new P,this.product=new A,this.profile=new E,this.comment=new q,this.currency=new x,this.document=new C,this.wishlist=new T,this.scope=new k}},n.default.cart=new g(n.default.api.cart,n.default.event.cart),n.default.auth=new g(n.default.api.auth,n.default.event.auth),n.default.order=new g(n.default.api.order,n.default.event.order),n.default.scope=new g(n.default.api.scope,n.default.event.scope),n.default.rating=new g(n.default.api.rating,n.default.event.rating),n.default.comment=new g(n.default.api.comment,n.default.event.comment),n.default.loyalty=new g(n.default.api.loyalty,n.default.event.loyalty),n.default.product=new g(n.default.api.product,n.default.event.product),n.default.profile=new g(n.default.api.profile,n.default.event.profile),n.default.currency=new g(n.default.api.currency,n.default.event.currency),n.default.document=new g(n.default.api.document,n.default.event.document),n.default.wishlist=new g(n.default.api.wishlist,n.default.event.wishlist),n.default.call=e=>{let t=n.default,a=e.split(".");for(;a.length&&(t=t[a.shift()]););return t},n.default.init=e=>new D(e),salla.event.once("twilight::init",salla.init),n.default.success=n.default.notify.success,n.default.error=n.default.notify.error,n.default.versions.twilight="[VI]{version}[/VI]",n.default.event.dispatch("twilight::ready"),n.default.onInitiated=e=>salla.event.once("twilight::initiated",e),n.default.onReady=n.default.onInitiated,Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return n.default}});
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Salla$1 = require('@salla.sa/base');
+var TheInfiniteScroll = require('infinite-scroll');
+var Lang = require('lang.js');
+var axios = require('axios');
+var jwtDecode = require('jwt-decode');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var Salla__default = /*#__PURE__*/_interopDefaultLegacy(Salla$1);
+var TheInfiniteScroll__default = /*#__PURE__*/_interopDefaultLegacy(TheInfiniteScroll);
+var Lang__default = /*#__PURE__*/_interopDefaultLegacy(Lang);
+var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
+var jwtDecode__default = /*#__PURE__*/_interopDefaultLegacy(jwtDecode);
+
+let notifier = function (message, type, data) {
+  return alert(message);
+};
+
+let setNotifier = function (callback) {
+  notifier = callback;
+};
+
+let fire = function (message, type, data) {
+  return notifier(message, type, data);
+};
+
+let error = function (message, data) {
+  return notifier(message, types.error, data);
+};
+
+let info = function (message, data) {
+  return notifier(message, types.info, data);
+};
+
+let success = function (message, data) {
+  return notifier(message, types.success, data);
+};
+
+let sallaInitiated = function () {
+  /**
+   * In salla sometimes, visitor redirected with danger url query,
+   * Here we get the error message then show it with salla error notifier
+   * 💡 we can use "(?<=[\?\&]danger=)[^&]+" to get message only, but it's not working in safari,
+   * so just use normal regex, then replace "danger=".
+   *
+   * TODO:: pass the error message via config
+   */
+  let results = window.location.href.match(/([\?\&]danger=)[^&]+/g);
+
+  if (!results) {
+    return;
+  }
+
+  results.forEach(message => {
+    error(decodeURI(message.replace('?danger=', '').replace('&danger=', '')));
+  });
+};
+/**
+ * in case there is need to map types, it's possible from here;
+ * @type {{success: string, error: string, info: string}}
+ */
+
+
+let types = {
+  error: "error",
+  success: "success",
+  info: "info"
+};
+var Notify = {
+  fire,
+  setNotifier,
+  error,
+  success,
+  info,
+  sallaInitiated,
+  types
+};
+
+/**
+ * This Class Is helper to allow us using events & apis like:
+ * Salla.api.cart => Salla.cart.api
+ * Salla.event.cart => Salla.cart.event
+ *
+ * or even:
+ * Salla.cart.api.addItem() => salla.cart.addItem() 😎
+ *
+ * @property {BaseApi} api
+ * @property {BaseEvent} event
+ **/
+class Module {
+  /**
+   * @param {TwilightApi|BaseApi|any} api
+   * @param {BaseEvent} event
+   * @return {Module}
+   */
+  constructor(api, event) {
+    this.api = api;
+    this.event = event;
+    return new Proxy(this, {
+      get: function get(target, name) {
+        // when calling `salla.cart.event` return `CartEvent` class
+        if (name === 'event') {
+          return event;
+        } // when calling `salla.cart.api` return `CartApi` class
+
+
+        if (name === 'api') {
+          return api;
+        } // useful in infiniteScrollClass, because it's without apiClass
+
+
+        if (!api) {
+          return target[name];
+        }
+
+        return api[name] || target[name];
+      }
+    });
+  }
+
+}
+
+// todo:: cover these helpers into types
+String.prototype.toStudlyCase = function () {
+  return this.trim() //remove first spaces
+  .replace(/([^a-zA-Z\d].)/g, function (t) {
+    //get
+    return t.toUpperCase().replace(/[^a-zA-Z\d]/g, '');
+  });
+};
+
+String.prototype.toDatasetName = function () {
+  return this.startsWith('data-') ? this.substr(5).toStudlyCase() : this.toStudlyCase();
+}; // helper method to get string as selector, by adding (#) to the beginning if it's not start with one.
+
+
+String.prototype.toSelector = function () {
+  // todo:: add html tags if it's needed.
+  return this.trim().startsWith(".") || this.trim().startsWith("#") ? this : "#" + this;
+};
+
+String.prototype.replaceArray = function (find, replace) {
+  var replaceString = this;
+  var regex;
+
+  for (var i = 0; i < find.length; i++) {
+    regex = new RegExp(find[i], "g");
+    replaceString = replaceString.replace(regex, replace[i]);
+  }
+
+  return replaceString;
+};
+
+String.prototype.rtrim = function (s) {
+  if (s === undefined) s = '\\s';
+  return this.replace(new RegExp("[" + s + "]*$"), '');
+};
+
+String.prototype.ltrim = function (s) {
+  if (s === undefined) s = '\\s';
+  return this.replace(new RegExp("^[" + s + "]*"), '');
+};
+
+String.prototype.digitsOnly = function () {
+  return Salla.helpers.digitsOnly(this);
+};
+
+// todo:: cover these helpers into types
+// support element.closest in IE
+if (!Element.prototype.matches) Element.prototype.matches = Element.prototype.msMatchesSelector;
+if (!Element.prototype.closest) Element.prototype.closest = function (selector) {
+  var el = this;
+
+  while (el) {
+    if (el.matches(selector)) {
+      return el;
+    }
+
+    el = el.parentElement;
+  }
+};
+/**
+ * In case we want to get data by attribute, lets say for example attribute "data-cart-delete"
+ * we will try to get data for this element, by these ways:
+ * 1- <a data-on-click="cart-delete-item" data-form="12324">x</a>
+ * 2- <a data-on-click="cart-delete-item" data-form='{"id":12324}'>x</a>
+ * 3- <a data-on-click="cart-delete-item" data-id="12324">x</a>
+ * 4- <form><input type="id" name="id"><a data-on-click="cart-delete-item">x</a></form>
+ * 5- <script>var item_id=12324;</script><a data-on-click="cart-delete-item" data-form="item_id">x</a>
+ * 6- <script>function get_item_id(){return 12324;}</script><a data-on-click="cart-delete-item" data-form="get_item_id">x</a>
+ * 7- <div salla-form-data><input type="hidden" name="item_id" value="12324"><a data-on-click="cart-delete-item">x</a></div>
+ */
+
+Element.prototype.getElementSallaData = function (attributeName, ...restData) {
+  // trying to call it for non-htmlElement object
+  if (!this.getAttribute) {
+    return;
+  } //try to get json
+
+
+  if (this.hasAttribute('data-json')) {
+    try {
+      return JSON.parse(this.getAttribute('data-json'));
+    } catch (e) {}
+  }
+
+  let funName = this.getAttribute('data-function'); //if there function name existed and it's existed window Dom, or try to get data from parent form, or return dataset.
+
+  if (funName && window[funName]) {
+    //is data existed as function in window
+    if (typeof window[funName] == 'function') {
+      //call function via call to pass element, will be accessible in function by "this".
+      return this.getFilteredData(window[funName].call(this, ...restData));
+    } //if data existed in window Dom, return it.
+
+
+    return this.getFilteredData(window[funName]);
+  }
+
+  let formData = this.hasAttribute('data-form-selector') ? document.querySelector(this.dataset.formSelector) : undefined;
+
+  if (this.tagName === 'FORM') {
+    formData = this;
+  } else {
+    // try to get parent form div, or just use this element as the parent, to get it's children inputes;
+    formData = formData || this.closest('form') || this.closest('[salla-form-data]') || this;
+  }
+
+  if (formData && formData.tagName === 'FORM') {
+    return this.getFilteredData(new FormData(formData), null, formData);
+  } //try to get children inputs;
+
+
+  let inputs = formData.querySelectorAll("[name]");
+
+  if (!inputs.length) {
+    return this.getFilteredData();
+  } //to get normal object instead of DOMStringMap
+
+
+  let dataset = Object.assign({}, this.dataset);
+  inputs.forEach(input => {
+    //if it's not selected ignore it
+    if (['checkbox', 'radio'].includes(input.type) && !input.checked) {
+      return;
+    }
+
+    try {
+      //TODO:: Check multiple select how it will be.
+      let inputValueWithName = Salla.helpers.inputData(input.name, input.value, dataset);
+      dataset[inputValueWithName.name] = inputValueWithName.value;
+    } catch (e) {
+      Salla.log(input.name + ' can\'t be send');
+    }
+  });
+  return this.getFilteredData(dataset);
+};
+/**
+ * Salla Connects Api Actions By Hooks, it handle dynamic connect suitable events:
+ * @example '<button type="submit" data-on-click="auth-login" data-form="...">add</button>'
+ *
+ * @param {Event} event
+ * @return {boolean|string}
+ */
+
+
+Element.prototype.canEventFireHook = function (event) {
+  return this.hasAttribute ? this.hasAttribute(Salla.api.hooksPrefix + event.type) : false;
+};
+/**
+ * @param {string} startsWith
+ * @param {boolean|undefined} returnAttribute
+ * @return {boolean|string}
+ */
+
+
+Element.prototype.hasAttributeStartsWith = function (startsWith, returnAttribute) {
+  //to avoid any change in letters cases
+  startsWith = startsWith.toLowerCase();
+
+  for (var i = 0; i < this.attributes.length; i++) {
+    let name = this.attributes[i].name.toLowerCase();
+
+    if (name.indexOf(startsWith) === 0) {
+      return returnAttribute ? name : true;
+    }
+  }
+
+  return false;
+};
+
+HTMLFormElement.prototype.getAjaxFormData = function (event) {
+  //laravel.errors.clearValidation(event.target);
+  //laravel.ajax.disabledSubmitButton(event.target);
+  // get the input field with type="file"
+  var files = this.querySelectorAll('input[type="file"]'); //add the "disabled" attribute to the input
+
+  files.forEach(file => {
+    if (!file.files.length) {
+      file.setAttribute('disabled', "");
+    }
+  });
+  var formData = new FormData(this); // remove the "disabled" attribute
+
+  files.forEach(file => {
+    if (!file.files.length) {
+      file.removeAttribute('disabled');
+    }
+  });
+  return {
+    formData: this.getFilteredData(formData, event),
+    url: this.getAttribute('action'),
+    method: this.getAttribute('method') || 'post',
+    events: {
+      success: this.dataset.onSuccess,
+      fail: this.dataset.onFail
+    }
+  };
+};
+/**
+ * Fire The Function That Passed To Ajax <a> or <form>, with data attribute, Ex.
+ * <a class="ajax" href="..." data-filter-before-send="myFunctionName">...</a>
+ * it will pass (formData, object, event) to the function.
+ * @param {Object|null} event
+ * @param {Object|null} formData
+ * @param {HTMLElement|null} element
+ */
+
+
+Element.prototype.getFilteredData = function (formData = null, event = null, element = null) {
+  formData = formData || element?.dataset || this.dataset; //when get data from selector we may need current value too, ex: <input name=quantity data-from-selector=".form">
+  // we need quantity value + data from selector
+
+  if (element && this.name && this.value !== undefined) {
+    formData = injectValueToFromData(formData, this.name, this.value);
+  }
+
+  ['filterBeforeSubmit', 'filterBeforeSend'].forEach(propertyName => {
+    let functionName = element?.dataset[propertyName] || this.dataset[propertyName];
+
+    if (functionName) {
+      var callback_form = window[functionName];
+
+      if (typeof callback_form === 'function') {
+        let filteredData = callback_form(formData, element || this, event);
+
+        if (!filteredData && formData) {
+          throw `Data failed to be pass verify function window.${functionName}(formData, element, event)!`;
+        }
+
+        return callback_form(formData, element || this, event);
+      }
+
+      Salla.log('window.' + functionName + '() not found!');
+    }
+  });
+  return formData;
+};
+
+HTMLAnchorElement.prototype.getAjaxFormData = function (event) {
+  return {
+    formData: this.getFilteredData(null, event),
+    url: this.getAttribute('href'),
+    method: this.dataset.type || 'get',
+    events: {
+      success: this.dataset.onSuccess,
+      fail: this.dataset.onFail
+    }
+  };
+};
+/**
+ *
+ * @param {object|FormData} formData
+ * @param key
+ * @param value
+ * @return {*}
+ */
+
+
+function injectValueToFromData(formData, key, value) {
+  if (formData instanceof FormData) {
+    formData.append(key, value);
+  } else {
+    formData[key] = value;
+  }
+
+  return formData;
+}
+
+/**
+ * @property {Emitter} parent
+ * @property {array} events
+ * @property {string} namespace
+ */
+class BaseEvent {
+  constructor() {
+    this.events = {};
+    this.namespace = '';
+    let results = /function (.{1,})\(/.exec(this.constructor.toString());
+    this.className = (results && results.length > 1 ? results[1] : "").toLowerCase();
+  }
+  /**
+   * should be called from child class, after preparing data, to initiate things.
+   */
+
+
+  after_init() {
+    this.createDynamicFunctions();
+  }
+
+  createDynamicFunctions() {
+    Object.keys(this.events).forEach(eventName => {
+      this.createDynamicEventFuns(eventName);
+      this.createDynamicListenerFuns(eventName);
+    });
+  }
+  /**
+   * instead of hardcode all events, we can do that here
+   * for example we have in cart class about 7 events
+   * instead of writing something like:
+   * @example
+   * itemAdded(response, item_id) {
+   *      return this.dispatch('itemAdded', response, item_id);
+   * }
+   * for each event, we will do that dynamically here,
+   * if there is need for special handling, we can just hardcode it & it will not overriden
+   * @param {string} eventName
+   */
+
+
+  createDynamicEventFuns(eventName) {
+    // if it's already exist don't override it.
+    if (this[eventName]) {
+      return;
+    }
+
+    let thatEvent = this;
+
+    this[eventName] = function (...response) {
+      return thatEvent.dispatch(eventName, ...response);
+    };
+  }
+  /**
+   * instead of hardcode all eventsListeners, we can do that here
+   * for example we have in cart class about 7 events
+   * instead of writing some thing like:
+   * @example
+   * onItemAdded(callback) {
+   *      return this.on('itemAdded', callback);
+   * }
+   * for each event, we will do that dynamically here,
+   * if there is need for special handling, we can just hardcode it & it will not overriden
+   * @param {string} eventName
+   */
+
+
+  createDynamicListenerFuns(eventName) {
+    //will be something like 'onItemAdded'
+    let listenerName = 'on' + eventName.charAt(0).toUpperCase() + eventName.slice(1);
+
+    if (this[listenerName]) {
+      return;
+    }
+
+    let thatEvent = this;
+
+    this[listenerName] = function (callback) {
+      return thatEvent.on(eventName, callback);
+    };
+  }
+  /**
+   * get event name by adding namespace, or saved events;
+   *
+   * @param {string} eventName
+   * @return {string}
+   */
+
+
+  getEventName(eventName) {
+    eventName = this.events[eventName] || eventName; //if there is no namespace or eventName has namespace, return event as is.
+
+    if (!this.namespace || eventName.includes('::')) {
+      return eventName;
+    } //will be something like "cart::"
+
+
+    return this.namespace + Salla.event.delimiter + eventName;
+  }
+  /**
+   * @param eventName
+   * @param {...*} passData
+   */
+
+
+  dispatch(eventName, ...passData) {
+    return Salla.event.dispatch(this.getEventName(eventName), ...passData);
+  }
+  /**
+   * @param {string} eventName
+   * @param {function} callback
+   */
+
+
+  on(eventName, callback) {
+    return Salla.event.addListener(this.getEventName(eventName), callback);
+  }
+  /**
+   * @param {string} eventName
+   * @param {function} callback
+   */
+
+
+  once(eventName, callback) {
+    return Salla.event.once(this.getEventName(eventName), callback);
+  }
+
+}
+
+class AuthEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'auth';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "auth::" will be added dynamically.
+     * all events will be initiated to have three functions, for ex: event "login" wil be:
+     * 🔸 name: auth::login
+     * 🔸 fire: Salla.auth.event.login(...data)
+     * 🔸 listen: Salla.auth.event.onLogin((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('auth::login',...data)
+     * 🔸 listenWithName: Salla.event.on('auth::login',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      // prepared event use it like "Salla.auth.event.login()" or "Salla.auth.event.onLogin(func...)"
+      login: "login",
+      logout: "logout",
+      // events connected With auth api, also can be used separately standalone.
+      codeSent: "code.sent",
+      codeNotSent: "code.not-sent",
+      verified: "verified",
+      verificationFailed: "verification.failed",
+      loggedIn: "logged.in",
+      registered: "registered",
+      registrationFailed: "registration.failed",
+      loggedOut: "logged.out",
+      failedLogout: "failed.logout",
+      refreshFailed: "refresh.failed",
+      tokenFetched: "token.fetched"
+    };
+    this.after_init();
+  }
+
+  login(detail) {
+    //todo:: remove this workaround
+    if (!detail) {
+      this.next_event = null;
+      return this.dispatch('login', ...arguments);
+    }
+
+    if (detail.type) {
+      this.setTypeActionOnVerified(detail.type);
+    }
+
+    this.next_event = detail.next_event || null;
+    return this.dispatch('login', ...arguments);
+  }
+  /**
+   * @param {AuthResponse.verify} response
+   * @return {*}
+   */
+
+
+  loggedIn(response) {
+    Salla.profile.info().then(response => {
+      salla.config.set('user', {
+        id: response.data.id,
+        type: 'user',
+        email: response.data.email,
+        mobile: response.data.phone.code + response.data.phone.number,
+        country_code: response.data.phone.country,
+        language_code: response.data.language,
+        currency_code: response.data.currency
+      });
+    }).finally(() => this.dispatch('loggedIn', response));
+  }
+
+  setTypeActionOnVerified(type) {
+    this.type_action_on_verified = type;
+  }
+
+  getTypeActionOnVerified() {
+    return this.type_action_on_verified || 'redirect';
+  }
+
+}
+
+class CartEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'cart';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace 'cart::' will be added dynamically
+     * all events will be initiated to have three functions, for ex: event "itemAdded" wil be:
+     * 🔸 name: cart::item-added
+     * 🔸 fire: Salla.cart.event.itemAdded(...data)
+     * 🔸 listen: Salla.cart.event.onItemAdded((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('cart::item-added',...data)
+     * 🔸 listenWithName: Salla.event.on('cart::item-added',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      latestFetched: 'latest.fetched',
+      latestFailed: 'latest.failed',
+      updated: 'updated',
+      itemUpdated: 'item.updated',
+      itemUpdatedFailed: 'item.updated.failed',
+      itemAdded: 'item.added',
+      itemAddedFailed: 'item.added.failed',
+      itemDeleted: 'item.deleted',
+      itemDeletedFailed: 'item.deleted.failed',
+      submitted: 'submitted',
+      submitFailed: 'submit.failed',
+      imageDeleted: 'image.deleted',
+      imageNotDeleted: 'image.not.deleted',
+      detailsFetched: 'details.fetched',
+      detailsNotFetched: 'details.not.fetched',
+      successReset: 'success.reset',
+      //coupons
+      couponAdded: 'coupon.added',
+      couponDeleted: 'coupon.deleted',
+      couponAdditionFailed: 'coupon.addition.failed',
+      couponDeletionFailed: 'coupon.deletion.failed'
+    };
+    this.after_init();
+  }
+  /** ============ Events ============ **/
+
+  /**
+   *
+   * @param {CartUpdatedData|Object} data
+   * @return {*}
+   */
+
+
+  updated(data) {
+    //because we are working on api & web when updating cart via api, we need from web to get fresh summary
+    Salla.cookie.set('fresh_summary', 1);
+
+    if (!data || typeof data !== 'object') {
+      Salla.logger.info('Cart summary not an object!', data);
+      return this.dispatch('updated');
+    }
+
+    if (data.offer) {
+      salla.product.event.offerExisted(data.offer);
+    } //we can store (carSummary) as is, but it may store too much data, or different format
+
+
+    salla.storage.set('cart.summary', {
+      total: data.cart.total,
+      sub_total: data.cart.sub_total,
+      discount: data.cart.discount,
+      real_shipping_cost: data.cart.real_shipping_cost,
+      count: data.cart.count,
+      shipping_cost: data.cart.free_shipping_bar?.has_free_shipping ? 0 : data.cart.real_shipping_cost
+    });
+    return this.dispatch('updated', data.cart);
+  }
+  /**
+   * @param {CartResponse.update} response
+   * @return {*}
+   */
+
+
+  latestFetched(response) {
+    this.updated(response.data);
+    return this.dispatch('latestFetched', response);
+  }
+  /**
+   * @param {CartResponse.update} response
+   * @param item_id
+   * @return {*}
+   */
+
+
+  itemAdded(response, item_id) {
+    this.updated(response.data);
+    return this.dispatch('itemAdded', response, item_id);
+  }
+  /**
+   * @param {CartResponse.update} response
+   * @param item_id
+   * @return {*}
+   */
+
+
+  itemDeleted(response, item_id) {
+    this.updated(response.data);
+    return this.dispatch('itemDeleted', response, item_id);
+  }
+  /**
+   * @param {CartResponse.update} response
+   * @param {number} item_id
+   * @return {*}
+   */
+
+
+  itemUpdated(response, item_id) {
+    this.updated(response.data);
+    return this.dispatch('itemUpdated', response, item_id);
+  } //Coupons
+
+  /**
+   * @param {CartResponse.update} response
+   * @param {number} cart_id
+   * @return {*}
+   */
+
+
+  couponAdded(response, cart_id) {
+    this.updated(response.data);
+    return this.dispatch('couponAdded', response, cart_id);
+  }
+  /**
+   * @param {CartResponse.update} response
+   * @param {number} cart_id
+   * @return {*}
+   */
+
+
+  couponDeleted(response, cart_id) {
+    this.updated(response.data);
+    return this.dispatch('couponDeleted', response, cart_id);
+  }
+
+}
+
+class OrderEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'order';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "order::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "canceled" wil be:
+     * 🔸 name: order::canceled
+     * 🔸 fire: Salla.order.event.canceled(...data)
+     * 🔸 listen: Salla.order.event.onCanceled((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('order::canceled',...data)
+     * 🔸 listenWithName: Salla.event.on('order::canceled',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      canceled: "canceled",
+      notCanceled: "not.canceled",
+      orderCreated: "order.created",
+      orderCreationFailed: "order.creation.failed",
+      invoiceSent: "invoice.sent",
+      invoiceNotSent: "invoice.not.sent"
+    };
+    this.after_init();
+  }
+
+}
+
+class ScopeEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'scope';
+    this.events = {
+      fetched: 'fetched',
+      notFetched: 'not.fetched',
+      productAvailabilityFetched: 'product-availability.fetched',
+      productAvailabilityNotFetched: 'product-availability.not.fetched',
+      changeSucceeded: 'changed',
+      changeFailed: 'not.changed'
+    };
+    this.after_init();
+  }
+
+}
+
+class RatingEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'rating';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,storeRated:store.rated,...}',
+     * it can be override by creating method like:
+     *      storeRated(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('storeRated', ...arguments);
+     *      }
+     * 💡 namespace "rating::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "storeRated" wil be:
+     * 🔸 name: rating::store-rated
+     * 🔸 fire: Salla.rating.event.storeRated(...data)
+     * 🔸 listen: Salla.rating.event.onStoreRated((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('rating::store-rated',...data)
+     * 🔸 listenWithName: Salla.event.on('rating::store-rated',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      orderNotFetched: "order.not.fetched",
+      orderFetched: "order.fetched",
+      storeRated: "store.rated",
+      storeFailed: "store.failed",
+      productsRated: "products.rated",
+      productsFailed: "products.failed",
+      shippingRated: "shipping.rated",
+      shippingFailed: "shipping.failed"
+    };
+    this.after_init();
+  }
+
+}
+
+class CommentEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'comment';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "comment::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "added" wil be:
+     * 🔸 name: comment::added
+     * 🔸 fire: Salla.comment.event.added(...data)
+     * 🔸 listen: Salla.comment.event.onAdded((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('comment::added',...data)
+     * 🔸 listenWithName: Salla.event.on('comment::added',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      added: "added",
+      additionFailed: "addition.failed"
+    };
+    this.after_init();
+  }
+
+}
+
+class LoyaltyEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'loyalty';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace 'loyalty::' will be added dynamically,
+     * so last result will be something like: 'loyalty::item-added'
+     */
+
+    this.events = {
+      exchangeSucceeded: 'exchange.succeeded',
+      exchangeFailed: 'exchange.failed',
+      programFetched: 'program.fetched',
+      programNotFetched: 'program.not.fetched',
+      resetSucceeded: 'exchange-reset.succeeded',
+      resetFailed: 'exchange-reset.failed'
+    };
+    this.after_init();
+  }
+
+}
+
+class ProfileEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'profile';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "profile::" will be updated dynamically,
+     * all events will be initiated to have three functions, for ex: event "updated" wil be:
+     * 🔸 name: profile::updated
+     * 🔸 fire: Salla.profile.event.updated(...data)
+     * 🔸 listen: Salla.profile.event.onAdded((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('profile::updated',...data)
+     */
+
+    this.events = {
+      updated: "updated",
+      updateFailed: "update.failed",
+      verificationCodeSent: "verification.code.sent",
+      updateContactsFailed: "update.contacts.failed",
+      verified: "verified",
+      unverified: "unverified",
+      infoFetched: 'info.fetched',
+      infoNotFetched: 'info.not.fetched'
+    };
+    this.after_init();
+  }
+
+}
+
+class ProductEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'product';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "product::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "priceUpdated" wil be:
+     * 🔸 name: product::price.updated
+     * 🔸 fire: Salla.product.event.priceUpdated(...data)
+     * 🔸 listen: Salla.product.event.onPriceUpdated((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('product::price.updated',...data)
+     * 🔸 listenWithName: salla.event.on('product::price.updated',(...data)=>salla.log(data))
+     */
+
+    this.events = {
+      priceUpdated: 'price.updated',
+      priceUpdateFailed: 'price.updated.failed',
+      availabilitySubscribed: 'availability.subscribed',
+      availabilitySubscribeFailed: 'availability.subscribe.failed',
+      categoriesFetched: 'categories.fetched',
+      categoriesFailed: 'categories.failed',
+      searchFailed: 'search.failed',
+      searchResults: 'search.results',
+      offerExisted: 'offer.existed',
+      fetchOffersFailed: 'fetch.offers.failed',
+      offersFetched: 'offers.fetched',
+      sizeGuideFetched: "size-guide.fetched",
+      SizeGuideFetchFailed: "size-guide.failed",
+      giftFetched: "gift.fetched",
+      giftFetchFailed: "gift.failed",
+      addGiftToCartSucceeded: "gift.add-to-cart.succeeded",
+      addGiftToCartFailed: "gift.add-to-cart.failed",
+      giftImageUploadSucceeded: "gift.image-upload.succeeded",
+      giftImageUploadFailed: "gift.image-upload.failed"
+    };
+    this.after_init();
+  }
+
+}
+
+class DocumentEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'document';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "document::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "click" wil be:
+     * 🔸 name: document::click
+     * 🔸 fire: Salla.document.event.click(...data)
+     * 🔸 listen: Salla.document.event.onClick((...data) => salla.log(data))
+     * 🔸 fireWithName: salla.event.emit('document::click',...data)
+     * 🔸 listenWithName: salla.event.on('document::click',(...data)=>salla.log(data))
+     */
+
+    this.events = {
+      click: "click",
+      change: "change",
+      submit: "submit",
+      keyup: "keyup",
+      leaving: "leaving",
+      request: "request",
+      requestFailed: "request.failed"
+    };
+    this.after_init();
+  }
+  /**
+   * @param {string|function} selector
+   * @param {function|undefined} callback
+   */
+
+
+  onClick(selector, callback) {
+    this.fireCallableFuns('click', selector, callback);
+  }
+  /**
+   * @param {string|function} selector
+   * @param {function|undefined} callback
+   */
+
+
+  onChange(selector, callback) {
+    this.fireCallableFuns('change', selector, callback);
+  }
+  /**
+   * @param {string|function} selector
+   * @param {function|undefined} callback
+   */
+
+
+  onSubmit(selector, callback) {
+    this.fireCallableFuns('submit', selector, callback);
+  }
+  /**
+   * @param {string|function} selector
+   * @param {function|undefined} callback
+   */
+
+
+  onKeyup(selector, callback) {
+    this.fireCallableFuns('keyup', selector, callback);
+  }
+  /**
+   * Alternative For
+   * @example: $(document).on("click","#test-element",function(event){})
+   *
+   * in case selector passed as function, will work as shorthand for
+   * @example: document.addEventListener("clcik", function(event){});
+   *
+   * @param {string} eventName = [click, keyup, submit, change]
+   * @param {string|function} selector
+   * @param {function|undefined} callback
+   */
+
+
+  fireCallableFuns(eventName, selector, callback) {
+    this.on(eventName, event => {
+      if (typeof selector == 'function') {
+        selector(event);
+        return;
+      }
+
+      if (typeof callback == 'function' && event.target.matches(selector)) {
+        callback(event);
+      }
+    });
+  }
+  /**
+   * Helper method to fake firing event on element, for example, we have listener:
+   * @example
+   *      element.addEventListener("countrychange",()=>{...});
+   * we want to fire this event programmatically, we can do that by:
+   * @example
+   *      salla.document.event.fireEvent(element, 'countrychange', optionalDataPassedThrowEvent)
+   * @param {string|HTMLElement} element
+   * @param {string} eventName
+   * @param {Object|undefined} details
+   * @return {boolean}
+   */
+
+
+  fireEvent(element, eventName, ...details) {
+    return this.fireEventForElements(element, eventName, false, ...details);
+  }
+  /**
+   * Helper method to fake firing event on multi elements, for example, we have listener:
+   * @example
+   * ...('.intl-input').forEach(element=> element.addEventListener("countrychange",()=>{...}));
+   * we want to fire this event programmatically, we can do that by:
+   * @example
+   *      salla.document.event.fireEventForAll('.intl-input', 'countrychange', optionalDataPassedThrowEvent)
+   * @param {string} elementSelector
+   * @param {string} eventName
+   * @param {Object|undefined} details
+   * @return {boolean}
+   */
+
+
+  fireEventForAll(elementSelector, eventName, ...details) {
+    return this.fireEventForElements(elementSelector, eventName, true, ...details);
+  }
+  /**
+   *
+   * @param {string|HTMLElement} element
+   * @param {string} eventName
+   * @param {boolean} isAllSelector
+   * @param {Object|undefined} details
+   * @return {boolean}
+   */
+
+
+  fireEventForElements(element, eventName, isAllSelector, ...details) {
+    //if it's srting, means it's selector, so try to get real element from the selector.
+    if (typeof element == 'string') {
+      if (isAllSelector) {
+        return document.querySelectorAll(element).forEach(element_ => {
+          return this.fireEventForElements(element_, eventName, false, ...details);
+        });
+      }
+
+      element = document.querySelector(element);
+    }
+
+    if (!element) {
+      salla.log('Failed To get element to fire event: ' + eventName);
+      return;
+    }
+
+    const event = new CustomEvent(eventName, ...details);
+    return element.dispatchEvent(event);
+  }
+
+}
+
+class WishlistEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'wishlist';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "wishlist::" will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "added" wil be:
+     * 🔸 name: wishlist::added
+     * 🔸 fire: Salla.wishlist.event.added(...data)
+     * 🔸 listen: Salla.wishlist.event.onAdded((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('wishlist::added',...data)
+     * 🔸 listenWithName: Salla.event.on('wishlist::added',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      added: "added",
+      removed: "removed",
+      additionFailed: "addition.failed",
+      removingFailed: "removing.failed"
+    };
+    this.after_init();
+  }
+
+}
+
+class CurrencyEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'currency';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace 'currency::' will be added dynamically,
+     * all events will be initiated to have three functions, for ex: event "changed" wil be:
+     * 🔸 name: currency::changed
+     * 🔸 fire: Salla.currency.event.changed(...data)
+     * 🔸 listen: Salla.currency.event.onChanged((...data) => Salla.log(data))
+     * 🔸 fireWithName: Salla.event.emit('currency::changed',...data)
+     * 🔸 listenWithName: Salla.event.on('currency::changed',(...data)=>Salla.log(data))
+     */
+
+    this.events = {
+      changed: 'changed',
+      failed: 'failed',
+      fetched: 'fetched',
+      failedToFetch: 'failed.to.fetch'
+    };
+    this.after_init();
+  }
+
+}
+
+class InfiniteScrollEvents extends BaseEvent {
+  constructor() {
+    super();
+    this.namespace = 'infiniteScroll';
+    /**
+     * 💡 Notice that you can override any event by creating method, if we have 'this.events={...,codeSent:code-sent,...}',
+     * it can be override by creating method like:
+     *      codeSent(response){
+     *          //your costume code
+     *          ....
+     *          //then call dispatch to emit other listeners
+     *          return this.dispatch('codeSent', ...arguments);
+     *      }
+     * 💡 namespace "infiniteScroll::" will be added dynamically,
+     * so last result will be something like: "infiniteScroll::loaded"
+     * also you can check:
+     * @see https://infinite-scroll.com/events.html#infinite-scroll-events
+     */
+
+    this.events = {
+      // also events can be accessed directly via:
+      // Salla.infiniteScroll.initiate(...).on('load', func);
+      scrollThreshold: 'scroll.threshold',
+      request: 'request',
+      load: 'load',
+      append: 'append',
+      error: 'error',
+      last: 'last',
+      history: 'history'
+    };
+    this.after_init();
+  }
+
+}
+
+Salla.event.auth = new AuthEvents();
+Salla.event.cart = new CartEvents();
+Salla.event.order = new OrderEvents();
+Salla.event.scope = new ScopeEvents();
+Salla.event.rating = new RatingEvents();
+Salla.event.comment = new CommentEvents();
+Salla.event.loyalty = new LoyaltyEvents();
+Salla.event.product = new ProductEvents();
+Salla.event.profile = new ProfileEvents();
+Salla.event.currency = new CurrencyEvents();
+Salla.event.document = new DocumentEvents();
+Salla.event.wishlist = new WishlistEvents();
+Salla.event.infiniteScroll = new InfiniteScrollEvents();
+/**
+ * handy way to be able to create function that will be called after salla initiated;
+ * we can add 'sallaInitiated()' method to any child in salla, or one of them chidren
+ * for example:
+ * Salla.notify.sallaInitiated()
+ * Salla.api.cart.sallaInitiated()
+ */
+
+Salla.event.on('twilight::initiated', () => {
+  Object.keys(Salla).forEach(sallaSection => {
+    sallaSection = Salla[sallaSection];
+
+    if (typeof sallaSection != 'object') {
+      return;
+    } //search main salla elements like (Salla.api, salla.notify, salla.event)
+
+
+    callSallaInitiate(sallaSection); //search children of salla elements like (salla.api.cart, salla.event.auth ..etc)
+
+    Object.keys(sallaSection).forEach(innerSallaSection => {
+      callSallaInitiate(sallaSection[innerSallaSection]);
+    });
+  });
+});
+/**
+ * make sure not to re call sallaInitiated method more than once for same class;
+ * like:
+ * salla.cart.event
+ * salla.event.cart
+ * because they are the same.
+ * @param sallaSection
+ */
+
+function callSallaInitiate(sallaSection) {
+  if (!sallaSection || !sallaSection.sallaInitiated || sallaSection.initiated) {
+    return;
+  }
+
+  sallaSection.sallaInitiated();
+  sallaSection.initiated = true;
+}
+
+/**
+ * @property {TwilightConfig|any} properties_
+ * @property {Object|{[string]:Currency,SAR:Currency}} currencies_
+ * @property {boolean} triedToGetCurrencies_
+ * @property {Language[]} languages_
+ * @property {boolean} triedToGetLanguages_
+ */
+Salla.config.default_properties = {
+  debug: typeof process !== 'undefined' && process.env.NODE_ENV === 'development',
+  token: null,
+  fastRequests: true,
+  canLeave: true,
+  store: {
+    api: "https://api.salla.dev/store/v1/"
+  },
+  currencies: {
+    SAR: {
+      "code": "SAR",
+      "name": "ريال سعودي",
+      "symbol": "ر.س",
+      "amount": 1,
+      "country_code": "sa"
+    }
+  }
+};
+Salla.config.merge(Salla.config.default_properties);
+Salla.config.triedToGetCurrencies_ = false;
+Salla.config.triedToGetLanguages_ = false;
+
+Salla.config.isUser = () => {
+  return Salla.config.get('user.type') === 'user';
+};
+
+Salla.config.isGuest = () => {
+  return !Salla.config.isUser();
+};
+/**
+ * @return {Promise<Language[]|*>}
+ */
+
+
+Salla.config.languages = async () => {
+  if (Salla.config.triedToGetLanguages_) {
+    return Salla.config.get('languages');
+  }
+
+  Salla.config.triedToGetLanguages_ = true;
+  let isFirst = true;
+  let languages_ = [];
+  (await salla.document.api.request('languages', null, 'get'))?.data?.map(lang => {
+    if (isFirst) {
+      // clear old currencies
+      languages_ = [];
+      isFirst = false;
+    }
+
+    lang.code = lang.code || lang.iso_code;
+    lang.url = salla.url.get(lang.code);
+    lang.is_rtl = lang.is_rtl || lang.rtl;
+    languages_.push(lang);
+  });
+  Salla.config.set('languages', languages_);
+  return languages_;
+};
+
+Salla.config.currencies = async () => {
+  if (Salla.config.triedToGetCurrencies_) {
+    return Salla.config.get('currencies');
+  }
+
+  Salla.config.triedToGetCurrencies_ = true;
+  let isFirst = true;
+  let currencies_ = {};
+  (await salla.currency.api.list())?.data?.map(currency => {
+    if (isFirst) {
+      //clear old currencies
+      currencies_ = {};
+      isFirst = false;
+    }
+
+    currency.country_code = currency.code.substr(0, 2).toLowerCase();
+    currencies_[currency.code] = currency;
+  });
+  Salla.config.set('currencies', currencies_);
+  return currencies_;
+};
+/**
+ * @param {string|undefined} isoCode
+ * @return {Currency}
+ */
+
+
+Salla.config.currency = isoCode => {
+  isoCode = isoCode || Salla.config.get('user.currency_code');
+  return Salla.config.get('currencies.' + isoCode) || Object.values(Salla.config.get('currencies'))[0];
+};
+
+class InfiniteScroll extends Module {
+  constructor(api, event) {
+    super(api, event);
+    this.options = {
+      path: '.infinite-scroll-btn',
+      history: 'push',
+      status: ".infinite-scroll-status",
+      append: ".list-block"
+    };
+    this.fetchOptions = {
+      headers: {
+        'S-INFINITE-SCROLL': true // salla is not ready yet
+        // 'Accept-Language': Salla.config.get('user.language_code','ar'),
+
+      }
+    };
+    this.instances = [];
+  }
+  /**
+   * product-block
+   * @param {string|Element} selector
+   * @param {Object|string} [append=".list-block"] - if it's object will consider it as options
+   * @param {Object|string} [customOptions=this.options]
+   * @return {undefined|TheInfiniteScroll}
+   */
+
+
+  initiate(selector, append, customOptions) {
+    customOptions = this.getCustomOptions(append, customOptions);
+    let container = typeof selector != 'string' ? selector : document.querySelector(selector),
+        path = customOptions.path;
+
+    if (!container || !path || !(typeof path != 'string' || document.querySelector(path))) {
+      Salla.logger.warn(container ? 'Path Option (a link that has next page link) Not Existed!' : 'Container For InfiniteScroll not Existed!');
+      return undefined;
+    }
+
+    let infScroll = new TheInfiniteScroll__default["default"](container, customOptions); // also events can be accessed directly via:
+    // Salla.infiniteScroll.initiate(...).on('load', func);
+
+    infScroll.on('scrollThreshold', Salla.infiniteScroll.event.scrollThreshold);
+    infScroll.on('request', Salla.infiniteScroll.event.request);
+    infScroll.on('load', Salla.infiniteScroll.event.load);
+    infScroll.on('append', Salla.infiniteScroll.event.append);
+    infScroll.on('error', Salla.infiniteScroll.event.error);
+    infScroll.on('last', Salla.infiniteScroll.event.last);
+    infScroll.on('history', Salla.infiniteScroll.event.history);
+    this.instances.push(infScroll);
+    return infScroll;
+  }
+
+  getCustomOptions(append, customOptions) {
+    // if append is passed as object means it's customOptions
+    customOptions = (typeof append == 'object' ? append : false) || customOptions || this.options;
+    customOptions.fetchOptions = this.fetchOptions; // load more button
+    // if customOptions passed without path.
+
+    customOptions.path = customOptions.path || this.options.path;
+    customOptions.button = customOptions.button || customOptions.path;
+    customOptions.status = customOptions.status || this.options.status; // if customOptions passed without history.
+
+    if (!customOptions.hasOwnProperty('history')) {
+      customOptions.history = this.options.history;
+    }
+
+    customOptions.nextPage = customOptions.nextPage || customOptions.next_page;
+    customOptions.append = (typeof append == 'string' ? append : false) || customOptions.append || this.options.append;
+    return customOptions;
+  }
+
+}
+
+class AppHelpers {
+  /**
+   * @param {string} selector
+   * @param {array<string>} classes1
+   * @param {array<string>} classes2
+   * @param callback
+   */
+  toggleClassIf(selector, classes1, classes2, callback) {
+    document.querySelectorAll(selector).forEach(element => this.toggleElementClassIf(element, classes1, classes2, callback));
+    return this;
+  }
+
+  toggleElementClassIf(element, classes1, classes2, callback) {
+    classes1 = Array.isArray(classes1) ? classes1 : classes1.split(' ');
+    classes2 = Array.isArray(classes2) ? classes2 : classes2.split(' ');
+    let isClasses1 = callback(element);
+    element?.classList.remove(...(isClasses1 ? classes2 : classes1));
+    element?.classList.add(...(isClasses1 ? classes1 : classes2));
+    return this;
+  }
+  /**
+   * @param {string} email
+   * @return {boolean}
+   */
+
+
+  isValidEmail(email) {
+    const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+    return re.test(String(email).toLowerCase());
+  }
+  /**
+   * @param {string|HTMLElement} selector
+   * @return {null|HTMLElement}
+   */
+
+
+  element(selector) {
+    if (typeof selector == 'object') {
+      return selector;
+    }
+
+    return document.querySelector(selector);
+  }
+  /**
+   * @param {string} name
+   * @param {string} selector
+   * @return {Helpers}
+   */
+
+
+  watchElement(name, selector) {
+    this[name] = this.element(selector);
+    return this;
+  }
+  /**
+   * @param {Object.<string, string>} elements
+   */
+
+
+  watchElements(elements) {
+    Object.entries(elements).forEach(element => this.watchElement(element[0], element[1]));
+    return this;
+  }
+  /**
+   * @param {string} action
+   * @param {string|HTMLElement} element
+   * @param {function} callback
+   * @param {object|undefined} options
+   * @return {AppHelpers}
+   */
+
+
+  on(action, element, callback, options = {}) {
+    if (typeof element == 'object') {
+      this.element(element).addEventListener(action, callback, options);
+      return this;
+    } //if it's selector loop through all of the elements
+
+
+    document.querySelectorAll(element).forEach(el => el.addEventListener(action, callback, options));
+    return this;
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @param {function} callback
+   * @return {AppHelpers}
+   */
+
+
+  onClick(element, callback) {
+    return this.on('click', element, callback);
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @param {function} callback
+   * @return {AppHelpers}
+   */
+
+
+  onKeyUp(element, callback) {
+    return this.on('keyup', element, callback);
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @param {function} callback
+   * @return {AppHelpers}
+   */
+
+
+  onEnter(element, callback) {
+    this.onKeyUp(element, event => event.keyCode === 13 && callback(event));
+    return this;
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @param {function} callback
+   * @return {AppHelpers}
+   */
+
+
+  all(element, callback) {
+    document.querySelectorAll(element).forEach(callback);
+    return this;
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @return {AppHelpers}
+   */
+
+
+  hideElement(element) {
+    this.element(element).style.display = 'none';
+    return this;
+  }
+  /**
+   * @param {string|HTMLElement} element
+   * @return {AppHelpers}
+   */
+
+
+  showElement(element, display = 'block') {
+    this.element(element).style.display = display;
+    return this;
+  }
+  /**
+   * 💡 you can pass multi classes: this.removeClass(element, 'class_1', 'class_2', ...)
+   * @param {string|HTMLElement} element
+   * @param {string} className
+   * @return {AppHelpers}
+   */
+
+
+  removeClass(element, className) {
+    this.element(element).classList.remove(...Array.from(arguments).slice(1));
+    return this;
+  }
+  /**
+   * 💡 you can pass multi classes: this.addClass(element, 'class_1', 'class_2', ...)
+   * @param {string|HTMLElement} element
+   * @param {string} className
+   * @return {AppHelpers}
+   */
+
+
+  addClass(element, className) {
+    this.element(element).classList.add(...Array.from(arguments).slice(1));
+    return this;
+  }
+  /**
+   * @param {function} fn
+   * @param data
+   * @return {(function(...[*]): Promise<unknown>)|*}
+   */
+
+
+  debounce(fn, ...data) {
+    if (!this.debounce_) {
+      this.debounce_ = Salla.helpers.debounce((callback, ...innerData) => callback(...innerData), 500);
+    }
+
+    return this.debounce_(fn, ...data);
+  }
+
+}
+
+class Form {
+  /**
+   * Submit form via API actions.
+   *
+   * @param {ApiActionName|string} actionNameOrUrl
+   * @param {null|Event|Object} eventOrData
+   */
+  async submit(actionNameOrUrl, eventOrData = null) {
+    let data = eventOrData; // its submit event, so we'll have a submit button
+
+    if (eventOrData?.constructor?.name === 'SubmitEvent') {
+      eventOrData.preventDefault();
+
+      if (eventOrData.target?.tagName !== 'FORM') {
+        Salla.logger.warn('Failed find the target element for submit action. make sure you submit a form element');
+        return new Promise(() => {
+          throw 'Failed find the target element for submit action. make sure you submit a form element';
+        });
+      } // todo:: use form.checkValidity() && form.reportValidity()
+      // we need to find the submit button to have the loading effect
+
+
+      if (eventOrData?.submitter?.parentElement?.tagName === 'SALLA-BUTTON') {
+        eventOrData.submitter.parentElement.load();
+      }
+
+      data = eventOrData.target.getElementSallaData();
+      salla.log('Data from element', data);
+    } // if the action is url, lets do a normal request
+
+
+    if (/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)$/gm.test(actionNameOrUrl)) {
+      return salla.api.normalRequest(actionNameOrUrl, data, 'post').finally(() => {
+        if (loaderSupported) {
+          eventOrData?.submitter?.parentElement.stop();
+        }
+      });
+    } // todo :: check if the actionName is valid salla action
+    // its salla action
+
+
+    let className = actionNameOrUrl.split('.');
+    let functionName = className.splice(-1);
+    return await salla.call(className.join('.'))[functionName](data).finally(() => eventOrData?.submitter?.parentElement?.stop()).catch(error => {
+      salla.logger.warn(error);
+      throw error;
+    });
+  }
+  /**
+   * Submit form via API actions.
+   *
+   * @param {ApiActionName|string} actionNameOrUrl
+   * @param {null|Event|Object} eventOrData
+   * @return {boolean}
+   */
+
+
+  onSubmit(actionNameOrUrl, eventOrData) {
+    salla.form.submit(actionNameOrUrl, eventOrData);
+    return false;
+  }
+  /**
+   * Submit form via API actions.
+   *
+   * @param {ApiActionName|string} actionName
+   * @param {null|Event|Object} event
+   * @return {boolean}
+   */
+
+
+  onChange(actionName, event) {
+    if (!event?.currentTarget) {
+      salla.logger.warn(`Trying to trigger '${actionName}' without event!`);
+      return false;
+    }
+
+    if (event?.currentTarget?.tagName === 'FORM' && !event.currentTarget.checkValidity()) {
+      salla.logger.warn(`Trying to trigger '${actionName}' without filling required fields!`);
+      return false;
+    }
+
+    salla.form.submit(actionName, event.currentTarget.getElementSallaData());
+    return true;
+  }
+  /**
+   *
+   * @param {object|FormData} formData
+   * @param {Array} possibleNames
+   * @param {boolean|undefined} objectable - can wanted value be object? default No.
+   * @return {undefined|string|*}
+   */
+
+
+  getPossibleValue(formData, possibleNames, objectable = false) {
+    if (!formData) {
+      return undefined;
+    }
+
+    if (typeof formData !== 'object') {
+      return formData;
+    }
+
+    let wantedValue;
+
+    for (let i = 0; i < possibleNames.length; i++) {
+      if (wantedValue = formData[possibleNames[i]]) {
+        break;
+      }
+
+      if (typeof FormData !== 'undefined' && formData instanceof FormData && (wantedValue = formData.get(possibleNames[i]))) {
+        break;
+      }
+    }
+
+    wantedValue = wantedValue || formData;
+    return typeof wantedValue == 'object' && !objectable ? undefined : wantedValue;
+  }
+
+}
+
+class SallaLang extends Lang__default["default"] {
+  constructor(options) {
+    options = options || {}; // TODO:: allow the developer to pass initiate values
+    //        to avoid this message even when he will add translations later.
+
+    options.messages = options.messages || window.translations;
+    options.locale = options.locale || (window.locale || navigator.language || navigator.userLanguage || 'ar').split('-')[0];
+    options.fallback = options.fallback || options.locale;
+    super(options);
+    this.translationsLoaded = false; // handy, when we are trying to run onLoaded(), after is already loaded.
+  }
+
+  onLoaded(callback) {
+    if (this.translationsLoaded) {
+      return callback();
+    } // todo:: in case there is need support Salla.event.on() for synced translations
+
+
+    Salla.event.once('languages::translations.loaded', callback);
+  }
+
+  loadStoreTranslations() {
+    if (this.messages) {
+      // because load the messages is faster than load js url
+      // we want to delay the event of lang until all dom render
+      // to make sure the web component will receive the event when fired
+      window.addEventListener('load', event => {
+        salla.event.dispatch('languages::translations.loaded');
+        salla.logger.info('The messages of transactions is already loaded');
+      });
+      return;
+    }
+
+    let url = salla.url.get('');
+
+    if (!url) {
+      this.loadScript('https://cdn.salla.network/js/translations.js', false);
+      return;
+    }
+
+    let hash = salla.config.get('theme.translations_hash', salla.config.get('store.id', 'twilight')); // load default translations for salla, or using global translations file
+
+    this.loadScript(salla.url.get(`languages/assets/${hash}.js`));
+  }
+
+  setMessages(translations) {
+    super.setMessages(translations);
+    salla.event.dispatch('languages::translations.loaded');
+    this.translationsLoaded = true;
+  }
+
+  loadScript(url, withFallback = true) {
+    let script = document.createElement('script');
+    script.src = url;
+
+    script.onload = () => {
+      if (window.translations) {
+        return this.setMessages(window.translations);
+      }
+
+      script.onerror();
+    };
+
+    script.onerror = () => {
+      if (withFallback) {
+        salla.logger.warn("Failed to load Translations for store, lets try load it from CDN");
+        return this.loadScript('https://cdn.salla.network/js/translations.js', false);
+      }
+
+      salla.logger.error("Failed to load Translations, check your network logs for more details" + "\nor: salla.lang.setMessages({....}), see https://docs.salla.dev for more information's.");
+    };
+
+    document.head.appendChild(script);
+  }
+
+  get(key, replacements, locale) {
+    //if translations in window object, means it's using lang.js formatting, so lets ignore first level key.
+    if (window.translations) {
+      key = 'trans.' + key;
+    }
+
+    return super.get(key, replacements, locale);
+  }
+
+  set(key, message) {
+    salla.helpers.setNested(this.messages[this.getLocale() + '.trans'], key, message);
+    return this;
+  }
+
+}
+
+/**
+ * @property {string} className
+ * @property {Object.<string, string>} endpoints - keep urls of endpoints
+ * @property {Object.<string, string>} endpointsMethods - {deleteItem:"delete"}
+ * @property {{request: Function|undefined, time: number, enabled: boolean, exclude: Array}} debounce - keep debounce function for this api.
+ *
+ */
+
+/** @typedef {Object} DataFromHook */
+class BaseApi {
+  constructor() {
+    /**
+     * this class is the base class for api classes like (cart, auth)
+     * we will initiate it from Main Salla Api/axios,
+     * So we will Pass it (Main Salla Api) as an alias to be able to call it's methods from children apis,
+     *
+     * 💡 All axios methods will be available via it, like "this.parent.post()"
+     */
+    this.endpoints = {};
+    this.webEndpoints = []; //all endpoints should be api, if there is an exception, put endpoint here.
+
+    this.namespace = 'BaseApi';
+    /**
+     * @see Object.prototype.getElementSallaData
+     * @see Object.prototype.canEventFireHook
+     * @type {Object.<string, string>}
+     */
+
+    this.endpointsMethods = {}; //"post" is the default, can use other method for endpoint here.
+
+    this.endpointsHeaders = {}; //pass specific headers for specific endpoints
+
+    let results = /function (.{1,})\(/.exec(this.constructor.toString());
+    this.className = (results && results.length > 1 ? results[1] : "").toLowerCase(); // we can make api debouncable or not,
+    // or change debounce time by overriding this object with wanted values.
+
+    this.debounce = {
+      request: undefined,
+      time: 300,
+      enabled: true,
+      exclude: []
+    };
+  }
+  /**
+   * should be called from child class, after preparing data, to initiate things.
+   */
+
+
+  after_init() {}
+  /**
+   * @param {string[]|string} endPoint - pass [url|endpoint|array(url|endpoint, urlParam)]
+   * @param {Object|undefined} formData
+   * @param {string|null} method
+   * @return {Promise}
+   */
+
+
+  normalRequest(endPoint, formData = undefined, method = null) {
+    let isArray = Array.isArray(endPoint); //if endPoint is an array pass it using (spread operator "three dots"), otherwise pass normal string
+
+    let endPointUrl = isArray ? this.getUrl(...endPoint) : this.getUrl(endPoint); //if there is need to use different method than post, otherwise use post;
+
+    endPoint = isArray ? endPoint[0] : endPoint;
+    method = method || this.endpointsMethods[endPoint] || 'post';
+    let headers = this.endpointsHeaders[endPoint];
+
+    if (method === 'get' && formData instanceof FormData) {
+      let parameters = {};
+      Array.from(formData.entries()).forEach(function (data) {
+        parameters[data[0]] = data[1];
+      });
+      formData = {
+        params: parameters
+      };
+    } // else if (method === 'get' && formData && !formData.params) {
+    //     formData.params = formData;
+    // }
+
+
+    if (headers && method === 'get') {
+      formData = formData ? Object.assign(formData, headers) : headers;
+    } // use api baseurl, when it's api
+
+
+    if (this.webEndpoints.includes(endPoint)) {
+      endPointUrl = salla.url.get(endPointUrl);
+    } else if (endPointUrl.substring(0, 4) !== 'http') {
+      endPointUrl = salla.url.api(endPointUrl);
+    }
+
+    return Salla.api.request(endPointUrl, formData, method, {
+      headers: headers
+    });
+  }
+  /**
+   * @param {string|array} endPoint - pass [url|endpoint|array(url|endpoint, urlParam)]
+   * @param {Object|undefined} formData
+   * @param {string|null} method
+   * @return {Promise}
+   */
+
+
+  request(endPoint, formData = undefined, method = null) {
+    if (!salla.api.isFastRequestsAllowed() && this.debounce.enabled) {
+      if (!this.debounce.request) {
+        this.debounce.request = salla.helpers.debounce(this.normalRequest.bind(this), this.debounce.time);
+      }
+
+      return this.debounce.request(endPoint, formData, method);
+    }
+
+    return this.normalRequest(endPoint, formData, method);
+  }
+  /**
+   * pass all endpoints from here to be free changing endpoints without breakchange
+   * @param {...string} endPoint
+   * @return {string|undefined}
+   */
+
+
+  getUrl(endPoint) {
+    let endPointUrl = this.endpoints[endPoint] || endPoint;
+    /**
+     * in case there is parameters need to be replaced in url, user can pass them, we will handle replacement
+     * @example
+     * 'test/jamal/{id1}/{another}/edit'
+     * we will run throw passed arguments after argument one, then replace one by one.
+     * final result will be something like
+     * 'test/jamal/100/56/edit'
+     */
+
+    const regex = /{[^{}]+}/i;
+
+    for (let i = 1; i < arguments.length; i++) {
+      endPointUrl = endPointUrl.replace(regex,
+      /*urlParReplacement*/
+      arguments[i]);
+    }
+
+    return endPointUrl;
+  }
+  /**
+   * @return {BaseEvent|AuthEvent|CartEvent}
+   */
+
+
+  event() {
+    return salla.event[this.className];
+  }
+
+}
+
+class CartApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'cart';
+    this.endpoints = {
+      latest: 'cart/latest',
+      details: 'cart/{cart}',
+      // summary    : 'cart/{cart}/summary',
+      quickAdd: 'cart/{cart}/item/{product}/quick-add',
+      addItem: 'cart/{cart}/item/{product}/add',
+      deleteItem: 'cart/{cart}/item/{item}',
+      updateItem: 'cart/{cart}/item/{item}',
+      deleteImage: 'cart/{cart}/image/{image}',
+      uploadImage: 'cart/{cart}/image',
+      status: 'cart/{cart}/status',
+      // submit     : 'cart/{cart}',
+      // uploadOptionImage: 'cart/{cart}/option-image',
+      addCoupon: 'cart/{id}/coupon',
+      deleteCoupon: 'cart/{id}/coupon'
+    };
+    this.endpointsMethods = {
+      latest: 'get',
+      details: 'get',
+      // summary    : 'get',
+      status: 'get',
+      updateItem: 'post',
+      deleteItem: 'delete',
+      deleteImage: 'delete',
+      deleteCoupon: 'put'
+    };
+    this.webEndpoints = ['latest' //it's important to be web for getting cart by session when user not logged in
+    ];
+    this.after_init();
+  }
+
+  async getCurrentCartId() {
+    // guest
+    // -- generate a cart and store the id in the local
+    // -- all api call via cart id
+    // -- once login -> exchange the cart id to the user
+    // -- make sure in the middleware of cart api the cart id is not pending or throw error to generate a new one
+    // -- in check status handling update local storage if the cart is not avillable
+    // user
+    // -- generte a cart via api and store the id in local storage
+    // -- all api call via cart id
+    // -- make sure in the middleware of cart api the cart id is not pending or throw error to generate a new one
+    // -- check the status of the cart before the submit
+    // -- in check status handling update local storage if the cart is not avillable
+    return salla.storage.get('cart.id') || (await this.latest()).data.cart.id;
+  }
+
+  getUploadImageEndpoint(cart_id) {
+    return salla.url.api(this.getUrl('uploadImage', cart_id || salla.storage.get('cart.id')));
+  }
+
+  latest() {
+    return this.request('latest', {
+      params: {
+        source: ''
+      }
+    }).then(res => {
+      salla.storage.set('cart', res.data.cart);
+      salla.event.cart.latestFetched(res);
+      return res;
+    }).catch(error => {
+      salla.storage.set('cart', '');
+      salla.event.cart.latestFailed(error);
+      throw error;
+    });
+  }
+
+  async details() {
+    let cartId = await this.getCurrentCartId();
+    return this.request(['details', cartId]).then(function (response) {
+      salla.cart.event.detailsFetched(response);
+      return response;
+    }).catch(function (error) {
+      salla.cart.event.detailsNotFetched(error);
+      throw error;
+    });
+  }
+  /**
+   * An Alias For addItem, But For QuickAdd Only.
+   *
+   * todo:: drop it is not used
+   * @param {int} prodId
+   * @return {Promise}
+   * @deprecated drop it is not used
+   */
+
+
+  async quickAdd(prodId) {
+    return this.addItem(prodId);
+  }
+  /**
+   * Add item to cart
+   * 💡 If Quantity not passed will use 'quickAdd' endpoint.
+   *
+   * @param {int|DataFromHook|FormData|Object} productIdOrObject
+   * @return {Promise<unknown>|boolean}
+   */
+
+
+  async addItem(productIdOrObject) {
+    let data = this.getCartPayload(productIdOrObject);
+
+    if (!data.id) {
+      let message = 'There is no product "id"!';
+      salla.cart.event.itemAddedFailed(message);
+      return salla.api.errorPromise(message);
+    } //if quantity is existed, change endpoint & add quantity to formData.
+
+
+    let endpoint = salla.form.getPossibleValue(data.payload, ['quantity', 'donating_amount']) ? 'addItem' : 'quickAdd';
+    let cartId = await this.getCurrentCartId();
+    return this.request([endpoint, cartId, data.id], data.payload).then(function (response) {
+      salla.cart.event.itemAdded(response, data.id);
+      return response;
+    }).catch(function (error) {
+      salla.cart.event.itemAddedFailed(error, data.id);
+      throw error;
+    });
+  }
+
+  async deleteItem(item_id) {
+    let data = this.getCartPayload(item_id);
+
+    if (!data.id) {
+      let message = 'There is no "id"!';
+      salla.cart.event.itemDeletedFailed(message);
+      return salla.api.errorPromise(message);
+    }
+
+    let cartId = await this.getCurrentCartId();
+    return this.request(['deleteItem', cartId, data.id]).then(function (response) {
+      salla.cart.event.itemDeleted(response, data.id);
+      return response;
+    }).catch(function (error) {
+      salla.cart.event.itemDeletedFailed(error, data.id);
+      throw error;
+    });
+  }
+
+  async updateItem(item_id) {
+    let data = this.getCartPayload(item_id);
+
+    if (!data.id) {
+      let message = 'There is no "id"!';
+      salla.cart.event.itemUpdatedFailed(message);
+      return salla.api.errorPromise(message);
+    }
+
+    let cartId = await this.getCurrentCartId();
+
+    if (data.payload.constructor?.name === 'Object') {
+      data.payload['_method'] = 'PUT';
+    } else {
+      data.payload.append('_method', 'PUT');
+    }
+    /**
+     * Lets us POST to support form data
+     * this isn't a symfony (or laravel, or any other framework) issue, it's a limitation of PHP.
+     */
+
+
+    return this.request(['updateItem', cartId, data.id], data.payload).then(function (response) {
+      salla.cart.event.itemUpdated(response, data.id);
+      return response;
+    }).catch(function (error) {
+      salla.cart.event.itemUpdatedFailed(error, data.id);
+      throw error;
+    });
+  }
+
+  async deleteImage(fileId) {
+    if (!(fileId = salla.form.getPossibleValue(fileId, ['id', 'image_id', 'photo_id']))) {
+      let message = 'There is no "id"!';
+      salla.cart.event.imageNotDeleted(message);
+      return salla.api.errorPromise(message);
+    }
+
+    let cartId = await this.getCurrentCartId();
+    return this.request(['deleteImage', cartId, fileId]).then(function (response) {
+      salla.cart.event.imageDeleted(response, fileId);
+      return response;
+    }).catch(function (error) {
+      salla.cart.event.imageNotDeleted(error, fileId);
+      throw error;
+    });
+  }
+
+  async status(cartId) {
+    return this.request(['status', cartId || (await this.getCurrentCartId())]);
+  }
+
+  async submit() {
+    this.status(await this.getCurrentCartId()).then(res => {
+      let next_step = res.data.next_step.to;
+
+      if (!['checkout', 'refresh', 'login'].includes(next_step)) {
+        let message = "Can't find next_step );";
+        salla.cart.event.submitFailed(message);
+        throw message;
+      }
+
+      salla.cart.event.submitted(res);
+
+      if (next_step === 'login') {
+        salla.auth.setCanRedirect(false); // next_step is login
+
+        salla.event.dispatch('login::open'); //todo:: make sure this will not be fired more than once & it will not be infinite loop
+
+        salla.auth.event.onLoggedIn(response => {
+          salla.event.dispatch('login::close');
+          this.submit();
+        });
+        return;
+      }
+
+      if (next_step === 'checkout') {
+        window.location.href = res.data.next_step.url + (window.ApplePaySession ? '?has_apple_pay=true' : '');
+      } else {
+        //next_step === 'refresh'
+        window.location.reload();
+      }
+    }).catch(function (error) {
+      salla.cart.event.submitFailed(error);
+      throw error;
+    });
+  }
+  /**
+   * Extract ProductId & formData from Passed Object
+   * @param {number|Object} productIdOrObject
+   * @return {{payload: *, id: number}}
+   */
+
+
+  getCartPayload(productIdOrObject) {
+    /**
+     * if productIdOrObject is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+    let payload = productIdOrObject?.data || (typeof productIdOrObject == 'object' ? productIdOrObject : undefined); //try to get productIdOrObject from payload if it's existed
+
+    productIdOrObject = payload ? salla.form.getPossibleValue(payload, ['prod_id', 'product_id', 'item_id', 'id']) : productIdOrObject;
+    payload = typeof payload == 'object' ? payload : undefined;
+    return {
+      id: productIdOrObject,
+      payload: payload
+    };
+  }
+
+  normalRequest(endPoint, formData = undefined, method = null) {
+    return super.normalRequest(endPoint, formData, method).catch(error => {
+      // it Looks that cart id not valid🤔
+      if (error?.response?.status === 403) {
+        salla.storage.remove('cart');
+        salla.error(salla.lang.get('pages.checkout.try_again'));
+      }
+
+      throw error;
+    });
+  }
+
+  reset() {
+    salla.storage.remove('cart');
+    salla.cart.event.successReset();
+  } //Coupons
+
+  /**
+   * Add Coupon to cart*
+   * @param {string|Object|FormData|Object} coupon
+   */
+
+
+  async addCoupon(coupon) {
+    coupon = coupon.data || coupon;
+
+    if (!(coupon = salla.form.getPossibleValue(coupon, ['coupon']))) {
+      let error = new Error('There is no "Coupon Code"!');
+      error.name = 'EmptyCoupon';
+      salla.event.cart.couponAdditionFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    let cartId = await salla.cart.api.getCurrentCartId();
+    return this.request(['addCoupon', cartId], {
+      coupon: coupon
+    }).then(function (response) {
+      salla.event.cart.couponAdded(response, cartId);
+      return response;
+    }).catch(function (error) {
+      salla.event.cart.couponAdditionFailed(error, cartId);
+      throw error;
+    });
+  }
+
+  async deleteCoupon() {
+    let cartId = await salla.cart.api.getCurrentCartId();
+    return this.request(['deleteCoupon', cartId], {}).then(function (response) {
+      salla.event.cart.couponDeleted(response, cartId);
+      return response;
+    }).catch(function (error) {
+      salla.event.cart.couponDeletionFailed(error, cartId);
+      throw error;
+    });
+  }
+
+}
+
+class LoyaltyApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'loyalty';
+    this.endpoints = {
+      getProgram: 'loyalty',
+      exchange: 'loyalty/exchange',
+      reset: "loyalty/exchange"
+    };
+    this.endpointsMethods = {
+      getProgram: 'get',
+      reset: 'put'
+    };
+    this.after_init();
+  }
+
+  getProgram() {
+    return this.request('getProgram').then(response => {
+      salla.loyalty.event.programFetched(response);
+      return response;
+    }).catch(err => {
+      salla.loyalty.event.programNotFetched(err);
+      throw err;
+    });
+  }
+  /**
+   * @param {object | FormData | string} prize_id
+   * @param {number|Null} cart_id
+   */
+
+
+  async exchange(prize_id, cart_id = null) {
+    prize_id = salla.form.getPossibleValue(prize_id, ['id', 'loyalty_prize_id', 'prize_id']);
+
+    if (!prize_id) {
+      let error = 'Unable to find cart id. Please provide one.';
+      salla.loyalty.event.exchangeFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    cart_id = cart_id || (await salla.cart.getCurrentCartId());
+
+    if (!cart_id) {
+      let error = 'Unable to find cart id. Please provide one.';
+      salla.loyalty.event.exchangeFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('exchange', {
+      loyalty_prize_id: prize_id,
+      cart_id: cart_id
+    }).then(function (response) {
+      salla.loyalty.event.exchangeSucceeded(response, prize_id);
+      return response;
+    }).catch(function (error) {
+      salla.loyalty.event.exchangeFailed(error, prize_id);
+      throw error;
+    });
+  }
+  /**
+   * 
+   * Reset or delete exchange
+   */
+
+
+  async reset(cart_id = null) {
+    cart_id = cart_id || (await salla.cart.getCurrentCartId());
+
+    if (!cart_id) {
+      let error = 'Unable to find cart id. Please provide one.';
+      salla.loyalty.event.resetFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('reset', {
+      cart_id: cart_id
+    }).then(response => {
+      salla.loyalty.event.resetSucceeded(response);
+      return response;
+    }).catch(err => {
+      salla.loyalty.event.resetFailed(err);
+      throw err;
+    });
+  }
+
+}
+
+class AuthApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'auth';
+    this.canRedirect_ = true;
+    this.endpoints = {
+      login: "auth/{type}/send_verification",
+      resend: "auth/resend_verification",
+      verify: "auth/{type}/verify",
+      register: "auth/register",
+      logout: "logout",
+      // todo :: rename it to auth/logout
+      refresh: "auth/refresh" //is workaround when we are logged in by web but we don't have token
+
+    };
+    this.webEndpoints = ['logout', 'auth/jwt', 'refresh'];
+    this.endpointsMethods = {
+      logout: 'get'
+    };
+    this.after_init();
+  }
+
+  setCanRedirect(canRedirect) {
+    salla.api.auth.canRedirect_ = canRedirect;
+  }
+
+  canRedirect() {
+    return salla.api.auth.canRedirect_;
+  }
+  /**
+   * login
+   *
+   * @param {AuthRequest.loginByMobile | AuthRequest.loginByEmail | object| FormData} payload
+   * @return {Promise}
+   * TODO:: Remove type, just use data
+   */
+
+
+  login(payload) {
+    /**
+     * if type is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+    if (payload?.data) {
+      payload = payload.data;
+    }
+
+    let type = salla.form.getPossibleValue(payload, ['type']);
+
+    if (!['email', 'mobile'].includes(type)) {
+      let error = 'Login type should be in: [email, mobile]';
+      salla.auth.event.codeNotSent(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request(['login', type], payload).then(function (response) {
+      salla.auth.event.codeSent(response, type);
+      return response;
+    }).catch(function (error) {
+      salla.auth.event.codeNotSent(error, type);
+      throw error;
+    });
+  }
+  /**
+   * verify
+   *
+   * @param {AuthRequest.verifyByEmail|AuthRequest.verifyByMobile} payload
+   * @param supportWebAuth
+   * @return {Promise}
+   */
+
+
+  async verify(payload, supportWebAuth = true) {
+    let type = salla.form.getPossibleValue(payload, ['type']);
+
+    if (!type) {
+      let message = 'Failed to know what\'s login type!';
+      salla.auth.event.verificationFailed(message);
+      return salla.api.errorPromise(message);
+    } // workaround to allow supportWebAuth by passing it as argument or inside payload
+
+
+    supportWebAuth = salla.form.getPossibleValue(payload, ['supportWebAuth']) === false ? false : supportWebAuth; // some times, there is need to fire action, after login,
+    // search for "element.hasAttribute('data-auth-required')" in "helpers/initiateSalla.js" to know
+    // todo:: it looks it's workaround to do thing after login,
+    //        I think we can keep any thing we need in salla.storage
+    //        then apply and delete it  when we need
+
+    if (salla.auth.event.next_event) {
+      payload.next_event = salla.auth.event.next_event;
+    }
+    /** @type {AuthResponse.verify} */
+
+
+    let response = await this.request(['verify', type], payload);
+
+    if (response?.status !== 200) {
+      salla.auth.event.verificationFailed(response, type);
+      return salla.api.errorPromise(response);
+    }
+
+    let isAuthenticated = response.data?.case === 'authenticated';
+    isAuthenticated && salla.auth.event.tokenFetched(response.data.token);
+    /**
+     * in this route we have middleware to share same user in api with current web session
+     * @see \Modules\Auth\Http\Middleware\CustomJWTAuthForWebRoutes
+     */
+
+    supportWebAuth && (await this.request('auth/jwt'));
+    isAuthenticated && salla.auth.event.loggedIn(response);
+    salla.auth.event.verified(response, type);
+    return salla.api.successPromise(response);
+  }
+  /**
+   * @param {AuthRequest.resend} data
+   * @return {Promise<AuthResponse.resend>}
+   */
+
+
+  resend(data) {
+    data = data.data || data;
+    data.type = data.type || 'mobile';
+    let message;
+
+    if (data.type === 'mobile' && (!data.phone || !data.country_code)) {
+      salla.auth.event.codeNotSent(message = 'There is no phone or country_code!', data);
+      return salla.api.errorPromise(message);
+    }
+
+    if (data.type === 'email' && !data.email) {
+      salla.auth.event.codeNotSent(message = 'There is no email!', data);
+      return salla.api.errorPromise(message);
+    }
+
+    return this.request('resend', data).then(function (response) {
+      salla.auth.event.codeSent(response, data);
+      return response;
+    }).catch(function (error) {
+      salla.auth.event.codeNotSent(error, data);
+      throw error;
+    });
+  }
+  /**
+   * register
+   * @param {object|Object} payload
+   * @return {Promise}
+   */
+
+
+  register(payload) {
+    let element;
+    /**
+     * @see Object.prototype.getElementSallaData
+     */
+
+    if (payload.data) {
+      element = payload.element;
+      payload = payload.data;
+    } // sometimes, there is need to fire action, after login,
+    // search for "element.hasAttribute('data-auth-required')" in "helpers/initiateSalla.js" to know
+
+
+    if (salla.auth.event.next_event) {
+      payload.next_event = salla.auth.event.next_event;
+    }
+
+    return this.request('register', payload).then(function (response) {
+      salla.auth.event.registered.call(element, response);
+
+      if (response.data?.case === 'authenticated') {
+        salla.auth.event.loggedIn(response);
+      }
+
+      return response;
+    }).catch(function (error) {
+      salla.auth.event.registrationFailed.call(element, error);
+      throw error;
+    });
+  }
+
+  logout() {
+    return this.request('logout').then(function (response) {
+      salla.auth.event.loggedOut(response);
+      salla.log('Reloading after 0.1 sec...');
+      setTimeout(() => location.reload(), 100);
+      return response;
+    }).catch(function (error) {
+      salla.auth.event.failedLogout(error);
+      throw error;
+    });
+  }
+
+  refresh() {
+    return this.request('refresh').catch(function (error) {
+      salla.auth.event.refreshFailed(error);
+      throw error;
+    });
+  }
+
+}
+
+class OrderApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'order';
+    this.endpoints = {
+      cancel: 'orders/cancel/{id}',
+      createCartFromOrder: 'reorder/{id}',
+      sendInvoice: 'orders/send/{id}'
+    };
+    this.endpointsMethods = {
+      createCartFromOrder: 'get'
+    };
+    this.after_init();
+  }
+  /**
+   * @param {object|FormData} payload
+   */
+
+
+  show(payload) {
+    let orderId = salla.form.getPossibleValue(payload?.data || payload, ['id', 'order_id']); //important for mobile apps
+
+    salla.event.dispatch('mobile::order.placed', {
+      order_id: orderId
+    });
+    location.href = salla.form.getPossibleValue(payload?.data || payload, ['url']);
+  }
+  /**
+   * @param {int} orderId
+   * @return {Promise}
+   */
+
+
+  cancel(orderId) {
+    orderId = orderId || Salla.config.get('page.id');
+    return this.request(['cancel', orderId], {
+      params: {
+        has_apple_pay: !!window.ApplePaySession
+      }
+    }).then(function (response) {
+      salla.event.order.canceled(response, orderId);
+      return response;
+    }).catch(function (error) {
+      salla.event.order.notCanceled(error, orderId);
+      throw error;
+    });
+  }
+  /**
+   * @param {int} orderId
+   * @return {Promise}
+   */
+
+
+  createCartFromOrder(orderId) {
+    orderId = orderId || salla.config.get('page.id');
+    return this.request(['createCartFromOrder', orderId]).then(function (response) {
+      salla.storage.set('cart', {
+        id: response.data.cart_id,
+        user_id: salla.config.get('user.id')
+      });
+      salla.event.order.orderCreated(response, orderId);
+      window.location.href = response.data.url;
+      return response;
+    }).catch(function (error) {
+      salla.event.order.orderCreationFailed(error, orderId);
+      throw error;
+    });
+  }
+
+  sendInvoice(data) {
+    let order_id = salla.form.getPossibleValue(data, ['id']) || salla.config.get('page.id');
+
+    if (!order_id || isNaN(order_id)) {
+      let message = 'There is no id!';
+      salla.order.event.invoiceNotSent(message);
+      return salla.api.errorPromise(message);
+    }
+
+    return this.request(['sendInvoice', order_id], data).then(res => {
+      salla.event.order.invoiceSent(res, order_id);
+      return res;
+    }).catch(error => {
+      salla.event.order.invoiceNotSent(error, order_id);
+      throw error;
+    });
+  }
+
+}
+
+class ProductApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'product';
+    this.previousQuery = '';
+    this.endpoints = {
+      getPrice: 'products/{id}/price',
+      availabilitySubscribe: 'products/{id}/availability-notify',
+      search: 'products/search',
+      categories: 'products/categories/{?id}',
+      offers: 'products/{product_id}/specialoffer',
+      getSizeGuides: 'products/{prod_id}/size-guides',
+      giftDetail: 'products/{product_id}/buy-as-gift',
+      giftToCart: 'products/{product_id}/buy-as-gift',
+      giftImage: 'products/buy-as-gift/image'
+    };
+    this.endpointsMethods = {
+      giftDetail: 'get'
+    };
+    this.after_init();
+  }
+  /**
+   * Getting Price Of Product
+   * @param {int|Object|Object|FormData} productIdOrPayload
+   * @return {Promise}
+   */
+
+
+  getPrice(productIdOrPayload) {
+    let payload = productIdOrPayload.data || productIdOrPayload;
+    let product_id = salla.form.getPossibleValue(payload, ['id', 'prod_id', 'product_id']);
+    return this.request(['getPrice', product_id], typeof payload == 'object' ? payload : undefined).then(function (response) {
+      salla.product.event.priceUpdated(response, product_id);
+      return response;
+    }).catch(function (error) {
+      salla.product.event.priceUpdateFailed(error, product_id);
+      throw error;
+    });
+  }
+  /**
+   * @return {Promise}
+   */
+
+
+  categories(categoryId) {
+    return this.request(['categories', categoryId || ''], null, 'get').then(function (response) {
+      salla.product.event.categoriesFetched(response);
+      return response;
+    }).catch(function (error) {
+      salla.product.event.categoriesFailed(error);
+      throw error;
+    });
+  }
+
+  availabilitySubscribe(prodId) {
+    let formData = prodId.data || prodId;
+    prodId = salla.form.getPossibleValue(formData, ['id', 'prod_id']);
+    return this.request(['availabilitySubscribe', prodId], typeof formData == 'object' ? formData : undefined).then(function (response) {
+      salla.product.event.availabilitySubscribed(response, prodId);
+      return response;
+    }).catch(function (error) {
+      salla.product.event.availabilitySubscribedFailed(error, prodId);
+      throw error;
+    });
+  }
+  /**
+   * @param {SearchPayload|string|any} query
+   * @return {Promise<unknown>}
+   */
+
+
+  search(query) {
+    /**
+     * if query is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+    let formData = query.data;
+
+    if (!formData) {
+      formData = {
+        params: typeof query === 'string' ? {
+          query: query
+        } : query
+      };
+    }
+
+    query = formData instanceof FormData ? formData.get('query') : formData.query || formData.params?.query;
+
+    if (!query) {
+      let msg = 'There is no "query"!';
+      salla.product.event.searchFailed(msg);
+      return salla.api.errorPromise(msg);
+    }
+
+    if (query === salla.api.product.previousQuery) {
+      let msg = 'Query is same as previous one!';
+      salla.product.event.searchFailed(msg);
+      salla.api.product.previousQuery = null;
+      return salla.api.errorPromise(msg);
+    }
+
+    salla.api.product.previousQuery = query;
+    return this.request('search', formData, 'get').then(function (response) {
+      salla.product.event.searchResults(response, query);
+      return response;
+    }).catch(function (error) {
+      salla.product.event.searchFailed(error, query);
+      throw error;
+    });
+  }
+  /**
+   * Show offer popup for this product
+   * @param {Object|number} product_id
+   */
+
+
+  offers(product_id) {
+    product_id = salla.form.getPossibleValue(product_id?.data | product_id, ['product_id', 'id']);
+
+    if (!product_id) {
+      let message = 'There is no "product_id"!';
+      salla.offer.event.fetchDetailsFailed(message);
+      return salla.api.errorPromise(message);
+    }
+
+    return this.request(['offers', product_id]).then(function (response) {
+      salla.product.event.offersFetched(response, product_id);
+      return response;
+    }).catch(function (error) {
+      salla.product.event.fetchOffersFailed(error, product_id);
+      throw error;
+    });
+  }
+  /**
+   * Get size guides
+   * 
+   * The product id for which the size guide is required.
+   * @param {string} prod_id
+   */
+
+
+  getSizeGuides(prod_id) {
+    return this.request(`products/${prod_id}/size-guides`, null, 'get').then(response => {
+      salla.product.event.sizeGuideFetched(response, prod_id);
+      return response;
+    }).catch(err => {
+      salla.product.event.sizeGuideFetchFailed(err, prod_id);
+      throw err;
+    });
+  }
+  /**
+  * Get gifting system
+  * 
+  * The product id for which the gifting system is required.
+  * @param {number} product_id
+  */
+
+
+  getGiftDetails(product_id) {
+    return this.request(['giftDetail', product_id]).then(resp => {
+      salla.product.event.giftFetched(resp, product_id);
+      return resp;
+    }).catch(err => {
+      salla.product.event.giftFetchFailed(err, product_id);
+      throw err;
+    });
+  }
+  /**
+  * Add gift to cart
+  * 
+  * The product id for which the gifting system is required.
+  * @param {number} product_id
+  * @param {Object} payload
+  * @param {Object} withRedirect
+  * @return {Promise<unknown>|*}
+  */
+
+
+  addGiftToCart(product_id, payload, withRedirect = false) {
+    return this.request(['giftToCart', product_id], payload).then(resp => {
+      salla.product.event.addGiftToCartSucceeded(resp, product_id);
+
+      if (withRedirect) {
+        window.location.href = resp.redirect;
+      }
+
+      return response;
+    }).catch(err => {
+      salla.product.event.addGiftToCartFailed(err, product_id);
+      throw err;
+    });
+  }
+  /**
+   * Upload Custom Image for gift
+   * @param {FormData} multipartPayload
+   */
+
+
+  uploadGiftImage(multipartPayload) {
+    return this.request('giftImage', multipartPayload).then(resp => {
+      salla.product.event.giftImageUploadSucceeded(resp);
+      return resp;
+    }).catch(e => {
+      salla.product.event.giftImageUploadFailed(e);
+      throw e;
+    });
+  }
+
+}
+
+class ProfileApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'profile';
+    this.endpoints = {
+      info: 'auth/user',
+      update: 'profile/update',
+      updateContacts: 'profile/contacts/update',
+      verify: 'profile/verify'
+    };
+    this.after_init();
+  }
+
+  info() {
+    return this.request('info', null, 'get').then(response => {
+      salla.profile.event.infoFetched(response);
+      return response;
+    }).catch(error => {
+      salla.profile.event.infoNotFetched(error);
+      throw error;
+    });
+  }
+  /**
+   * @param {ProfileUpdatePayload} data
+   * @return {Promise<ProfileResponse>}
+   */
+
+
+  update(data) {
+    return this.request('update', data).then(response => {
+      salla.profile.event.updated(response);
+      return response;
+    }).catch(error => {
+      salla.event.profile.updateFailed(error);
+      throw error;
+    });
+  }
+  /**
+   * @param {ProfileUpdateContactPayload} data
+   * @return {Promise<ProfileResponse>}
+   */
+
+
+  updateContacts(data) {
+    return this.request('updateContacts', data).then(response => {
+      salla.profile.event.verificationCodeSent(response);
+      return response;
+    }).catch(error => {
+      salla.event.profile.updateContactsFailed(error);
+      throw error;
+    });
+  }
+  /**
+   * @param {ProfileUpdateContactPayload} data
+   * @return {Promise<ProfileResponse>}
+   */
+
+
+  verify(data) {
+    return this.request('verify', data).then(response => {
+      salla.profile.event.verified(response);
+      return response;
+    }).catch(error => {
+      salla.event.profile.unVerified(error);
+      throw error;
+    });
+  }
+
+}
+
+class CommentApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'comment';
+    this.endpoints = {
+      add: '{type}/{id}/comments'
+    };
+    this.after_init();
+  }
+  /**
+   * Add comment
+   *
+   * @param {AddCommentPayload} data
+   * @return {Promise}
+   */
+
+
+  add(data) {
+    /**
+     * if prod_id is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+
+    if (data?.data) {
+      data = data.data;
+    }
+
+    let {
+      id,
+      type,
+      comment
+    } = Object.fromEntries(data);
+    let error;
+
+    if (!id) {
+      salla.event.comment.additionFailed(error = 'Failed to get id!');
+      return salla.api.errorPromise(error);
+    }
+
+    if (!type || !['products', 'pages', 'product', 'page'].includes(type)) {
+      salla.event.comment.additionFailed(error = 'Failed to get type one of:(products, product, page, pages)!');
+      return salla.api.errorPromise(error);
+    }
+
+    if (!comment) {
+      salla.event.comment.additionFailed(error = 'can\'t find comment content!');
+      return salla.api.errorPromise(error);
+    } //we need type in plural format to be injected into the url.
+
+
+    type += ['product', 'page'].includes(type) ? 's' : '';
+    return this.request(['add', type, id], {
+      comment: comment
+    }).then(function (response) {
+      salla.event.comment.added(response, id);
+      return response;
+    }).catch(function (error) {
+      salla.event.comment.additionFailed(error, id);
+      throw error;
+    });
+  }
+
+}
+
+class CurrencyApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'currency';
+    this.endpoints = {
+      change: '/',
+      list: 'currencies'
+    };
+    this.endpointsMethods = {
+      change: 'get',
+      list: 'get'
+    };
+    this.webEndpoints = ['change'];
+    this.after_init();
+  }
+  /**
+   * Change Current Currency
+   * @param {string|Object|FormData|Object} currency
+   */
+
+
+  change(currency) {
+    currency = salla.form.getPossibleValue(currency.data || currency, ['currency', 'code']);
+
+    if (!currency) {
+      let error = 'Can\'t find currency code!';
+      salla.currency.event.failed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('change', {
+      params: {
+        change_currency: '',
+        currency: currency
+      }
+    }).then(function (response) {
+      salla.cookie.set('fresh_summary', 1);
+      salla.storage.set('cart', '');
+      salla.currency.event.changed(response, currency);
+      return response;
+    }).catch(function (error) {
+      salla.currency.event.failed(error, currency);
+      throw error;
+    });
+  }
+
+  list() {
+    return this.request('list').then(function (response) {
+      salla.currency.event.fetched(response);
+      return response;
+    }).catch(function (error) {
+      salla.currency.event.failedToFetch(error);
+      throw error;
+    });
+  }
+
+}
+
+class DocumentApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'document';
+  }
+
+}
+
+class RatingApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'rating';
+    this.endpoints = {
+      store: 'rating/store',
+      products: 'rating/products',
+      shipping: 'rating/shipping',
+      order: 'rating/{order_id}'
+    };
+    this.endpointsMethods = {
+      order: 'get'
+    };
+    this.after_init();
+  }
+  /**
+   * @param {number|{id:number, order_id:number}} orderIdOrPayload - could be number or data
+   * @return {Promise<unknown>}
+   */
+
+
+  order(orderIdOrPayload) {
+    let payload = typeof orderIdOrPayload === 'object' ? orderIdOrPayload : {};
+    let orderId = salla.form.getPossibleValue(orderIdOrPayload?.data || orderIdOrPayload, ['order_id', 'id']);
+
+    if (!orderId) {
+      let error = 'There is no "order_id"!';
+      salla.event.rating.orderNotFetched(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request(['order', orderId], payload).then(function (response) {
+      salla.event.rating.orderFetched(response, orderId);
+      return response;
+    }).catch(function (error) {
+      salla.event.rating.orderNotFetched(error, orderId);
+      throw error;
+    });
+  }
+  /**
+   * Add rating to the Store
+   * @param {Object|FormData|Object} data
+   */
+
+
+  store(data) {
+    data = data.data || data;
+
+    if (!data) {
+      let error = 'There is no "data"!';
+      salla.event.rating.storeFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('store', data).then(function (response) {
+      salla.event.rating.storeRated(response, data);
+      return response;
+    }).catch(function (error) {
+      salla.event.rating.storeFailed(error, data);
+      throw error;
+    });
+  }
+  /**
+   * An Alias Fro product()
+   * @return {Promise<unknown>}
+   */
+
+
+  products(data) {
+    data = data.data || data;
+
+    if (!data) {
+      let error = 'There is no "data"!';
+      salla.event.rating.productsFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('products', data).then(function (response) {
+      salla.event.rating.productsRated(response, data);
+      return response;
+    }).catch(function (error) {
+      salla.event.rating.productsFailed(error, data);
+      throw error;
+    });
+  }
+  /**
+   * Add rating to the shipping
+   * @param {Object|FormData|Object} data
+   */
+
+
+  shipping(data) {
+    data = data.data || data;
+
+    if (!data) {
+      let error = 'There is no "data"!';
+      salla.event.rating.shippingFailed(error);
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request('shipping', data).then(function (response) {
+      salla.event.rating.shippingRated(response, data);
+      return response;
+    }).catch(function (error) {
+      salla.event.rating.shippingFailed(error, data);
+      throw error;
+    });
+  }
+
+}
+
+class WishlistApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'wishlist';
+    this.endpoints = {
+      add: "products/favorites/{id}",
+      remove: "products/favorites/{id}"
+    };
+    this.endpointsMethods = {
+      remove: 'delete'
+    };
+    this.after_init();
+  }
+  /**
+   * Toggle the product from wishlist.
+   *
+   * @param {string|number|Object} product_id
+   * @return {Promise}
+   */
+
+
+  toggle(product_id) {
+    return salla.storage.get("salla::wishlist", []).includes(product_id) ? this.remove(product_id) : this.add(product_id);
+  }
+  /**
+   * Add To User Wishlist
+   *
+   * @param {string|number|Object} product_id
+   * @return {Promise}
+   */
+
+
+  add(product_id) {
+    let error;
+
+    if (salla.config.isGuest()) {
+      salla.wishlist.event.additionFailed(error = salla.lang.get('common.messages.must_login'));
+      salla.error(error);
+      return salla.api.errorPromise(error);
+    }
+    /**
+     * if product_id is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+
+
+    product_id = salla.form.getPossibleValue(product_id?.data || product_id, ['product_id', 'id']);
+
+    if (!product_id) {
+      salla.wishlist.event.additionFailed(error = 'Failed to get product id!');
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request(['add', product_id]).then(response => {
+      this.updateWishlistStorage(product_id);
+      salla.wishlist.event.added(response, product_id);
+      return response;
+    }).catch(function (error) {
+      salla.wishlist.event.additionFailed(error, product_id);
+      throw error;
+    });
+  }
+  /**
+   * Add To User Wishlist
+   *
+   * @param {string|number|Object} product_id
+   * @return {Promise}
+   */
+
+
+  remove(product_id) {
+    let error;
+
+    if (salla.config.isGuest()) {
+      salla.wishlist.event.additionFailed(error = salla.lang.get('common.messages.must_login'));
+      salla.error(error);
+      return salla.api.errorPromise(error);
+    }
+    /**
+     * if product_id is Object, get data from it;
+     * @see Object.prototype.getElementSallaData
+     */
+
+
+    product_id = salla.form.getPossibleValue(product_id?.data || product_id, ['product_id', 'id']);
+
+    if (!product_id) {
+      salla.wishlist.event.removingFailed(error = 'Failed to get id!');
+      return salla.api.errorPromise(error);
+    }
+
+    return this.request(['remove', product_id]).then(response => {
+      this.updateWishlistStorage(product_id, false);
+      salla.wishlist.event.removed(response, product_id);
+      return response;
+    }).catch(function (error) {
+      salla.wishlist.event.removingFailed(error, product_id);
+      throw error;
+    });
+  }
+  /**
+   * Push the product id to the local storage.
+   *
+   * @param id
+   * @param isAdded
+   */
+
+
+  updateWishlistStorage(id, isAdded = true) {
+    let wishlist = salla.storage.get("salla::wishlist", []);
+    isAdded ? wishlist.push(id) : wishlist.splice(wishlist.indexOf(id), 1);
+    salla.storage.set('salla::wishlist', wishlist);
+  }
+
+}
+
+class ScopeApi extends BaseApi {
+  constructor() {
+    super();
+    this.namespace = 'scopes';
+    this.endpoints = {
+      get: 'scopes',
+      change: 'scopes',
+      getProductAvailability: 'scopes/availability?product_id={id}'
+    };
+    this.after_init();
+  }
+  /**
+   * 
+   * Get available scopes
+   */
+
+
+  get() {
+    return this.request('scopes', null, 'get').then(response => {
+      salla.scope.event.fetched(response);
+      return response;
+    }).catch(err => {
+      salla.scope.event.notFetched(err);
+      throw err;
+    });
+  }
+  /**
+   * Change exising scope
+   * @param {FormData} payload 
+   */
+
+
+  change(payload) {
+    return this.request('scopes', payload).then(response => {
+      salla.scope.event.changeSucceeded(response);
+      return response;
+    }).catch(err => {
+      salla.scope.event.changeFailed(err);
+      throw err;
+    });
+  }
+  /**
+  * @param {number} product_id
+  */
+
+
+  getProductAvailability(product_id = null) {
+    return this.request(`scopes/availability?product_id=${product_id}`, null, 'get').then(resp => {
+      salla.scope.event.productAvailabilityFetched(resp, product_id);
+      return resp;
+    }).catch(err => {
+      salla.scope.event.productAvailabilityNotFetched(err);
+      throw resp;
+    });
+  }
+
+}
+
+/**
+ * @class
+ * @augments axios
+ */
+
+class request {
+  constructor() {
+    salla.event.on('twilight::initiated', () => this.initiateRequest());
+    salla.event.on('profile::info.fetched', response => this.setCurrencyAndLanguage(response));
+    salla.event.on('auth::token.fetched', token => {
+      salla.storage.set('token', token);
+      this.setToken(token);
+      salla.cart.api.reset();
+    }); // salla.event.on('document::request.failed', (request, error) => {
+    //     salla.logger.warn(error, request);
+    // })
+
+    this.notifier_handler_disabled = false;
+    this.axios = axios__default["default"].create({
+      headers: {
+        common: {
+          'X-Requested-With': 'XMLHttpRequest',
+          'S-SOURCE': 'twilight',
+          'S-APP-VERSION': 'v2.0.0',
+          'S-APP-OS': 'browser'
+        }
+      }
+    });
+  }
+
+  getHeaders() {
+    return this.axios.defaults.headers.common;
+  }
+
+  setHeaders(headers) {
+    Object.entries(headers).forEach(header => this.setHeader(header[0], header[1]));
+    return this;
+  }
+
+  setHeader(header, value) {
+    salla.infiniteScroll.fetchOptions.headers[header] = this.axios.defaults.headers.common[header] = value;
+    return this;
+  }
+
+  async withoutNotifier(callback) {
+    this.notifier_handler_disabled = true;
+    return await callback().finally(() => {
+      this.notifier_handler_disabled = false;
+    });
+  }
+
+  initiateRequest() {
+    this.axios.defaults.baseURL = Salla.config.get('store.api', Salla.config.get('store.url'));
+    /**
+     * About `s-user-id`
+     * there is need for when login from api to get cart from web session_id not api session_id
+     * @see AuthenticateCustomer::authenticate
+     * @see MoveVisitorCartItemsToCustomerCart
+     */
+
+    this.setHeaders({
+      'Store-Identifier': Salla.config.get('store.id'),
+      'currency': Salla.config.get('user.currency_code', 'SAR'),
+      'accept-language': salla.lang.getLocale(),
+      's-user-id': Salla.config.get('user.id')
+    });
+    let scope = salla.storage.get('scope');
+
+    if (scope) {
+      this.setHeaders({
+        's-scope-type': scope.type,
+        's-scope-id': scope.id
+      });
+    }
+
+    this.injectTokenToTheRequests();
+  }
+
+  injectTokenToTheRequests() {
+    let token = salla.storage.get('token');
+    let isGuest = Salla.config.isGuest();
+    /** @type {CartSummary}*/
+
+    let cart = salla.storage.get('cart');
+    /**
+     * 🟠 Case 1: there are cart.id, but it's not linked for current user/session
+     * 🔵 Action: reset cart.
+     */
+
+    if (cart && (cart.user_id !== Salla.config.get('user.id') || cart.store_id !== Salla.config.get('store.id'))) {
+      salla.log('Auth:: The cart is not belong to current ' + (cart.user_id !== Salla.config.get('user.id') ? 'user' : 'store') + '!');
+      salla.cart.api.reset();
+      return;
+    }
+    /**
+     * 🟠 Case 2: current user is guest and there is no token.
+     * 🔵 Action: Do nothing.
+     */
+
+
+    if (isGuest && !token) {
+      return;
+    }
+    /**
+     * 🟠 Case 3: there is a token and current user is guest
+     * 🔵 Action: remove the token & reset cart.
+     */
+
+
+    if (isGuest && token) {
+      salla.log('Auth:: Token without user!');
+      salla.storage.remove('token');
+      salla.cart.api.reset();
+      return;
+    } //======== following cases are when user is logged in ========//
+
+    /**
+     * 🟠 Case 4: current user is logged-in but there is no token.
+     * 🔵 Action: reset cart & get token.
+     */
+
+
+    if (!token) {
+      salla.cart.api.reset();
+      salla.auth.api.refresh();
+      return;
+    }
+    /**
+     * 🟠 Case 5: current user is logged-in and there is a token, but it's expired.
+     * 🔵 Action: reset cart & get new token.
+     */
+
+    /** @type {{sub: number, nbf: number, prv: string, iss: string, exp: number, iat: number, jti: string}} */
+
+
+    let jwt = jwtDecode__default["default"](token);
+
+    if (Date.now() / 1000 > jwt.exp) {
+      salla.log('Auth:: An expired token!');
+      salla.storage.remove('token');
+      salla.cart.api.reset();
+      salla.auth.api.refresh();
+      return;
+    }
+    /**
+     * 🟠 Case 6: current user is logged-in and there is a token, but it's not for current user.
+     * 🔵 Action: reset cart & get new token.
+     */
+
+
+    if (jwt.sub !== Salla.config.get('user.id')) {
+      salla.log('Auth:: The user id is not match the token details!');
+      salla.storage.remove('token');
+      salla.cart.api.reset();
+      salla.auth.api.refresh();
+      return;
+    }
+    /**
+     * 🟠 Case 7: current user is logged-in and there is a token, and it's not expired.
+     * 🔵 Action: set the token to all twilight requests.
+     */
+
+
+    this.setToken(token);
+  }
+
+  setToken(token) {
+    return this.setHeader('Authorization', 'Bearer ' + token);
+  }
+  /**
+   *
+   * @param {ProfileResponse} response
+   */
+
+
+  setCurrencyAndLanguage(response) {
+    return this.setHeaders({
+      'currency': response.data.currency,
+      'accept-language': response.data.language
+    });
+  }
+  /**
+   * @param {string[]|string} endPoint - pass [url|endpoint|array(url|endpoint, urlParam)]
+   * @param {Object|undefined} formData
+   * @param {string|null} method
+   * @param options
+   * @return {Promise}
+   */
+
+
+  request(endPoint, formData = undefined, method = 'get', options = {}) {
+    /**
+     * in case you need to prevent request by its payload, just listen to this event, using:
+     * salla.document.event.onRequest(data=>{
+     *      //your logic here..., if it should stop, just do what you want (showing message, doing action) then throw an exception like:
+     *      throw 'Error message';
+     * });
+     */
+
+    /**
+     *
+     * @type {RequestInfo}
+     */
+    let request = {
+      endPoint: endPoint,
+      payload: formData,
+      method: method,
+      options: options
+    }; // it's important to keep the current target in local var
+    // because we will lose it from the event when the request start
+
+    let eventTarget = typeof event !== 'undefined' ? event.currentTarget : null; // we need to find the event button to have the loading effect
+
+    let loaderSupported = false;
+
+    if (eventTarget?.tagName === 'SALLA-BUTTON') {
+      loaderSupported = true;
+    }
+
+    if (loaderSupported) {
+      eventTarget?.load();
+    }
+
+    return this.axios[request.method](request.endPoint, request.payload, request.options).then(response => {
+      if (loaderSupported) {
+        eventTarget?.stop();
+      } //instead of passing all axios object, we will pass response data only
+
+
+      if (response.data && response.request) {
+        response = response.data;
+      }
+
+      this.handleAfterResponseActions(response);
+      return response;
+    }).catch(error => {
+      if (loaderSupported) {
+        eventTarget?.stop();
+      }
+
+      salla.event.document.requestFailed(request, error);
+      this.handleErrorResponse(error);
+      throw error;
+    });
+  }
+  /**
+   * @param {SuccessResponse|ErrorResponse} response
+   */
+
+
+  handleAfterResponseActions(response) {
+    if (!response) {
+      return;
+    } // let's get the data from data or from the response its self ..
+
+
+    let {
+      data,
+      googleTags = null
+    } = response;
+    let withGoogleTags = data && data.googleTags ? data.googleTags : googleTags;
+
+    if (dataLayer && withGoogleTags) {
+      // let's get going and push it .
+      dataLayer.push(withGoogleTags);
+    }
+
+    this.fireEventsForResponse(response);
+    this.showAlert(response);
+    /**
+     * @deprecated don't use it
+     */
+
+    this.renderSections(response);
+  }
+  /**
+   * @param {SuccessResponse|ErrorResponse} response
+   */
+
+
+  fireEventsForResponse(response) {
+    // todo:: this is the old way (response.events), also string, so need to be dropped
+    let events = response?.events || response.data?.events || response.error?.events;
+
+    if (typeof events === 'string') {
+      events = JSON.parse(events);
+    }
+
+    events && Object.keys(events).forEach(event => salla.event.dispatch(event, events[event]));
+  }
+  /**
+   * @param {Error} error
+   */
+
+
+  handleErrorResponse(error) {
+    //there is no response!
+    if (!error.response || !error.response.data) {
+      return;
+    } //if there is fields means we should handle them differently
+
+
+    if (error.response.data.error && error.response.data.error.fields && !this.notifier_handler_disabled) {
+      return this.handleInvalidFields(error);
+    }
+
+    return this.handleAfterResponseActions(error.response.data);
+  }
+
+  showAlert(response) {
+    //if there is no case or there is no msg, return early
+    if (!response || this.notifier_handler_disabled) {
+      return;
+    } //success response type 1
+    //todo::Drop this type
+    //todo:: ability to send sentry
+
+
+    if (response.case && response.msg) {
+      return salla.notify.fire(response.msg, response.case, response);
+    } //success response type 2
+
+
+    if (response.hasOwnProperty('success') && response.data?.message) {
+      return salla.notify.fire(response.data?.message, response.success ? salla.notify.types.success : salla.notify.types.error, response);
+    } //error response type 1
+
+
+    if (response.error && response.error.message && response.error.message !== 'FORBIDDEN') {
+      return salla.error(response.error.message, response);
+    }
+  }
+
+  handleInvalidFields(error) {
+    // let's collect fields errors & show them as one error list;
+    let errors = error.response.data.error.fields;
+    let errorsMsgs = [];
+    Object.keys(errors).forEach(errorName => {
+      let errorMsg = errors[errorName];
+
+      if (Array.isArray(errorMsg)) {
+        errorMsg.forEach(errorMsg_ => errorsMsgs.push(errorMsg_));
+      } else {
+        errorsMsgs.push(errorMsg);
+      }
+    });
+    let errorMsg = (errorsMsgs.length > 1 ? '* ' : '') + errorsMsgs.join("\n* ");
+    salla.error(errorMsg, error);
+  }
+
+  isFastRequestsAllowed() {
+    return Salla.config.get('fastRequests');
+  }
+
+  promise(data, isResolve = true) {
+    return new Promise((resolve, reject) => isResolve ? resolve(data) : reject(data));
+  }
+
+  errorPromise(data) {
+    return this.promise(data, false);
+  }
+
+  successPromise(data) {
+    return this.promise(data, true);
+  }
+  /**
+   * @deprecated don't use it.
+   * @param response
+   */
+
+
+  renderSections(response) {
+    if (!response.sections) {
+      return;
+    }
+
+    Object.keys(response.sections).forEach(section => {
+      document.querySelectorAll(section.toSelector()).forEach(function (sectionElement) {
+        sectionElement.innerHTML = response.sections[section];
+      });
+    });
+  }
+
+}
+
+/**
+ * @property {CartApi} cart
+ * @property {LoyaltyApi} Loyalty
+ * @property {AuthApi} auth
+ */
+
+class Api extends request {
+  constructor() {
+    super();
+    this.auth = new AuthApi();
+    this.cart = new CartApi();
+    this.loyalty = new LoyaltyApi();
+    this.order = new OrderApi();
+    this.rating = new RatingApi();
+    this.product = new ProductApi();
+    this.profile = new ProfileApi();
+    this.comment = new CommentApi();
+    this.currency = new CurrencyApi();
+    this.document = new DocumentApi();
+    this.wishlist = new WishlistApi();
+    this.scope = new ScopeApi();
+  }
+
+}
+
+class Init {
+  /**
+   * @param {TwilightConfig} config
+   */
+  constructor(config) {
+    if (!config) {
+      Salla__default["default"].event.dispatch('twilight::initiated', config);
+      return;
+    } // todo :: cleanup events before the merge
+
+
+    Salla__default["default"].config.merge(config);
+    config?.events && Salla__default["default"].event.dispatchEvents(config?.events);
+
+    if (config._token) {
+      salla.api.setHeader("X-CSRF-TOKEN", config._token);
+    }
+
+    this.injectMaintenanceAlert();
+    this.injectThemePreviewAlert();
+    this.injectEditAlert();
+
+    if (config?.user?.language_code) {
+      salla.lang.setLocale(config?.user?.language_code);
+    }
+
+    salla.lang.loadStoreTranslations();
+    Salla__default["default"].event.dispatch('twilight::initiated', config);
+  }
+
+  injectMaintenanceAlert() {
+    if (!salla.config.get('maintenance')) {
+      return;
+    }
+
+    if (document.querySelector('.store-notify')) {
+      salla.logger.warn('.store-notify element Existed before!');
+      return;
+    }
+
+    salla.lang.onLoaded(() => {
+      const alertElement = document.createElement('div');
+      alertElement.classList.add('store-notify');
+      alertElement.style = "background-color: #d63031; color: #fff; padding: 10px 15px; text-align: center; font-size: 17px;";
+      alertElement.innerHTML = `<p style="margin:0 !important;">${salla.lang.get('blocks.header.maintenance_alert')}</p>`;
+      document.body.prepend(alertElement);
+    });
+  }
+
+  injectThemePreviewAlert() {
+    if (salla.config.get('theme.mode') !== 'preview') {
+      return;
+    }
+
+    if (document.querySelector('#s-theme_preview_bar')) {
+      salla.logger.warn('#s-theme_preview_bar element Existed before!');
+      return;
+    }
+
+    salla.lang.onLoaded(() => {
+      let alertElement = document.createElement('div');
+      alertElement.id = 's-theme_preview_bar';
+      alertElement.setAttribute('style', 'display: flex; justify-content: space-between; text-align: center; background-color: #232323; color: #fff; padding: 10px; font-size: 0.875rem; line-height: 1.25rem; position: relative;');
+      alertElement.innerHTML = `
+              <div style="display:flex; align-items:center;">
+                <img width="32" src="https://assets.salla.sa/cp/assets/images/logo-new.png">
+                <span style="margin:0 10px;">${salla.lang.get('blocks.header.preview_mode')}: <span style="background:rgba(255,255,255,0.25);border-radius:15px; padding:2px 15px 4px">${salla.config.get('theme.name')}</span></span>
+              </div>
+              <a href="${salla.url.get('preview_theme/cancel/preview')}" style="line-height:32px; width:32px;"><i class="sicon-cancel"></i></a>
+            `;
+      document.body.prepend(alertElement);
+    });
+  }
+  /**
+   * @deprecated
+   */
+
+
+  injectEditAlert() {
+    let edit = salla.config.get('edit');
+
+    if (!edit) {
+      return;
+    }
+
+    if (document.querySelector('#s-edit-alert')) {
+      salla.logger.warn('#s-edit-alert element Existed before!');
+      return;
+    }
+
+    salla.lang.onLoaded(() => {
+      let alertElement = document.createElement('div');
+      alertElement.id = 's-edit-alert';
+      alertElement.innerHTML = `
+              <a href="${edit}" style="display:block; background-color:${salla.config.get('theme.color.primary', '#5cd5c4')}; color:${salla.config.get('theme.color.reverse', '#fff')}; padding: 10px; text-align:center; font-size: 0.875rem; line-height: 1.25rem;">
+                <i class="sicon-edit"></i> 
+                ${salla.lang.get('pages.products.quick_edit')}
+              </a>
+            `;
+      document.body.prepend(alertElement);
+    });
+  }
+  /**
+   * Link Action Of forms & links that have '.ajax' class.
+   *
+   * @param {Event} event
+   * @param {Element} element
+   */
+
+
+  handleElementAjaxRequest(event, element) {
+    if (!(element instanceof HTMLFormElement || element instanceof HTMLAnchorElement)) {
+      salla.logger.warn('trying to call ajax from non Element!!');
+      return false;
+    }
+
+    event.preventDefault(); // todo :: support async to allow for complex logic before the submit which take a time
+
+    let data = element.getAjaxFormData(event);
+    let method = data.method ? data.method.toLowerCase() : undefined;
+    salla.api.request(data.url, data.formData, method).then(response => {
+      //instead of passing all axios object, we will pass response data only
+      if (response.data && response.request) {
+        response = response.data;
+      }
+
+      salla.api.handleAfterResponseActions(response);
+      this.callAjaxEvent(data.events.success, response, data.formData);
+      return response;
+    }).catch(error => {
+      salla.api.handleErrorResponse(error);
+      this.callAjaxEvent(data.events.fail, error, data.formData);
+      throw error;
+    });
+  }
+
+  callAjaxEvent(event, response, formData) {
+    if (!event) {
+      return;
+    }
+
+    if (formData instanceof FormData) {
+      const parameters = {};
+      Array.from(formData.entries()).forEach(function (data) {
+        parameters[data[0]] = data[1];
+      });
+      formData = parameters;
+    }
+
+    if (window[event]) {
+      window[event](response, formData);
+      return;
+    }
+
+    salla.event.dispatch(event, response, formData);
+  }
+
+}
+
+Salla__default["default"].notify = Notify;
+Salla__default["default"].lang = new SallaLang();
+Salla__default["default"].form = new Form();
+Salla__default["default"].AppHelpers = AppHelpers;
+Salla__default["default"].infiniteScroll = new InfiniteScroll(undefined, salla.event.infiniteScroll);
+Salla__default["default"].api = new Api(); // alies access to the module have API & Event class
+
+Salla__default["default"].cart = new Module(Salla__default["default"].api.cart, Salla__default["default"].event.cart);
+Salla__default["default"].auth = new Module(Salla__default["default"].api.auth, Salla__default["default"].event.auth);
+Salla__default["default"].order = new Module(Salla__default["default"].api.order, Salla__default["default"].event.order);
+Salla__default["default"].scope = new Module(Salla__default["default"].api.scope, Salla__default["default"].event.scope);
+Salla__default["default"].rating = new Module(Salla__default["default"].api.rating, Salla__default["default"].event.rating);
+Salla__default["default"].comment = new Module(Salla__default["default"].api.comment, Salla__default["default"].event.comment);
+Salla__default["default"].loyalty = new Module(Salla__default["default"].api.loyalty, Salla__default["default"].event.loyalty);
+Salla__default["default"].product = new Module(Salla__default["default"].api.product, Salla__default["default"].event.product);
+Salla__default["default"].profile = new Module(Salla__default["default"].api.profile, Salla__default["default"].event.profile);
+Salla__default["default"].currency = new Module(Salla__default["default"].api.currency, Salla__default["default"].event.currency);
+Salla__default["default"].document = new Module(Salla__default["default"].api.document, Salla__default["default"].event.document);
+Salla__default["default"].wishlist = new Module(Salla__default["default"].api.wishlist, Salla__default["default"].event.wishlist);
+
+Salla__default["default"].call = action => {
+  let object = Salla__default["default"];
+  let arr = action.split('.');
+
+  while (arr.length && (object = object[arr.shift()]));
+
+  return object;
+}; // alias for quick access
+
+
+Salla__default["default"].init = config => new Init(config);
+
+salla.event.once('twilight::init', salla.init);
+Salla__default["default"].success = Salla__default["default"].notify.success;
+Salla__default["default"].error = Salla__default["default"].notify.error;
+Salla__default["default"].versions.twilight = '[VI]{version}[/VI]';
+Salla__default["default"].event.dispatch('twilight::ready');
+
+Salla__default["default"].onInitiated = callback => salla.event.once('twilight::initiated', callback);
+/**
+ * @deprecated use onInitiated
+ * @type {function(*): TwilightEmitter | Emitter | Listener}
+ */
+
+
+Salla__default["default"].onReady = Salla__default["default"].onInitiated;
+
+Object.defineProperty(exports, 'default', {
+    enumerable: true,
+    get: function () { return Salla__default["default"]; }
+});
 //# sourceMappingURL=index.js.map