@zonos/elements 1.3.266 → 1.3.267

package/dist/zonos-elements/{p-f1bbad73.entry.js → p-a78bc004.entry.js}

@@ -1 +1 @@
-import{r as t,h as o,a as s,g as e,d as a}from"./p-ce75b047.js";import{f as n}from"./p-f3cfd8fa.js";import{c as i}from"./p-b4b7f705.js";import{g as r}from"./p-db3b101a.js";import{b as c,t as h}from"./p-1d6f3ab9.js";import{s as l}from"./p-0efd2d5a.js";import{l as p}from"./p-41dd1cb8.js";import{d,e as m}from"./p-cd88efdb.js";import{l as y}from"./p-0a377722.js";import"./p-d28be518.js";import"./p-6d81901a.js";import"./p-4c89d04a.js";const f=class{constructor(o){t(this,o),this.borderRadius=6,this.spacing="24px"}render(){const t=this.backgroundColor?`var(--zonos-elements-${this.backgroundColor})`:"transparent",e=r({customRoundRadius:`${this.borderRadius}px`,overrideBorderStyle:"ROUNDED"});return o(s,{key:"ae124207be3fbddbd445d74cdf31085401a09c67",style:{"--zonos--font-family":n()}},o("div",{key:"43fe2ffcb7caa0754c93f6d94898156f5169139b",class:i(["styled-card"]),style:{"--zonos--background-color":t,"--zonos--border-radius":e,padding:this.spacing}},this.label&&o("header",{key:"6839065e2e630a841d6ecd7f03b19a93a988e49a",class:"card-header",style:{padding:this.spacing}},o("zonos-text",{key:"498435bbbb60cc6d1d13a304aad321107bd6feaf",type:"subheader"},this.label),o("h-stack",{key:"4de3f042a72b16be374209b393cb174fc7d1b670",spacing:8},this.actions)),o("slot",{key:"add9dac3d8b9a50c0caa37d245f632c6a5e64d7f"}),(this.footerActions||this.footerContent)&&o("footer",{key:"e83f37ed24b44d9b7316579ee28ea51a3da119d8",class:"card-footer",style:{height:this.footerHeight?`${this.footerHeight}px`:"auto",padding:this.spacing}},o("div",{key:"685721d5f7f51c99438f4ddf23cf75122db3223c"},this.footerContent),o("h-stack",{key:"61a44c918aea4994c10b16045564b45135296852",spacing:8},this.footerActions))))}};f.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .styled-card{border:var(--zonos-elements-border);border-radius:var(--zonos--border-radius, var(--zonos-elements-radius-6));padding:var(--spacing, 24px);text-align:left;background-color:var(--zonos--background-color);overflow:hidden}:host .styled-card hr{margin-left:calc(var(--spacing, 24px) * -1);margin-right:calc(var(--spacing, 24px) * -1)}:host .styled-card .card-header{margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing, 24px);border-bottom:var(--zonos-elements-border);height:65px;line-height:65px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .styled-card .card-header h5{margin-bottom:0;-ms-flex:1;flex:1}:host .styled-card .card-footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);border-top:var(--zonos-elements-border);background:var(--zonos-elements-surface-color-secondary);margin-top:var(--spacing, 24px);border-bottom-left-radius:var(--zonos-elements-radius-8);border-bottom-right-radius:var(--zonos-elements-radius-8);height:var(--footerHeight)}";const z=class{constructor(o){t(this,o),this.theme="LIGHT"}render(){return this.el.shadowRoot?(this.el.shadowRoot.innerHTML="DARK"===this.theme?'<svg width="536" height="200" viewBox="0 0 536 200" fill="none" xmlns="http://www.w3.org/2000/svg">\n<mask id="mask0_3739_19124" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="536" height="200">\n<rect width="536" height="200" fill="url(#paint0_radial_3739_19124)"/>\n</mask>\n<g mask="url(#mask0_3739_19124)">\n<rect x="0.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="126.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="252.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="378.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="504.5" y="0.5" width="31" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect y="96" width="124" height="8" rx="4" fill="white" fill-opacity="0.08"/>\n<rect x="0.5" y="112.5" width="535" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="0.5" y="160.5" width="263" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="272.5" y="160.5" width="263" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n</g>\n<defs>\n<radialGradient id="paint0_radial_3739_19124" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(268 100) rotate(90) scale(100 268)">\n<stop offset="0.25" stop-color="white" stop-opacity="0"/>\n<stop offset="0.75" stop-color="white"/>\n</radialGradient>\n</defs>\n</svg>\n':'<svg width="536" height="200" viewBox="0 0 536 200" fill="none" xmlns="http://www.w3.org/2000/svg">\n<mask id="mask0_3739_19125" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="536" height="200">\n<rect width="536" height="200" fill="url(#paint0_radial_3739_19125)"/>\n</mask>\n<g mask="url(#mask0_3739_19125)">\n<rect x="0.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="126.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="252.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="378.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="504.5" y="0.5" width="31" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect y="96" width="124" height="8" rx="4" fill="black" fill-opacity="0.08"/>\n<rect x="0.5" y="112.5" width="535" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="0.5" y="160.5" width="263" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="272.5" y="160.5" width="263" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n</g>\n<defs>\n<radialGradient id="paint0_radial_3739_19125" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(268 100) rotate(90) scale(100 268)">\n<stop offset="0.25" stop-color="white" stop-opacity="0"/>\n<stop offset="0.75" stop-color="white"/>\n</radialGradient>\n</defs>\n</svg>\n',o(s,{class:"zonos--elements",style:{"--zonos--font-family":n(),"--zonos--height":"100%","--zonos--width":"100%"}},o("zonos-text",{type:"semiBoldLabel"},this.emptyStateText))):null}get el(){return e(this)}};z.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;position:relative}:host zonos-text{position:absolute;left:0;right:0;bottom:0;top:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host svg{width:var(--zonos--width);height:var(--zonos--height)}";const g=class{constructor(o){t(this,o),this.notificationArray=[]}async showNotification(t){const o=`id-${Math.random().toString(36).substring(2,9)}`,s=Object.assign(Object.assign({},t),{id:o,timeout:t.timeout||5e3,transitionClass:"",type:t.type||"success"});this.notificationArray=[...this.notificationArray,s],setTimeout((()=>{this.updateTransitionClass({id:o,transitionClass:"show"})}),50),setTimeout((()=>{this.removeNotification(o)}),s.timeout)}updateTransitionClass({id:t,transitionClass:o}){this.notificationArray=this.notificationArray.map((s=>s.id===t?Object.assign(Object.assign({},s),{transitionClass:o}):s))}removeNotification(t){this.updateTransitionClass({id:t,transitionClass:""}),setTimeout((()=>{this.notificationArray=this.notificationArray.filter((o=>o.id!==t))}),300)}render(){return o(s,{key:"6a790a39afc037ae56f8a53dc89c3fa899b2d659",class:i(["zonos--elements zonos--notification"]),style:{"--zonos--border-radius":r(),"--zonos--font-family":n()}},o("div",{key:"32245a784f2322fb69a65b491648a30a84b0b3d3",class:"zonos--notification-items"},this.notificationArray.map((t=>o("div",{"aria-hidden":"true",class:i(["zonos--notification-item",t.type,t.transitionClass]),key:t.id,onClick:()=>{this.removeNotification(t.id)}},o("zonos-text",{textColor:"gray-0"},t.message))))))}};g.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .zonos--notification-items{position:fixed;z-index:9999999999;bottom:24px;gap:8px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}:host .zonos--notification-item{cursor:pointer;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;padding:8px;border-radius:var(--zonos--border-radius, var(--zonos-elements-radius-6));opacity:0;-ms-flex-negative:0.0001;flex-shrink:0.0001;-webkit-transform:translateY(100%);transform:translateY(100%)}:host .zonos--notification-item+:host .zonos--notification-item{margin-top:8px}:host .zonos--notification-item.show{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-ms-flex-positive:1000;flex-grow:1000}:host .zonos--notification-item.success{background-color:var(--zonos-elements-green-700)}:host .zonos--notification-item.error{background-color:var(--zonos-elements-red-700)}:host .zonos--notification-item.warning{background-color:var(--zonos-elements-orange-700)}";const b=class{constructor(o){t(this,o),this.stripe=c.stripe,this.stripeElements=c.stripeElements,this.isPaymentInfoFilled=!1,this.trackingSent=!1}watchIsPaymentInfoFilled(){var t;this.isPaymentInfoFilled&&!this.trackingSent&&(h({checkoutSessionId:l.checkoutSessionId,eventName:"checkout_paymentInfoFilled",metadata:{paymentMethod:null===(t=c.stripePaymentEventData)||void 0===t?void 0:t.value.type}}),this.trackingSent=!0)}async watchInitStripe(){var t;if(!this.stripeElements)return;await this.stripeElements.fetchUpdates();const o=c.stripePaymentElement||this.stripeElements.create("payment",{defaultValues:{billingDetails:{address:{country:null===(t=c.stripeAddressEventData)||void 0===t?void 0:t.value.address.country}}},layout:"tabs"}),s=this.el.querySelector(".zonos--payment-component");s?(o.mount(s),o.on("change",(t=>{t.complete&&(this.isPaymentInfoFilled=!0),c.stripePaymentEventData=t})),c.stripePaymentElement=o):p("Cannot find container element for paymentElement")}componentDidLoad(){this.watchInitStripe()}render(){return o(s,{key:"6bc25553430c9e23c77a0607ad28dc4c9efa66e6",class:"zonos--payment zonos--elements"},this.titleText&&o("zonos-text",{key:"e4ba3f581697a799e50fe066e7cc922a206af8e5",class:"zonos--title",type:"semiBoldLabel"},this.titleText),o("div",{key:"0247eecadf083f09b67c5f668da845431234750d",class:"zonos--payment-component"}),o("div",{key:"7f63abd0a2c1cbc62f931e44fc44c69b57a4f8ed",class:"zonos--payment-paypal-container"}))}get el(){return e(this)}static get watchers(){return{isPaymentInfoFilled:["watchIsPaymentInfoFilled"],stripeElements:["watchInitStripe"],stripe:["watchInitStripe"]}}};b.style=".sc-zonos-payment-h{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-payment-h *.sc-zonos-payment{font-family:var(--zonos--font-family, Inter), Inter}.sc-zonos-payment-h img.sc-zonos-payment{max-width:100%}.sc-zonos-payment-h dl.sc-zonos-payment,.sc-zonos-payment-h dd.sc-zonos-payment,.sc-zonos-payment-h h1.sc-zonos-payment,.sc-zonos-payment-h h2.sc-zonos-payment,.sc-zonos-payment-h h3.sc-zonos-payment,.sc-zonos-payment-h h4.sc-zonos-payment,.sc-zonos-payment-h h5.sc-zonos-payment,.sc-zonos-payment-h h6.sc-zonos-payment,.sc-zonos-payment-h hr.sc-zonos-payment,.sc-zonos-payment-h figure.sc-zonos-payment,.sc-zonos-payment-h p.sc-zonos-payment,.sc-zonos-payment-h pre.sc-zonos-payment{margin:0}.sc-zonos-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-payment-h .zonos--title.sc-zonos-payment{margin-bottom:16px}.sc-zonos-payment-h .zonos--payment-component.sc-zonos-payment{margin-bottom:4px}";const x=class{constructor(o){t(this,o),this.paypalSessionDone=a(this,"paypalSessionDone",7),this.paypalSessionFail=a(this,"paypalSessionFail",7),this.storeUnsubscribeList=[]}async loadPaypal(){if(!window.Zonos.paypal)return void y("Paypal is not available");const t=d({onPaypalFail:()=>{y("onPaypalFail"),this.paypalSessionFail.emit()},onPaypalSessionDone:({orderId:t})=>{y("onPaypalSessionDone","info",{orderId:t}),this.paypalSessionDone.emit({orderId:t})}});if(!(null==t?void 0:t.length))return void y("There are no paypal buttons available");const o=this.el.querySelector(".zonos--payment-paypal-container");o?t.forEach((async t=>{await t.render(o)})):y("Cannot find container element for paypal buttons")}componentWillLoad(){this.storeUnsubscribeList=[m("paypal",this.loadPaypal.bind(this))]}componentDidLoad(){this.loadPaypal()}disconnectedCallback(){this.storeUnsubscribeList.forEach((t=>t()))}render(){return o(s,{key:"c01e031b29e0089389be2a16e888bd0b7c24dcd8",class:"zonos--paypal-payment zonos--elements"},o("div",{key:"f03c880bde17291f083cfe1f0db6a918f92d720b",class:"zonos--payment-paypal-container"}))}get el(){return e(this)}};x.style=".sc-zonos-paypal-payment-h{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-paypal-payment-h *.sc-zonos-paypal-payment{font-family:var(--zonos--font-family, Inter), Inter}.sc-zonos-paypal-payment-h img.sc-zonos-paypal-payment{max-width:100%}.sc-zonos-paypal-payment-h dl.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h dd.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h1.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h2.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h3.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h4.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h5.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h6.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h hr.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h figure.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h p.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h pre.sc-zonos-paypal-payment{margin:0}.sc-zonos-paypal-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-paypal-payment-h{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}";export{f as zonos_card,z as zonos_empty_state_payment,g as zonos_notification,b as zonos_payment,x as zonos_paypal_payment}
+import{r as t,h as o,a as s,g as e,d as a}from"./p-ce75b047.js";import{f as n}from"./p-f3cfd8fa.js";import{c as i}from"./p-b4b7f705.js";import{g as r}from"./p-db3b101a.js";import{b as c,t as h}from"./p-6987f9c9.js";import{s as l}from"./p-adb9827c.js";import{l as p}from"./p-41dd1cb8.js";import{d,e as m}from"./p-84dbf474.js";import{l as y}from"./p-0a377722.js";import"./p-d28be518.js";import"./p-6d81901a.js";import"./p-4c89d04a.js";const f=class{constructor(o){t(this,o),this.borderRadius=6,this.spacing="24px"}render(){const t=this.backgroundColor?`var(--zonos-elements-${this.backgroundColor})`:"transparent",e=r({customRoundRadius:`${this.borderRadius}px`,overrideBorderStyle:"ROUNDED"});return o(s,{key:"ae124207be3fbddbd445d74cdf31085401a09c67",style:{"--zonos--font-family":n()}},o("div",{key:"43fe2ffcb7caa0754c93f6d94898156f5169139b",class:i(["styled-card"]),style:{"--zonos--background-color":t,"--zonos--border-radius":e,padding:this.spacing}},this.label&&o("header",{key:"6839065e2e630a841d6ecd7f03b19a93a988e49a",class:"card-header",style:{padding:this.spacing}},o("zonos-text",{key:"498435bbbb60cc6d1d13a304aad321107bd6feaf",type:"subheader"},this.label),o("h-stack",{key:"4de3f042a72b16be374209b393cb174fc7d1b670",spacing:8},this.actions)),o("slot",{key:"add9dac3d8b9a50c0caa37d245f632c6a5e64d7f"}),(this.footerActions||this.footerContent)&&o("footer",{key:"e83f37ed24b44d9b7316579ee28ea51a3da119d8",class:"card-footer",style:{height:this.footerHeight?`${this.footerHeight}px`:"auto",padding:this.spacing}},o("div",{key:"685721d5f7f51c99438f4ddf23cf75122db3223c"},this.footerContent),o("h-stack",{key:"61a44c918aea4994c10b16045564b45135296852",spacing:8},this.footerActions))))}};f.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .styled-card{border:var(--zonos-elements-border);border-radius:var(--zonos--border-radius, var(--zonos-elements-radius-6));padding:var(--spacing, 24px);text-align:left;background-color:var(--zonos--background-color);overflow:hidden}:host .styled-card hr{margin-left:calc(var(--spacing, 24px) * -1);margin-right:calc(var(--spacing, 24px) * -1)}:host .styled-card .card-header{margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing, 24px);border-bottom:var(--zonos-elements-border);height:65px;line-height:65px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .styled-card .card-header h5{margin-bottom:0;-ms-flex:1;flex:1}:host .styled-card .card-footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);border-top:var(--zonos-elements-border);background:var(--zonos-elements-surface-color-secondary);margin-top:var(--spacing, 24px);border-bottom-left-radius:var(--zonos-elements-radius-8);border-bottom-right-radius:var(--zonos-elements-radius-8);height:var(--footerHeight)}";const z=class{constructor(o){t(this,o),this.theme="LIGHT"}render(){return this.el.shadowRoot?(this.el.shadowRoot.innerHTML="DARK"===this.theme?'<svg width="536" height="200" viewBox="0 0 536 200" fill="none" xmlns="http://www.w3.org/2000/svg">\n<mask id="mask0_3739_19124" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="536" height="200">\n<rect width="536" height="200" fill="url(#paint0_radial_3739_19124)"/>\n</mask>\n<g mask="url(#mask0_3739_19124)">\n<rect x="0.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="126.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="252.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="378.5" y="0.5" width="117" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="504.5" y="0.5" width="31" height="63" rx="9.5" stroke="white" stroke-opacity="0.08"/>\n<rect y="96" width="124" height="8" rx="4" fill="white" fill-opacity="0.08"/>\n<rect x="0.5" y="112.5" width="535" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="0.5" y="160.5" width="263" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n<rect x="272.5" y="160.5" width="263" height="39" rx="7.5" stroke="white" stroke-opacity="0.08"/>\n</g>\n<defs>\n<radialGradient id="paint0_radial_3739_19124" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(268 100) rotate(90) scale(100 268)">\n<stop offset="0.25" stop-color="white" stop-opacity="0"/>\n<stop offset="0.75" stop-color="white"/>\n</radialGradient>\n</defs>\n</svg>\n':'<svg width="536" height="200" viewBox="0 0 536 200" fill="none" xmlns="http://www.w3.org/2000/svg">\n<mask id="mask0_3739_19125" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="536" height="200">\n<rect width="536" height="200" fill="url(#paint0_radial_3739_19125)"/>\n</mask>\n<g mask="url(#mask0_3739_19125)">\n<rect x="0.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="126.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="252.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="378.5" y="0.5" width="117" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="504.5" y="0.5" width="31" height="63" rx="9.5" stroke="black" stroke-opacity="0.08"/>\n<rect y="96" width="124" height="8" rx="4" fill="black" fill-opacity="0.08"/>\n<rect x="0.5" y="112.5" width="535" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="0.5" y="160.5" width="263" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n<rect x="272.5" y="160.5" width="263" height="39" rx="7.5" stroke="black" stroke-opacity="0.08"/>\n</g>\n<defs>\n<radialGradient id="paint0_radial_3739_19125" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(268 100) rotate(90) scale(100 268)">\n<stop offset="0.25" stop-color="white" stop-opacity="0"/>\n<stop offset="0.75" stop-color="white"/>\n</radialGradient>\n</defs>\n</svg>\n',o(s,{class:"zonos--elements",style:{"--zonos--font-family":n(),"--zonos--height":"100%","--zonos--width":"100%"}},o("zonos-text",{type:"semiBoldLabel"},this.emptyStateText))):null}get el(){return e(this)}};z.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;position:relative}:host zonos-text{position:absolute;left:0;right:0;bottom:0;top:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host svg{width:var(--zonos--width);height:var(--zonos--height)}";const g=class{constructor(o){t(this,o),this.notificationArray=[]}async showNotification(t){const o=`id-${Math.random().toString(36).substring(2,9)}`,s=Object.assign(Object.assign({},t),{id:o,timeout:t.timeout||5e3,transitionClass:"",type:t.type||"success"});this.notificationArray=[...this.notificationArray,s],setTimeout((()=>{this.updateTransitionClass({id:o,transitionClass:"show"})}),50),setTimeout((()=>{this.removeNotification(o)}),s.timeout)}updateTransitionClass({id:t,transitionClass:o}){this.notificationArray=this.notificationArray.map((s=>s.id===t?Object.assign(Object.assign({},s),{transitionClass:o}):s))}removeNotification(t){this.updateTransitionClass({id:t,transitionClass:""}),setTimeout((()=>{this.notificationArray=this.notificationArray.filter((o=>o.id!==t))}),300)}render(){return o(s,{key:"6a790a39afc037ae56f8a53dc89c3fa899b2d659",class:i(["zonos--elements zonos--notification"]),style:{"--zonos--border-radius":r(),"--zonos--font-family":n()}},o("div",{key:"32245a784f2322fb69a65b491648a30a84b0b3d3",class:"zonos--notification-items"},this.notificationArray.map((t=>o("div",{"aria-hidden":"true",class:i(["zonos--notification-item",t.type,t.transitionClass]),key:t.id,onClick:()=>{this.removeNotification(t.id)}},o("zonos-text",{textColor:"gray-0"},t.message))))))}};g.style=":host{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--zonos--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .zonos--notification-items{position:fixed;z-index:9999999999;bottom:24px;gap:8px;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}:host .zonos--notification-item{cursor:pointer;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;padding:8px;border-radius:var(--zonos--border-radius, var(--zonos-elements-radius-6));opacity:0;-ms-flex-negative:0.0001;flex-shrink:0.0001;-webkit-transform:translateY(100%);transform:translateY(100%)}:host .zonos--notification-item+:host .zonos--notification-item{margin-top:8px}:host .zonos--notification-item.show{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-ms-flex-positive:1000;flex-grow:1000}:host .zonos--notification-item.success{background-color:var(--zonos-elements-green-700)}:host .zonos--notification-item.error{background-color:var(--zonos-elements-red-700)}:host .zonos--notification-item.warning{background-color:var(--zonos-elements-orange-700)}";const b=class{constructor(o){t(this,o),this.stripe=c.stripe,this.stripeElements=c.stripeElements,this.isPaymentInfoFilled=!1,this.trackingSent=!1}watchIsPaymentInfoFilled(){var t;this.isPaymentInfoFilled&&!this.trackingSent&&(h({checkoutSessionId:l.checkoutSessionId,eventName:"checkout_paymentInfoFilled",metadata:{paymentMethod:null===(t=c.stripePaymentEventData)||void 0===t?void 0:t.value.type}}),this.trackingSent=!0)}async watchInitStripe(){var t;if(!this.stripeElements)return;await this.stripeElements.fetchUpdates();const o=c.stripePaymentElement||this.stripeElements.create("payment",{defaultValues:{billingDetails:{address:{country:null===(t=c.stripeAddressEventData)||void 0===t?void 0:t.value.address.country}}},layout:"tabs"}),s=this.el.querySelector(".zonos--payment-component");s?(o.mount(s),o.on("change",(t=>{t.complete&&(this.isPaymentInfoFilled=!0),c.stripePaymentEventData=t})),c.stripePaymentElement=o):p("Cannot find container element for paymentElement")}componentDidLoad(){this.watchInitStripe()}render(){return o(s,{key:"6bc25553430c9e23c77a0607ad28dc4c9efa66e6",class:"zonos--payment zonos--elements"},this.titleText&&o("zonos-text",{key:"e4ba3f581697a799e50fe066e7cc922a206af8e5",class:"zonos--title",type:"semiBoldLabel"},this.titleText),o("div",{key:"0247eecadf083f09b67c5f668da845431234750d",class:"zonos--payment-component"}),o("div",{key:"7f63abd0a2c1cbc62f931e44fc44c69b57a4f8ed",class:"zonos--payment-paypal-container"}))}get el(){return e(this)}static get watchers(){return{isPaymentInfoFilled:["watchIsPaymentInfoFilled"],stripeElements:["watchInitStripe"],stripe:["watchInitStripe"]}}};b.style=".sc-zonos-payment-h{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-payment-h *.sc-zonos-payment{font-family:var(--zonos--font-family, Inter), Inter}.sc-zonos-payment-h img.sc-zonos-payment{max-width:100%}.sc-zonos-payment-h dl.sc-zonos-payment,.sc-zonos-payment-h dd.sc-zonos-payment,.sc-zonos-payment-h h1.sc-zonos-payment,.sc-zonos-payment-h h2.sc-zonos-payment,.sc-zonos-payment-h h3.sc-zonos-payment,.sc-zonos-payment-h h4.sc-zonos-payment,.sc-zonos-payment-h h5.sc-zonos-payment,.sc-zonos-payment-h h6.sc-zonos-payment,.sc-zonos-payment-h hr.sc-zonos-payment,.sc-zonos-payment-h figure.sc-zonos-payment,.sc-zonos-payment-h p.sc-zonos-payment,.sc-zonos-payment-h pre.sc-zonos-payment{margin:0}.sc-zonos-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-payment-h .zonos--title.sc-zonos-payment{margin-bottom:16px}.sc-zonos-payment-h .zonos--payment-component.sc-zonos-payment{margin-bottom:4px}";const x=class{constructor(o){t(this,o),this.paypalSessionDone=a(this,"paypalSessionDone",7),this.paypalSessionFail=a(this,"paypalSessionFail",7),this.storeUnsubscribeList=[]}async loadPaypal(){if(!window.Zonos.paypal)return void y("Paypal is not available");const t=d({onPaypalFail:()=>{y("onPaypalFail"),this.paypalSessionFail.emit()},onPaypalSessionDone:({orderId:t})=>{y("onPaypalSessionDone","info",{orderId:t}),this.paypalSessionDone.emit({orderId:t})}});if(!(null==t?void 0:t.length))return void y("There are no paypal buttons available");const o=this.el.querySelector(".zonos--payment-paypal-container");o?t.forEach((async t=>{await t.render(o)})):y("Cannot find container element for paypal buttons")}componentWillLoad(){this.storeUnsubscribeList=[m("paypal",this.loadPaypal.bind(this))]}componentDidLoad(){this.loadPaypal()}disconnectedCallback(){this.storeUnsubscribeList.forEach((t=>t()))}render(){return o(s,{key:"c01e031b29e0089389be2a16e888bd0b7c24dcd8",class:"zonos--paypal-payment zonos--elements"},o("div",{key:"f03c880bde17291f083cfe1f0db6a918f92d720b",class:"zonos--payment-paypal-container"}))}get el(){return e(this)}};x.style=".sc-zonos-paypal-payment-h{font-family:var(--zonos--font-family, Inter), Inter;display:block;white-space:normal}.sc-zonos-paypal-payment-h *.sc-zonos-paypal-payment{font-family:var(--zonos--font-family, Inter), Inter}.sc-zonos-paypal-payment-h img.sc-zonos-paypal-payment{max-width:100%}.sc-zonos-paypal-payment-h dl.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h dd.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h1.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h2.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h3.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h4.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h5.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h h6.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h hr.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h figure.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h p.sc-zonos-paypal-payment,.sc-zonos-paypal-payment-h pre.sc-zonos-paypal-payment{margin:0}.sc-zonos-paypal-payment-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-paypal-payment-h{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}";export{f as zonos_card,z as zonos_empty_state_payment,g as zonos_notification,b as zonos_payment,x as zonos_paypal_payment}