@malga-checkout/core
Version:
Core components for Malga Checkout
1 lines • 6.01 kB
JavaScript
import{r as o,h as a,F as c,H as t}from"./p-626f6dad.js";import{Y as e}from"./p-da40223f.js";import{f as r}from"./p-b28f21d9.js";import"./p-14b3e604.js";import"./p-3e8ff66b.js";const l=class{constructor(t){o(this,t),this.fullWidth=!1,this.isLoading=!1,this.showDescription=!0,this.handleToggleShowDescription=()=>{this.showDescription=!this.showDescription},this.renderBody=()=>this.isLoading?a("div",{class:{"checkout-order-summary__loaders":!0}},a("checkout-loader",null)):this.showDescription&&this.products&&a(c,null,a("ul",{class:{"checkout-order-summary__products":!0},"aria-hidden":this.showDescription},this.renderProductList()),!!this.delivery&&a("div",{class:{"checkout-order-summary__delivery":!0}},a("checkout-typography",{color:"darkness",variation:"subtitle1",content:e("common.order.delivery",this.locale)}),a("checkout-typography",{tag:"span",variation:"body1",content:r(this.delivery,this.currency)}))),this.renderProductList=()=>this.products.map((o=>a("li",{class:{"checkout-order-summary__product-item":!0}},a("p",null,a("checkout-typography",{tag:"strong",variation:"subtitle1",content:o.name})," ",!!o.description&&a("checkout-typography",{tag:"span",variation:"body1",content:`- ${o.description}`})),a("checkout-typography",{tag:"span",variation:"body1",content:`x${o.quantity}`}),a("checkout-typography",{tag:"span",variation:"body1",content:r(o.amount,this.currency)}))))}render(){return a(t,{class:{"checkout-order-summary__container":!0,"checkout-order-summary__container--full-width":this.fullWidth}},a("header",{class:{"checkout-order-summary__header":!0}},a("h3",null,this.label),this.products&&a("button",{type:"button",onClick:this.handleToggleShowDescription},a("checkout-icon",{icon:this.showDescription?"eyeSlash":"eye"}))),this.renderBody(),!this.isLoading&&a("section",{class:{"checkout-order-summary__total":!0}},a("p",null,e("common.order.amount",this.locale)),a("p",null,r(this.amount,this.currency))))}};l.style='@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap"); :root{--malga-checkout-color-page-background:#eef2f6;--malga-checkout-color-brand-accent-light:#79DBD4;--malga-checkout-color-brand-accent-normal:#39BFAD;--malga-checkout-color-brand-clean:#C3F4EF;--malga-checkout-color-brand-light:#79DBD4;--malga-checkout-color-brand-normal:#39BFAD;--malga-checkout-color-brand-middle:#2FAC9B;--malga-checkout-color-brand-dark:#147F70;--malga-checkout-color-grey-light:#666666;--malga-checkout-color-grey-normal:#4D4D4D;--malga-checkout-color-grey-middle:#333333;--malga-checkout-color-grey-dark:#1A1A1A;--malga-checkout-color-grey-darkness:#000000;--malga-checkout-color-accent-light:#ffffff;--malga-checkout-color-accent-normal:#F1F1F1;--malga-checkout-color-accent-middle:#CBCBCB;--malga-checkout-color-warning-light:#FFF8E6;--malga-checkout-color-warning-normal:#F9DF8D;--malga-checkout-color-warning-middle:#FFA400;--malga-checkout-color-modal-success:#00AE42;--malga-checkout-color-modal-error:#ED3A3D;--malga-checkout-color-modal-neutral:#4D4D4D;--malga-checkout-color-modal-action-button-error:#000000;--malga-checkout-color-modal-action-button-error-hover:#333333;--malga-checkout-color-modal-action-button-success:#000000;--malga-checkout-color-modal-action-button-success-hover:#333333;--malga-checkout-color-modal-action-button-success-font-color:#ffffff;--malga-checkout-color-modal-action-button-error-font-color:#ffffff;--malga-checkout-typography-family:"Inter", sans-serif;--malga-checkout-spacing-xxs:4px;--malga-checkout-spacing-xs:8px;--malga-checkout-spacing-sm:16px;--malga-checkout-spacing-default:24px;--malga-checkout-spacing-md:32px;--malga-checkout-spacing-lg:48px;--malga-checkout-spacing-xlg:64px;--malga-checkout-spacing-xxlg:96px;--malga-checkout-size-min-width:250px;--malga-checkout-border-radius-default:4px;--malga-checkout-border-radius-md:6px;--malga-checkout-border-radius-lg:20px;--malga-checkout-transition-slow:0.3s;--malga-checkout-transition-default:0.5s}.checkout-order-summary__container{display:flex;flex-direction:column;padding:var(--malga-checkout-spacing-sm);border-radius:var(--malga-checkout-spacing-xs);background:var(--malga-checkout-color-accent-light);box-shadow:0px 0px 4px rgba(0, 0, 0, 0.1)}.checkout-order-summary__container--full-width{width:100%}.checkout-order-summary__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.checkout-order-summary__header>h3{padding:0;margin:0;font-family:var(--malga-checkout-typography-family);font-size:var(--malga-checkout-spacing-sm);font-weight:bold;color:var(--malga-checkout-color-brand-middle)}.checkout-order-summary__header>button{display:flex;justify-content:center;align-items:center;cursor:pointer;background:transparent;border:none;padding:0}.checkout-order-summary__header>button>checkout-icon>i>svg{color:var(--malga-checkout-color-brand-middle)}.checkout-order-summary__products{display:flex;flex-direction:column;padding:0;margin:0;margin-top:var(--malga-checkout-spacing-sm)}.checkout-order-summary__product-item{display:flex;flex-direction:row;justify-content:space-between;margin-top:var(--malga-checkout-spacing-xs)}.checkout-order-summary__product-item>p{padding:0;margin:0}.checkout-order-summary__product-item>checkout-typography>span{margin-left:var(--malga-checkout-spacing-default)}.checkout-order-summary__delivery{display:flex;flex-direction:row;justify-content:space-between;margin-top:var(--malga-checkout-spacing-default)}.checkout-order-summary__total{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding-top:calc( var(--malga-checkout-spacing-xs) + var(--malga-checkout-spacing-xxs) );margin-top:var(--malga-checkout-spacing-sm);border-top:1px solid black}.checkout-order-summary__total>p{font-family:var(--malga-checkout-typography-family);font-size:16px;font-weight:700;padding:0;margin:0}.checkout-order-summary__loaders{display:flex;justify-content:center;align-items:center;height:100px}';export{l as checkout_order_summary}