@salla.sa/twilight-components
Version:
Salla Web Component
5 lines • 14.4 kB
JavaScript
/*!
* Crafted with ❤ by Salla
*/
import{r as registerInstance,h,H as Host,g as getElement}from"./index-114c614f.js";var sallaInstallmentCss='salla-installment:empty{display:none}#tabbyPromoWrapper{background:white;border-radius:0.375rem;-webkit-transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);margin-bottom:20px}.salla-y #tabbyPromoWrapper{border:1px solid var(--color-grey-dark);border-radius:12px}#tabbyPromoWrapper:hover{-webkit-box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922);box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}#tabbyPromoWrapper #tabbyPromo *{font-family:var(--font-main)}#tabbyPromoWrapper #tabbyPromo>div>div{max-width:none;-webkit-box-shadow:none;box-shadow:none;border:none}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet{max-width:100%;min-height:100px;padding:18px 20px;border:none !important}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__text,#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-size:var(--font-sm);color:var(--color-text) !important}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-weight:bold}.tabby-promo-wrapper #tabby-promo{font-family:var(--font-main) !important}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-title{font-size:var(--font-md)}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-desc{font-size:var(--font-sm);line-height:20px}.tamara-product-widget{margin-bottom:20px}.tamara-product-widget,.spotii-wrapper{min-height:100px;position:relative;color:var(--color-text);font-size:var(--font-sm);line-height:1.25;padding:18px 20px 18px 100px !important;background:white;border-radius:0.375rem;-webkit-transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1)}.salla-y .tamara-product-widget,.salla-y .spotii-wrapper{border-radius:12px;border:1px solid var(--color-grey-dark)}.tamara-product-widget:hover,.spotii-wrapper:hover{-webkit-box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922);box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}.tamara-product-widget .spotii-logo,.spotii-wrapper .spotii-logo{float:left;margin:0 0 0 -75px}.ltr .tamara-product-widget,.ltr .spotii-wrapper{text-align:left;padding:18px 100px 18px 20px !important}.ltr .tamara-product-widget .spotii-logo,.ltr .spotii-wrapper .spotii-logo{float:right;margin:0 -75px 0 0}.ltr .tamara-product-widget .spotii-product-widget,.ltr .spotii-wrapper .spotii-product-widget{text-align:left !important}.spotii-wrapper{margin-bottom:20px}.spotii-wrapper .spotii-promo{font-size:var(--font-md)}.spotii-wrapper .spotii-product-widget{font-size:var(--font-sm) !important;margin-top:10px}.tamara-product-widget .tamara-logo{position:absolute;left:20px;top:18px;margin:0 !important}.ltr .tamara-product-widget .tamara-logo{right:20px;left:auto}.tamara-product-widget span{font-family:var(--font-main);font-size:var(--font-sm);color:var(--color-text)}.tamara-product-widget span:last-child{display:block;position:relative;margin-top:8px}.tamara-popup__wrap{overflow:auto !important}.s-installment-mispay-wrapper,.s-installment-madfu-wrapper,.s-installment-emkan-wrapper{font-family:"Noto Sans Arabic", sans-serif;font-size:14px;text-align:right;padding:24px 20px 24px 0px;gap:42px;direction:rtl;line-height:22px;color:rgb(0, 0, 0);min-width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;background-color:white;border-radius:10px;border:1px solid var(--07--Light-Theme-Gray-color-gray-300, #EEE);margin:15px 0;display:-ms-flexbox;display:flex;-webkit-transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:-webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1)}.s-installment-mispay-wrapper:hover,.s-installment-madfu-wrapper:hover,.s-installment-emkan-wrapper:hover{-webkit-box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922);box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}.s-installment-mispay-content,.s-installment-madfu-content,.s-installment-emkan-content{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;margin:15px !important}.s-installment-mispay-content-text,.s-installment-madfu-content-text,.s-installment-emkan-content-text{color:#292929;margin:0 16px 0 0;width:80%;position:absolute;left:14px;text-align:left}.s-installment-mispay-content img,.s-installment-madfu-content img,.s-installment-emkan-content img{height:28px;width:70px;display:inline-block;max-height:100%;vertical-align:middle;fill:none;stroke:unset;width:auto;position:absolute}.rtl .s-installment-mispay-content-text,.rtl .s-installment-madfu-content-text,.rtl .s-installment-emkan-content-text{right:14px;text-align:right;margin:0 0 0 16px}.rtl .s-installment-mispay-content img,.rtl .s-installment-madfu-content img,.rtl .s-installment-emkan-content img{left:14px !important}.ltr .s-installment-mispay-content img,.ltr .s-installment-madfu-content img,.ltr .s-installment-emkan-content img{right:14px !important}.s-installment-rajehi{background:white;border-radius:0.375rem;padding:20px;margin-bottom:20px}.s-installment-rajehi__content{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;gap:1rem}.s-installment-rajehi img{width:80px}';var SallaInstallment=function(){function t(t){var e=this;registerInstance(this,t);this.tabbyBorderRemoved=false;this.tabbyRemoveBorderTries=0;this.price=undefined;this.language=salla.config.get("user.language_code");this.currency=salla.config.get("user.currency_code");this.country=salla.config.get("user.country_code");this.tabbyIsActive=undefined;this.spotiiIsActive=undefined;this.tamaraIsActive=undefined;this.mispayActive=undefined;this.emkanIsActive=undefined;this.madfuActive=undefined;this.rajehiIsActive=undefined;this.installment_sheria_text=function(t,e){return salla.lang.get(t,e)};salla.lang.onLoaded((function(){var t=[{key:"pages.products.installments",installments:3},{key:"pages.products.installments_emkan",installments:5}];t.forEach((function(t){e.installment_sheria_text(t.key,{payment:salla.money(parseFloat(e.price)),amount:salla.money((parseFloat(e.price)/t.installments).toFixed(2)).replace(/\.00$/,""),installments:t.installments})}));var a=salla.config.get("store.settings.installments");if(a){e.tamaraIsActive=a.tamara;e.tabbyIsActive=a.tabby;e.spotiiIsActive=a.spotii;e.mispayActive=a.mispay;e.emkanIsActive=a.emkan;e.madfuActive=a.madfu;e.rajehiIsActive=a.mokafaa_alrajhi}e.renderInstallments()}));salla.event.on("product::price.updated",(function(t){var a=t.data;if(!a.price||a.price==e.price){return}e.price=a.price;e.renderInstallments(true)}))}t.prototype.render=function(){var t;var e=this.currency==="SAR";if(!this.isValidPrice(this.price)){return""}return h(Host,null,this.tamaraIsActive&&(((t=this.tamaraIsActive)===null||t===void 0?void 0:t.publicKey)?h("div",{class:"mb-5"},h("tamara-widget",{type:"tamara-summary","inline-type":"2",amount:this.price})):h("div",{class:"tamara-product-widget","data-price":this.price,"data-currency":this.currency,"data-lang":this.language,"data-payment-type":"installment"})),this.tabbyIsActive?h("div",{id:"tabbyPromoWrapper"},h("div",{id:"tabbyPromo"})):"",this.spotiiIsActive?h("div",{class:"spotii-wrapper"},h("div",{class:"spotii-promo"})):"",this.shouldShowMispay()&&(this.mispayActive.publicKey?h("div",{class:"mb-5"},h("mispay-widget",{amount:this.price,lang:this.language})):h("div",{class:"s-installment-mispay-wrapper"},h("div",{class:"s-installment-mispay-content"},h("img",{src:salla.url.cdn("images/payment/png/mispay.png"),alt:"mispay"}),h("span",{class:"s-installment-mispay-content-text",innerHTML:this.installment_sheria_text("pages.products.installments",{payment:salla.money(parseFloat(this.price)),amount:salla.money((parseFloat(this.price)/4).toFixed(2)),installments:4})})))),this.emkanIsActive&&this.currency==="SAR"?h("div",{class:"s-installment-emkan-wrapper"},h("div",{class:"s-installment-emkan-content"},h("img",{src:salla.url.cdn("images/payment/png/emkan.png"),alt:"emkan"}),h("span",{class:"s-installment-emkan-content-text",innerHTML:this.installment_sheria_text("pages.products.installments_emkan",{payment:salla.money(parseFloat(this.price)),amount:salla.money((parseFloat(this.price)/5).toFixed(2)),installments:5})}))):"",this.madfuActive&&this.currency==="SAR"?h("div",{class:"s-installment-madfu-wrapper"},h("div",{class:"s-installment-madfu-content"},h("img",{src:salla.url.cdn("images/payment/png/madfu.png"),alt:"madfu"}),h("span",{class:"s-installment-madfu-content-text"},salla.lang.get("pages.products.installments_madfu")))):"",e&&this.rajehiIsActive?h("div",{class:"s-installment-rajehi"},h("div",{class:"s-installment-rajehi__content"},h("span",{class:"s-installment-rajehi-content-text"},salla.lang.get("pages.products.rajahi_earn_points",{points:Math.floor(+this.price*this.rajehiIsActive.pointsPerRiyal)})),h("img",{src:salla.url.cdn("images/payment/png/mokafaa_alrajhi_loyalty.png"),alt:"mokafaa_alrajhi_loyalty"}))):"")};t.prototype.renderInstallments=function(t){var e=this;if(t===void 0){t=false}if(!this.isValidPrice(this.price)){return}if(this.tamaraIsActive){this.loadTamara({isUpdating:t})}if(this.tabbyIsActive){if(t){var a=this.host.querySelector("#tabbyPromoWrapper");if(a){a.remove()}var i=document.createElement("div");i.setAttribute("id","tabbyPromoWrapper");var r=document.createElement("div");r.setAttribute("id","tabbyPromo");i.appendChild(r);this.host.appendChild(i);var s=document.querySelector('script[src="https://checkout.tabby.ai/tabby-promo.js"]');if(s){s.remove()}}var n=document.createElement("script");n.setAttribute("src","https://checkout.tabby.ai/tabby-promo.js");document.head.appendChild(n);n.onload=function(){var t=window.TabbyPromo;new t({selector:"#tabbyPromo",currency:e.currency,price:e.price,lang:e.language,publicKey:salla.config.get("store.settings.installments.tabby.publicKey"),merchantCode:salla.config.get("store.settings.installments.tabby.merchantCode")});document.querySelectorAll(".tabby-promo-snippet__logo").forEach((function(t){t.setAttribute("aria-label","Tabby Logo")}))};this.removeTabbyBorder()}if(this.spotiiIsActive){if(t){var o=this.host.querySelector(".spotii-wrapper");if(o){o.remove()}var l=document.createElement("div");l.classList.add("spotii-wrapper");var p=document.createElement("div");p.classList.add("spotii-promo");l.appendChild(p);this.host.appendChild(l);var m=document.querySelector('script[src="'+salla.url.cdn("js/price-widget-ar-salla.js")+'"]');if(m){m.remove()}}var c=salla.money((Number(this.price)/3).toFixed(2),false);var d=salla.config.get("theme.is_rtl",true);window.spotiiConfig={targetXPath:[".spotii-wrapper"],renderToPath:[".spotii-promo"],numberOfPayment:3,currency:this.currency,templateLine:"${textOne} ${number} ${textTwo} "+c+"${logo} ${info}",textOne:d?"جزء الدفع على":"Split it into",textTwo:d?"أقساط متساوية بدون تكاليف اضافية بقيمة":"payments of",textThree:"مع",price:this.price};var b=document.createElement("script");b.setAttribute("src",salla.url.cdn("js/price-widget-ar-salla.js"));document.head.appendChild(b)}if(this.shouldShowMispay()&&this.mispayActive.publicKey){this.loadExternalScript({position:"head",src:"https://widget.mispay.co/v1/sdk.js?authorize=".concat(this.mispayActive.publicKey)})}};t.prototype.isValidPrice=function(t){var e=/^\d+(\.\d{1,2})?$/;var a=e.test(t);var i=parseFloat(t)>0;return a&&i};t.prototype.loadExternalScript=function(t){var e=t.src,a=t.onLoad,i=t.position;var r=document.createElement("script");r.src=e;r.onload=a;document[i].appendChild(r)};t.prototype.loadTamara=function(t){var e=this;var a=t.isUpdating;var i,r;var s=!!((i=this.tamaraIsActive)===null||i===void 0?void 0:i.publicKey);if(a){setTimeout((function(){var t,e;if(s){return(t=window.TamaraWidgetV2)===null||t===void 0?void 0:t.refresh()}(e=window.TamaraProductWidget)===null||e===void 0?void 0:e.render()}),300)}else{if(s){var n=salla.config.get("user.language_code");var o=["ar","en"].includes(n)?n:"ar";var l=(r=this.currency)===null||r===void 0?void 0:r.slice(0,-1);var p=["SA","AE","KW","BH","OM","QA"].includes(l)?l:null;if(!p){console.error("Tamara: Country code is not supported",l)}else{window.tamaraWidgetConfig={lang:o,country:p,publicKey:this.tamaraIsActive.publicKey,style:{fontSize:"14px"}};this.loadExternalScript({position:"head",src:"https://cdn.tamara.co/widget-v2/tamara-widget.js"})}}else{this.loadExternalScript({position:"head",src:"https://cdn.tamara.co/widget/product-widget.min.js",onLoad:function(){window.TamaraProductWidget.init({lang:e.language});setTimeout((function(){window.TamaraProductWidget.render()}),300)}})}}};t.prototype.shouldShowMispay=function(){return this.currency==="SAR"&&this.mispayActive&&parseInt(this.price)>=200};t.prototype.removeTabbyBorder=function(){var t=this;if(this.tabbyBorderRemoved||this.tabbyRemoveBorderTries>5){return}this.tabbyRemoveBorderTries++;setTimeout((function(){var e=document.querySelector("#tabbyPromo>div>div");e=e?e.shadowRoot.querySelector('div[class^="styles__tabby-promo-snippet--"]'):null;if(e){e.style="border: none; margin: 15px 0!important;";t.tabbyBorderRemoved=true}else{t.removeTabbyBorder()}}),this.tabbyRemoveBorderTries*500)};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();SallaInstallment.style=sallaInstallmentCss;export{SallaInstallment as salla_installment};
//# sourceMappingURL=salla-installment.entry.js.map