@foxy.io/elements 1.24.1-beta.1 → 1.25.0-beta.1

package/dist/cdn/foxy-tax-form.js

@@ -1 +1 @@
-import"./shared-799dc083.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-2edcd981.js";import"./shared-13fbea95.js";import"./shared-7abbc95c.js";import"./shared-ef7f2d07.js";import"./shared-9048eeb2.js";import{D as e}from"./shared-f21e5761.js";import{e as t,_ as i}from"./shared-4c2e9064.js";import{C as r}from"./shared-7723f756.js";import"./shared-601f27b1.js";import"./shared-621b3283.js";import{h as s}from"./shared-7f33a83a.js";import{T as a,S as n,a as o}from"./shared-3b709ddc.js";import"./shared-3c2414d4.js";import"./shared-bee111d6.js";import"./shared-eb8a0fdf.js";import"./shared-3f04e4cc.js";import"./shared-5784c088.js";import"./shared-099c1f57.js";import{M as d}from"./shared-4205699e.js";import{c as l}from"./shared-4e709717.js";import{C as h}from"./shared-5cf7b194.js";import{N as c}from"./shared-9b12aeac.js";import{i as _}from"./shared-d3bf9ac0.js";import{i as m}from"./shared-e8a51c60.js";import"./shared-b446c140.js";import"./shared-e5239bec.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-fff03a45.js";import"./shared-f5bbb1e0.js";import"./shared-6daeb197.js";import"./shared-11c2efc8.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";let u,p,y,g,f,v,$,b,x,S,T,E,j,k,O=e=>e;const C=["US","CA","AT","BE","BG","CY","CZ","DE","DK","EE","ES","FI","FR","GB","GR","HR","HU","IE","IM","IT","LT","LU","LV","MC","MT","NL","PL","PT","RO","SE","SI","SK"],w=[...C,"AU"],H=h(a(n(o(c,"tax-form"))));class A extends H{constructor(){var e;super(...arguments),e=this,this.templates={},this.__previousCountry=void 0,this.__countries="",this.__regions="",this.__countriesService=m(t.withConfig({services:{sendGet:async function(){const t=await new A.API(e).fetch(e.countries);if(!t.ok)throw new Error(await t.text());return await t.json()}}})),this.__regionsService=m(t.withConfig({services:{sendGet:async function(){var t;const i=new URL(e.regions);i.searchParams.set("country_code",null!==(t=e.form.country)&&void 0!==t?t:"US");const r=await new A.API(e).fetch(i.toString());if(!r.ok)throw new Error(await r.text());return await r.json()}}}))}static get scopedElements(){return{"vaadin-number-field":customElements.get("vaadin-number-field"),"vaadin-text-field":customElements.get("vaadin-text-field"),"vaadin-combo-box":customElements.get("vaadin-combo-box"),"vaadin-button":customElements.get("vaadin-button"),"foxy-internal-confirm-dialog":customElements.get("foxy-internal-confirm-dialog"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"x-metadata":d,"x-checkbox":r,"x-dropdown":e}}static get properties(){return i(i({},super.properties),{},{countries:{type:String,noAccessor:!0},regions:{type:String,noAccessor:!0}})}static get v8n(){return[({name:e})=>!!e||"name_required",({name:e})=>!e||e.length<=30||"name_too_long",({country:e,type:t})=>"country"!==t||!!e||"country_required",({country:e,type:t})=>"region"!==t||!!e||"country_required",({country:e,use_origin_rates:t})=>!t||!!e||"country_required",({country:e})=>!e||!!e.match(/[A-Z]{2}/)||"country_invalid",({region:e,type:t})=>"region"!=t||!!e||"region_required",({region:e})=>!e||e.length<=20||"region_too_long",({city:e})=>!e||e.length<=50||"city_too_long",({city:e,type:t})=>"local"!=t||!!e||"city_required",({rate:e})=>!e||e<=100||"rate_invalid"]}get countries(){return this.__countries}set countries(e){this.__countries=e,e?this.__countriesService.send({type:"FETCH"}):this.__countriesService.send({type:"SET_DATA",data:null})}get regions(){return this.__regions}set regions(e){this.__regions=e,e?this.__regionsService.send({type:"FETCH"}):this.__regionsService.send({type:"SET_DATA",data:null})}connectedCallback(){super.connectedCallback(),this.__countriesService.onTransition((({changed:e})=>e&&this.requestUpdate())),this.__countriesService.onChange((()=>this.requestUpdate())),this.__countriesService.start(),this.__regionsService.onTransition((({changed:e})=>e&&this.requestUpdate())),this.__regionsService.onChange((()=>this.requestUpdate())),this.__regionsService.start()}render(){var e,t;return s(u||(u=O` <div class="relative space-y-m"> ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} <div data-testid="spinner" class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.__isNameHidden?null:this.__renderName(),this.__isTypeHidden?null:this.__renderType(),this.__isCountryHidden?null:this.__renderCountry(),this.__isRegionHidden?null:this.__renderRegion(),this.__isCityHidden?null:this.__renderCity(),this.__isProviderHidden?null:this.__renderProvider(),this.__isRateHidden?null:this.__renderRate(),this.__isApplyToShippingHidden?null:this.__renderApplyToShipping(),this.__isUseOriginRatesHidden?null:this.__renderUseOriginRates(),this.__isExemptAllCustomerTaxIdsHidden?null:this.__renderExemptAllCustomerTaxIds(),this.__isTimestampsHidden?null:this.__renderTimestamps(),this.__isCreateHidden?null:this.__renderCreate(),this.__isDeleteHidden?null:this.__renderDelete(),l({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":this.in("idle")}),this.in("fail")?"error":this.in("busy")?"busy":"empty",this.lang,this.ns,null!==(t=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==t?t:"")}updated(e){super.updated(e),this.form.country!==this.__previousCountry&&(this.__previousCountry=this.form.country,this.__regionsService.send({type:"FETCH"})),this.renderRoot.querySelectorAll("vaadin-combo-box").forEach((e=>e.validate()))}disconnectedCallback(){super.disconnectedCallback(),this.__countriesService.stop(),this.__regionsService.stop()}get __isNameHidden(){return this.hiddenSelector.matches("name",!0)}get __isTypeHidden(){return this.hiddenSelector.matches("type",!0)}get __isCountryHidden(){return!!this.hiddenSelector.matches("country",!0)||("union"===this.form.type?!this.form.use_origin_rates:!["country","region","local"].includes(this.form.type))}get __isRegionHidden(){return!!this.hiddenSelector.matches("region",!0)||"local"!==this.form.type&&"region"!==this.form.type}get __isCityHidden(){return!!this.hiddenSelector.matches("city",!0)||"local"!==this.form.type}get __isProviderHidden(){return!!this.hiddenSelector.matches("provider",!0)||(!this.form.type||"global"===this.form.type||"local"===this.form.type)}get __isRateHidden(){return!!this.hiddenSelector.matches("rate",!0)||(!this.form.type||!0===this.form.is_live)}get __isApplyToShippingHidden(){return!!this.hiddenSelector.matches("apply-to-shipping",!0)||(void 0===this.form.type||!!this.form.is_live&&C.includes(this.form.country))}get __isUseOriginRatesHidden(){return!!this.hiddenSelector.matches("use-origin-rates",!0)||("union"!==this.form.type||!this.form.is_live||!!this.form.service_provider)}get __isExemptAllCustomerTaxIdsHidden(){if(this.hiddenSelector.matches("exempt-all-customer-tax-ids",!0))return!0;const e=this.form.service_provider;return void 0===e||"onesource"===e||"avalara"===e}get __isTimestampsHidden(){return!!this.hiddenSelector.matches("timestamps",!0)||!this.data}get __isCreateHidden(){return!!this.hiddenSelector.matches("create",!0)||!!this.data}get __isDeleteHidden(){return!!this.hiddenSelector.matches("delete",!0)||!this.data}__getErrorMessage(e){const t=this.errors.find((t=>t.startsWith(e)));return t?this.t(t.replace(e,"v8n")).toString():""}__getValidator(e){return()=>!this.errors.some((t=>t.startsWith(e)))}__renderName(){return s(p||(p=O` <div> ${0} <vaadin-text-field data-testid="name" class="w-full" label="${0}" value="${0}" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot("name:before"),this.t("name"),_(this.form.name),this.__getValidator("name"),this.__getErrorMessage("name"),!this.in("idle")||this.disabledSelector.matches("name",!0),this.readonlySelector.matches("name",!0),this.__submitOnEnter,(e=>{const t=e.currentTarget.value;this.edit({name:t})}),this.renderTemplateOrSlot("name:after"))}__renderType(){return this.form.type||this.edit({type:"global"}),s(y||(y=O` <div> ${0} <x-dropdown data-testid="type" label="${0}" value="${0}" class="w-full" .items="${0}" .getText="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> </x-dropdown> ${0} </div> `),this.renderTemplateOrSlot("type:before"),this.t("type"),_(this.form.type),["global","union","country","region","local"],(e=>this.t(`tax_${e}`)),!this.in("idle")||this.disabledSelector.matches("type",!0),this.readonlySelector.matches("type",!0),(e=>{this.edit({type:e.detail,country:"",region:"",city:"",service_provider:"",apply_to_shipping:!1,use_origin_rates:!1,exempt_all_customer_tax_ids:!1,is_live:!1,rate:0})}),this.renderTemplateOrSlot("type:after"))}__renderCountry(){var e;const t=this.__countriesService.state.matches("busy"),i=this.in("busy"),r=t||i,a=this.in("fail"),n=this.__countriesService.state.context.data,o=Object.values(null!==(e=null==n?void 0:n.values)&&void 0!==e?e:{});return s(g||(g=O` <div> ${0} <vaadin-combo-box item-value-path="cc2" item-label-path="default" item-id-path="cc2" data-testid="country" label="${0}${0}" value="${0}" class="w-full" .checkValidity="${0}" .errorMessage="${0}" .items="${0}" ?allow-custom-value="${0}" ?disabled="${0}" ?readonly="${0}" required @change="${0}"> </vaadin-combo-box> ${0} </div> `),this.renderTemplateOrSlot("country:before"),this.t("country"),t?` • ${this.t("loading_busy")}`:"",_(t?void 0:this.form.country),this.__getValidator("country"),this.__getErrorMessage("country"),o,0===o.length,a||r||this.disabledSelector.matches("country",!0),this.readonlySelector.matches("country",!0),(e=>{this.edit({country:e.currentTarget.value,region:"",city:"",is_live:!1,service_provider:""}),this.__isApplyToShippingHidden&&this.edit({apply_to_shipping:!1}),this.__regionsService.send({type:"FETCH"})}),this.renderTemplateOrSlot("country:after"))}__renderRegion(){var e;const t=this.__regionsService.state.matches("busy"),i=this.in("busy"),r=t||i,a=this.in("fail"),n=this.__regionsService.state.context.data,o=Object.values(null!==(e=null==n?void 0:n.values)&&void 0!==e?e:{});return s(f||(f=O` <div> ${0} <vaadin-combo-box item-value-path="code" item-label-path="default" item-id-path="code" data-testid="region" label="${0}${0}" value="${0}" class="w-full" .checkValidity="${0}" .errorMessage="${0}" .items="${0}" ?allow-custom-value="${0}" ?disabled="${0}" ?readonly="${0}" required @change="${0}"> </vaadin-combo-box> ${0} </div> `),this.renderTemplateOrSlot("region:before"),this.t("region"),t?` • ${this.t("loading_busy")}`:"",_(t?void 0:this.form.region),this.__getValidator("region"),this.__getErrorMessage("region"),o,0===o.length,a||r||this.disabledSelector.matches("region",!0),this.readonlySelector.matches("region",!0),(e=>{const t=e.currentTarget.value;this.edit({region:t,city:""})}),this.renderTemplateOrSlot("region:after"))}__renderCity(){return s(v||(v=O` <div> ${0} <vaadin-text-field data-testid="city" class="w-full" label="${0}" value="${0}" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot("city:before"),this.t("city"),_(this.form.city),this.__getValidator("city"),this.__getErrorMessage("city"),!this.in("idle")||this.disabledSelector.matches("city",!0),this.readonlySelector.matches("city",!0),this.__submitOnEnter,(e=>{const t=e.currentTarget.value;this.edit({city:t})}),this.renderTemplateOrSlot("city:after"))}__renderProvider(){const e=[{label:this.t("tax_rate_provider_none"),value:"none"},{label:"Avalara AvaTax 15",value:"avalara"},{label:"Thomson Reuters ONESOURCE",value:"onesource"}];return("union"===this.form.type||C.includes(this.form.country))&&e.push({label:this.t("tax_rate_provider_default"),value:"default"}),w.includes(this.form.country)&&e.push({label:"TaxJar",value:"taxjar"}),s($||($=O` <div> ${0} <x-dropdown data-testid="provider" label="${0}" value="${0}" class="w-full" .items="${0}" .getText="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> </x-dropdown> ${0} </div> `),this.renderTemplateOrSlot("provider:before"),this.t("tax_rate_provider"),this.form.service_provider||(this.form.is_live?"default":"none"),e.map((e=>e.value)),(t=>{var i;return null===(i=e.find((e=>e.value===t)))||void 0===i?void 0:i.label}),!this.in("idle")||this.disabledSelector.matches("provider",!0),this.readonlySelector.matches("provider",!0),(e=>{const t=e.detail,i=["none","default"].includes(t)?"":t;this.edit({service_provider:i,is_live:"none"!==t}),this.__isExemptAllCustomerTaxIdsHidden&&this.edit({exempt_all_customer_tax_ids:!1}),this.__isApplyToShippingHidden&&this.edit({apply_to_shipping:!1}),this.__isUseOriginRatesHidden&&this.edit({use_origin_rates:!1})}),this.renderTemplateOrSlot("provider:after"))}__renderRate(){return s(b||(b=O` <div> ${0} <vaadin-number-field data-testid="rate" class="w-full" label="${0}" value="${0}" min="0" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @change="${0}"> </vaadin-number-field> ${0} </div> `),this.renderTemplateOrSlot("rate:before"),this.t("tax_rate"),_(this.form.rate),this.__getValidator("rate"),this.__getErrorMessage("rate"),!this.in("idle")||this.disabledSelector.matches("rate",!0),this.readonlySelector.matches("rate",!0),this.__submitOnEnter,(e=>{const t=parseFloat(e.currentTarget.value);isNaN(t)||this.edit({rate:t})}),this.renderTemplateOrSlot("rate:after"))}__renderApplyToShipping(){return s(x||(x=O` <div> ${0} <x-checkbox data-testid="apply-to-shipping" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_apply_to_shipping" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_apply_to_shipping_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot("apply-to-shipping:before"),!this.in("idle")||this.disabledSelector.matches("apply-to-shipping",!0),this.readonlySelector.matches("apply-to-shipping",!0),!!this.form.apply_to_shipping,(e=>this.edit({apply_to_shipping:e.detail})),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot("apply-to-shipping:after"))}__renderUseOriginRates(){return s(S||(S=O` <div> ${0} <x-checkbox data-testid="use-origin-rates" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_use_origin_rates" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_use_origin_rates_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot("use-origin-rates:before"),!this.in("idle")||this.disabledSelector.matches("use-origin-rates",!0),this.readonlySelector.matches("use-origin-rates",!0),!!this.form.use_origin_rates,(e=>this.edit({use_origin_rates:e.detail})),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot("use-origin-rates:after"))}__renderExemptAllCustomerTaxIds(){const e="exempt-all-customer-tax-ids";return s(T||(T=O` <div> ${0} <x-checkbox data-testid="${0}" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_exempt_all_customer_tax_ids" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_exempt_all_customer_tax_ids_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),e,!this.in("idle")||this.disabledSelector.matches(e,!0),this.readonlySelector.matches(e,!0),!!this.form.exempt_all_customer_tax_ids,(e=>{this.edit({exempt_all_customer_tax_ids:e.detail})}),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot(`${e}:after`))}__renderTimestamps(){return s(E||(E=O` <div> ${0} <x-metadata data-testid="timestamps" .items="${0}"> </x-metadata> ${0} </div> `),this.renderTemplateOrSlot("timestamps:before"),["date_modified","date_created"].map((e=>{var t;return{name:this.t(e),value:(null===(t=this.data)||void 0===t?void 0:t[e])?this.t("date",{value:new Date(this.data[e])}):""}})),this.renderTemplateOrSlot("timestamps:after"))}__renderCreate(){const e=this.in({idle:{template:{clean:"invalid"}}}),t=this.in({idle:{template:{dirty:"invalid"}}}),i=this.in({idle:{snapshot:{clean:"invalid"}}}),r=this.in({idle:{snapshot:{dirty:"invalid"}}}),a=e||t||(i||r),n=this.in("idle");return s(j||(j=O` <div> ${0} <vaadin-button data-testid="create" class="w-full" theme="primary success" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="create" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.renderTemplateOrSlot("create:before"),!n||a||this.disabledSelector.matches("create",!0),this.submit,this.ns,this.lang,this.renderTemplateOrSlot("create:after"))}__renderDelete(){return s(k||(k=O` <div> <foxy-internal-confirm-dialog data-testid="confirm" message="delete_prompt" confirm="delete" cancel="cancel" header="delete" theme="primary error" lang="${0}" ns="${0}" id="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> ${0} <vaadin-button data-testid="delete" theme="error" class="w-full" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="delete" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.lang,this.ns,(e=>!e.detail.cancelled&&this.delete()),this.renderTemplateOrSlot("delete:before"),!this.in("idle")||this.disabledSelector.matches("delete",!0),(e=>{this.renderRoot.querySelector("#confirm").show(e.currentTarget)}),this.ns,this.lang,this.renderTemplateOrSlot("delete:after"))}__submitOnEnter(e){"Enter"===e.key&&this.submit()}}customElements.define("foxy-tax-form",A);export{A as TaxForm};
+import"./shared-4e05dfb4.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-51a5af7e.js";import"./shared-c00049b2.js";import"./shared-7d933f9d.js";import"./shared-96215749.js";import"./shared-732bee4b.js";import{D as e}from"./shared-e2db3ab5.js";import{e as t,_ as i}from"./shared-4c2e9064.js";import{C as r}from"./shared-5d795aaf.js";import"./shared-5742a841.js";import"./shared-8c681381.js";import{h as s}from"./shared-7f33a83a.js";import{T as a,S as n,a as o}from"./shared-662c576b.js";import"./shared-fc99076a.js";import"./shared-1dbad347.js";import"./shared-e3096241.js";import"./shared-e60dc924.js";import"./shared-fe927c53.js";import"./shared-6e704d83.js";import{M as d}from"./shared-fed6cd4d.js";import{c as l}from"./shared-4e709717.js";import{C as h}from"./shared-5cf7b194.js";import{N as c}from"./shared-9b12aeac.js";import{i as _}from"./shared-d3bf9ac0.js";import{i as m}from"./shared-e8a51c60.js";import"./shared-417ab233.js";import"./shared-f3b8de28.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-71b3559f.js";import"./shared-7b771301.js";import"./shared-53d66db2.js";import"./shared-11c2efc8.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";let u,p,y,g,v,f,$,b,x,S,T,E,j,k,O=e=>e;const C=["US","CA","AT","BE","BG","CY","CZ","DE","DK","EE","ES","FI","FR","GB","GR","HR","HU","IE","IM","IT","LT","LU","LV","MC","MT","NL","PL","PT","RO","SE","SI","SK"],w=[...C,"AU"],H=h(a(n(o(c,"tax-form"))));class A extends H{constructor(){var e;super(...arguments),e=this,this.templates={},this.__previousCountry=void 0,this.__countries="",this.__regions="",this.__countriesService=m(t.withConfig({services:{sendGet:async function(){const t=await new A.API(e).fetch(e.countries);if(!t.ok)throw new Error(await t.text());return await t.json()}}})),this.__regionsService=m(t.withConfig({services:{sendGet:async function(){var t;const i=new URL(e.regions);i.searchParams.set("country_code",null!==(t=e.form.country)&&void 0!==t?t:"US");const r=await new A.API(e).fetch(i.toString());if(!r.ok)throw new Error(await r.text());return await r.json()}}}))}static get scopedElements(){return{"vaadin-number-field":customElements.get("vaadin-number-field"),"vaadin-text-field":customElements.get("vaadin-text-field"),"vaadin-combo-box":customElements.get("vaadin-combo-box"),"vaadin-button":customElements.get("vaadin-button"),"foxy-internal-confirm-dialog":customElements.get("foxy-internal-confirm-dialog"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"x-metadata":d,"x-checkbox":r,"x-dropdown":e}}static get properties(){return i(i({},super.properties),{},{countries:{type:String,noAccessor:!0},regions:{type:String,noAccessor:!0}})}static get v8n(){return[({name:e})=>!!e||"name_required",({name:e})=>!e||e.length<=30||"name_too_long",({country:e,type:t})=>"country"!==t||!!e||"country_required",({country:e,type:t})=>"region"!==t||!!e||"country_required",({country:e,use_origin_rates:t})=>!t||!!e||"country_required",({country:e})=>!e||!!e.match(/[A-Z]{2}/)||"country_invalid",({region:e,type:t})=>"region"!=t||!!e||"region_required",({region:e})=>!e||e.length<=20||"region_too_long",({city:e})=>!e||e.length<=50||"city_too_long",({city:e,type:t})=>"local"!=t||!!e||"city_required",({rate:e})=>!e||e<=100||"rate_invalid"]}get countries(){return this.__countries}set countries(e){this.__countries=e,e?this.__countriesService.send({type:"FETCH"}):this.__countriesService.send({type:"SET_DATA",data:null})}get regions(){return this.__regions}set regions(e){this.__regions=e,e?this.__regionsService.send({type:"FETCH"}):this.__regionsService.send({type:"SET_DATA",data:null})}connectedCallback(){super.connectedCallback(),this.__countriesService.onTransition((({changed:e})=>e&&this.requestUpdate())),this.__countriesService.onChange((()=>this.requestUpdate())),this.__countriesService.start(),this.__regionsService.onTransition((({changed:e})=>e&&this.requestUpdate())),this.__regionsService.onChange((()=>this.requestUpdate())),this.__regionsService.start()}render(){var e,t;return s(u||(u=O` <div class="relative space-y-m"> ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} <div data-testid="spinner" class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.__isNameHidden?null:this.__renderName(),this.__isTypeHidden?null:this.__renderType(),this.__isCountryHidden?null:this.__renderCountry(),this.__isRegionHidden?null:this.__renderRegion(),this.__isCityHidden?null:this.__renderCity(),this.__isProviderHidden?null:this.__renderProvider(),this.__isRateHidden?null:this.__renderRate(),this.__isApplyToShippingHidden?null:this.__renderApplyToShipping(),this.__isUseOriginRatesHidden?null:this.__renderUseOriginRates(),this.__isExemptAllCustomerTaxIdsHidden?null:this.__renderExemptAllCustomerTaxIds(),this.__isTimestampsHidden?null:this.__renderTimestamps(),this.__isCreateHidden?null:this.__renderCreate(),this.__isDeleteHidden?null:this.__renderDelete(),l({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":this.in("idle")}),this.in("fail")?"error":this.in("busy")?"busy":"empty",this.lang,this.ns,null!==(t=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==t?t:"")}updated(e){super.updated(e),this.form.country!==this.__previousCountry&&(this.__previousCountry=this.form.country,this.__regionsService.send({type:"FETCH"})),this.renderRoot.querySelectorAll("vaadin-combo-box").forEach((e=>e.validate()))}disconnectedCallback(){super.disconnectedCallback(),this.__countriesService.stop(),this.__regionsService.stop()}get __isNameHidden(){return this.hiddenSelector.matches("name",!0)}get __isTypeHidden(){return this.hiddenSelector.matches("type",!0)}get __isCountryHidden(){return!!this.hiddenSelector.matches("country",!0)||("union"===this.form.type?!this.form.use_origin_rates:!["country","region","local"].includes(this.form.type))}get __isRegionHidden(){return!!this.hiddenSelector.matches("region",!0)||"local"!==this.form.type&&"region"!==this.form.type}get __isCityHidden(){return!!this.hiddenSelector.matches("city",!0)||"local"!==this.form.type}get __isProviderHidden(){return!!this.hiddenSelector.matches("provider",!0)||(!this.form.type||"global"===this.form.type||"local"===this.form.type)}get __isRateHidden(){return!!this.hiddenSelector.matches("rate",!0)||(!this.form.type||!0===this.form.is_live)}get __isApplyToShippingHidden(){return!!this.hiddenSelector.matches("apply-to-shipping",!0)||(void 0===this.form.type||!!this.form.is_live&&C.includes(this.form.country))}get __isUseOriginRatesHidden(){return!!this.hiddenSelector.matches("use-origin-rates",!0)||("union"!==this.form.type||!this.form.is_live||!!this.form.service_provider)}get __isExemptAllCustomerTaxIdsHidden(){if(this.hiddenSelector.matches("exempt-all-customer-tax-ids",!0))return!0;const e=this.form.service_provider;return void 0===e||"onesource"===e||"avalara"===e}get __isTimestampsHidden(){return!!this.hiddenSelector.matches("timestamps",!0)||!this.data}get __isCreateHidden(){return!!this.hiddenSelector.matches("create",!0)||!!this.data}get __isDeleteHidden(){return!!this.hiddenSelector.matches("delete",!0)||!this.data}__getErrorMessage(e){const t=this.errors.find((t=>t.startsWith(e)));return t?this.t(t.replace(e,"v8n")).toString():""}__getValidator(e){return()=>!this.errors.some((t=>t.startsWith(e)))}__renderName(){return s(p||(p=O` <div> ${0} <vaadin-text-field data-testid="name" class="w-full" label="${0}" value="${0}" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot("name:before"),this.t("name"),_(this.form.name),this.__getValidator("name"),this.__getErrorMessage("name"),!this.in("idle")||this.disabledSelector.matches("name",!0),this.readonlySelector.matches("name",!0),this.__submitOnEnter,(e=>{const t=e.currentTarget.value;this.edit({name:t})}),this.renderTemplateOrSlot("name:after"))}__renderType(){return this.form.type||this.edit({type:"global"}),s(y||(y=O` <div> ${0} <x-dropdown data-testid="type" label="${0}" value="${0}" class="w-full" .items="${0}" .getText="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> </x-dropdown> ${0} </div> `),this.renderTemplateOrSlot("type:before"),this.t("type"),_(this.form.type),["global","union","country","region","local"],(e=>this.t(`tax_${e}`)),!this.in("idle")||this.disabledSelector.matches("type",!0),this.readonlySelector.matches("type",!0),(e=>{this.edit({type:e.detail,country:"",region:"",city:"",service_provider:"",apply_to_shipping:!1,use_origin_rates:!1,exempt_all_customer_tax_ids:!1,is_live:!1,rate:0})}),this.renderTemplateOrSlot("type:after"))}__renderCountry(){var e;const t=this.__countriesService.state.matches("busy"),i=this.in("busy"),r=t||i,a=this.in("fail"),n=this.__countriesService.state.context.data,o=Object.values(null!==(e=null==n?void 0:n.values)&&void 0!==e?e:{});return s(g||(g=O` <div> ${0} <vaadin-combo-box item-value-path="cc2" item-label-path="default" item-id-path="cc2" data-testid="country" label="${0}${0}" value="${0}" class="w-full" .checkValidity="${0}" .errorMessage="${0}" .items="${0}" ?allow-custom-value="${0}" ?disabled="${0}" ?readonly="${0}" required @change="${0}"> </vaadin-combo-box> ${0} </div> `),this.renderTemplateOrSlot("country:before"),this.t("country"),t?` • ${this.t("loading_busy")}`:"",_(t?void 0:this.form.country),this.__getValidator("country"),this.__getErrorMessage("country"),o,0===o.length,a||r||this.disabledSelector.matches("country",!0),this.readonlySelector.matches("country",!0),(e=>{this.edit({country:e.currentTarget.value,region:"",city:"",is_live:!1,service_provider:""}),this.__isApplyToShippingHidden&&this.edit({apply_to_shipping:!1}),this.__regionsService.send({type:"FETCH"})}),this.renderTemplateOrSlot("country:after"))}__renderRegion(){var e;const t=this.__regionsService.state.matches("busy"),i=this.in("busy"),r=t||i,a=this.in("fail"),n=this.__regionsService.state.context.data,o=Object.values(null!==(e=null==n?void 0:n.values)&&void 0!==e?e:{});return s(v||(v=O` <div> ${0} <vaadin-combo-box item-value-path="code" item-label-path="default" item-id-path="code" data-testid="region" label="${0}${0}" value="${0}" class="w-full" .checkValidity="${0}" .errorMessage="${0}" .items="${0}" ?allow-custom-value="${0}" ?disabled="${0}" ?readonly="${0}" required @change="${0}"> </vaadin-combo-box> ${0} </div> `),this.renderTemplateOrSlot("region:before"),this.t("region"),t?` • ${this.t("loading_busy")}`:"",_(t?void 0:this.form.region),this.__getValidator("region"),this.__getErrorMessage("region"),o,0===o.length,a||r||this.disabledSelector.matches("region",!0),this.readonlySelector.matches("region",!0),(e=>{const t=e.currentTarget.value;this.edit({region:t,city:""})}),this.renderTemplateOrSlot("region:after"))}__renderCity(){return s(f||(f=O` <div> ${0} <vaadin-text-field data-testid="city" class="w-full" label="${0}" value="${0}" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot("city:before"),this.t("city"),_(this.form.city),this.__getValidator("city"),this.__getErrorMessage("city"),!this.in("idle")||this.disabledSelector.matches("city",!0),this.readonlySelector.matches("city",!0),this.__submitOnEnter,(e=>{const t=e.currentTarget.value;this.edit({city:t})}),this.renderTemplateOrSlot("city:after"))}__renderProvider(){const e=[{label:this.t("tax_rate_provider_none"),value:"none"},{label:"Avalara AvaTax 15",value:"avalara"},{label:"Thomson Reuters ONESOURCE",value:"onesource"}];return("union"===this.form.type||C.includes(this.form.country))&&e.push({label:this.t("tax_rate_provider_default"),value:"default"}),w.includes(this.form.country)&&e.push({label:"TaxJar",value:"taxjar"}),s($||($=O` <div> ${0} <x-dropdown data-testid="provider" label="${0}" value="${0}" class="w-full" .items="${0}" .getText="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> </x-dropdown> ${0} </div> `),this.renderTemplateOrSlot("provider:before"),this.t("tax_rate_provider"),this.form.service_provider||(this.form.is_live?"default":"none"),e.map((e=>e.value)),(t=>{var i;return null===(i=e.find((e=>e.value===t)))||void 0===i?void 0:i.label}),!this.in("idle")||this.disabledSelector.matches("provider",!0),this.readonlySelector.matches("provider",!0),(e=>{const t=e.detail,i=["none","default"].includes(t)?"":t;this.edit({service_provider:i,is_live:"none"!==t}),this.__isExemptAllCustomerTaxIdsHidden&&this.edit({exempt_all_customer_tax_ids:!1}),this.__isApplyToShippingHidden&&this.edit({apply_to_shipping:!1}),this.__isUseOriginRatesHidden&&this.edit({use_origin_rates:!1})}),this.renderTemplateOrSlot("provider:after"))}__renderRate(){return s(b||(b=O` <div> ${0} <vaadin-number-field data-testid="rate" class="w-full" label="${0}" value="${0}" min="0" .checkValidity="${0}" .errorMessage="${0}" ?disabled="${0}" ?readonly="${0}" required @keydown="${0}" @change="${0}"> </vaadin-number-field> ${0} </div> `),this.renderTemplateOrSlot("rate:before"),this.t("tax_rate"),_(this.form.rate),this.__getValidator("rate"),this.__getErrorMessage("rate"),!this.in("idle")||this.disabledSelector.matches("rate",!0),this.readonlySelector.matches("rate",!0),this.__submitOnEnter,(e=>{const t=parseFloat(e.currentTarget.value);isNaN(t)||this.edit({rate:t})}),this.renderTemplateOrSlot("rate:after"))}__renderApplyToShipping(){return s(x||(x=O` <div> ${0} <x-checkbox data-testid="apply-to-shipping" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_apply_to_shipping" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_apply_to_shipping_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot("apply-to-shipping:before"),!this.in("idle")||this.disabledSelector.matches("apply-to-shipping",!0),this.readonlySelector.matches("apply-to-shipping",!0),!!this.form.apply_to_shipping,(e=>this.edit({apply_to_shipping:e.detail})),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot("apply-to-shipping:after"))}__renderUseOriginRates(){return s(S||(S=O` <div> ${0} <x-checkbox data-testid="use-origin-rates" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_use_origin_rates" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_use_origin_rates_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot("use-origin-rates:before"),!this.in("idle")||this.disabledSelector.matches("use-origin-rates",!0),this.readonlySelector.matches("use-origin-rates",!0),!!this.form.use_origin_rates,(e=>this.edit({use_origin_rates:e.detail})),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot("use-origin-rates:after"))}__renderExemptAllCustomerTaxIds(){const e="exempt-all-customer-tax-ids";return s(T||(T=O` <div> ${0} <x-checkbox data-testid="${0}" class="leading-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="block text-m text-body" lang="${0}" key="tax_exempt_all_customer_tax_ids" ns="${0}"> </foxy-i18n> <foxy-i18n class="block text-s text-secondary" lang="${0}" key="tax_exempt_all_customer_tax_ids_explainer" ns="${0}"> </foxy-i18n> </x-checkbox> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),e,!this.in("idle")||this.disabledSelector.matches(e,!0),this.readonlySelector.matches(e,!0),!!this.form.exempt_all_customer_tax_ids,(e=>{this.edit({exempt_all_customer_tax_ids:e.detail})}),this.lang,this.ns,this.lang,this.ns,this.renderTemplateOrSlot(`${e}:after`))}__renderTimestamps(){return s(E||(E=O` <div> ${0} <x-metadata data-testid="timestamps" .items="${0}"> </x-metadata> ${0} </div> `),this.renderTemplateOrSlot("timestamps:before"),["date_modified","date_created"].map((e=>{var t;return{name:this.t(e),value:(null===(t=this.data)||void 0===t?void 0:t[e])?this.t("date",{value:new Date(this.data[e])}):""}})),this.renderTemplateOrSlot("timestamps:after"))}__renderCreate(){const e=this.in({idle:{template:{clean:"invalid"}}}),t=this.in({idle:{template:{dirty:"invalid"}}}),i=this.in({idle:{snapshot:{clean:"invalid"}}}),r=this.in({idle:{snapshot:{dirty:"invalid"}}}),a=e||t||(i||r),n=this.in("idle");return s(j||(j=O` <div> ${0} <vaadin-button data-testid="create" class="w-full" theme="primary success" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="create" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.renderTemplateOrSlot("create:before"),!n||a||this.disabledSelector.matches("create",!0),this.submit,this.ns,this.lang,this.renderTemplateOrSlot("create:after"))}__renderDelete(){return s(k||(k=O` <div> <foxy-internal-confirm-dialog data-testid="confirm" message="delete_prompt" confirm="delete" cancel="cancel" header="delete" theme="primary error" lang="${0}" ns="${0}" id="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> ${0} <vaadin-button data-testid="delete" theme="error" class="w-full" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="delete" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.lang,this.ns,(e=>!e.detail.cancelled&&this.delete()),this.renderTemplateOrSlot("delete:before"),!this.in("idle")||this.disabledSelector.matches("delete",!0),(e=>{this.renderRoot.querySelector("#confirm").show(e.currentTarget)}),this.ns,this.lang,this.renderTemplateOrSlot("delete:after"))}__submitOnEnter(e){"Enter"===e.key&&this.submit()}}customElements.define("foxy-tax-form",A);export{A as TaxForm};

package/dist/cdn/foxy-template-config-form.js

@@ -1 +1 @@
-import"./shared-b446c140.js";import"./shared-5784c088.js";import"./shared-7abbc95c.js";import"./shared-f29acc38.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-2edcd981.js";import{_ as e}from"./shared-4c2e9064.js";import{l as t}from"./shared-d7be11de.js";import{C as s,a as i}from"./shared-601f27b1.js";import{h as o}from"./shared-7f33a83a.js";import{C as n}from"./shared-7723f756.js";import{C as a}from"./shared-5cf7b194.js";import{N as r}from"./shared-9b12aeac.js";import{T as l,a as d,S as c,R as u}from"./shared-3b709ddc.js";import{c as h}from"./shared-4e709717.js";import{i as g}from"./shared-d3bf9ac0.js";import{G as p}from"./shared-d1f5de89.js";import{l as f}from"./shared-f3b35364.js";import"./shared-e5239bec.js";import"./shared-eb8a0fdf.js";import"./shared-3f04e4cc.js";import"./shared-ff7fd5fa.js";import"./shared-ba93be6b.js";import"./shared-fd96bcd1.js";import"./shared-d519a301.js";import"./shared-343d1fd7.js";import"./shared-099c1f57.js";import"./shared-13fbea95.js";import"./shared-3c2414d4.js";import"./shared-6daeb197.js";import"./shared-bee111d6.js";import"./shared-ef7f2d07.js";import"./shared-fff03a45.js";import"./shared-11c2efc8.js";import"./shared-e8a51c60.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";let y,_,x,b,m,$=e=>e;const v=a(l(d(r)));class k extends v{constructor(){super(...arguments),this.regions=[],this.name="",this.code="",this.__newRegion=""}static get properties(){return e(e({},super.properties),{},{__newRegion:{attribute:!1},regions:{type:Array},name:{type:String},code:{type:String}})}render(){var e,t;return o(y||(y=$` <div class="${0}"> <div data-testid="country" class="h-m flex justify-between items-center border-b border-contrast-10"> <div class="ml-m"> <span>${0}</span> ${0} </div> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m"></iron-icon> </button> </div> <div data-testid="regions" class="flex flex-wrap p-xs"> ${0} <div data-testid="new-region" style="border-radius:var(--lumo-size-s)" class="${0}"> <input placeholder="${0}" class="bg-transparent appearance-none h-s text-s px-s focus-outline-none" style="width:8rem" list="list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <button style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> <datalist id="list"> ${0} </datalist> </div> </div> `),h({"border border-contrast-10 rounded text-s":!0,"text-disabled":this.disabled}),this.name||this.code,this.name?o(_||(_=$`<span class="text-secondary">${0}</span>`),this.code):"",this.t("delete"),h({"mr-xs items-center justify-center rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!this.disabled,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!this.disabled,"cursor-default":this.disabled,flex:!this.readonly,hidden:this.readonly}),this.disabled,(()=>this.dispatchEvent(new CustomEvent("delete"))),this.regions.map((e=>{var t,s;const i=null===(s=null===(t=this.data)||void 0===t?void 0:t.values[e])||void 0===s?void 0:s.default;return o(x||(x=$` <div class="flex items-center border border-contrast-10 h-s m-xs" style="border-radius:var(--lumo-size-s)"> <span class="mx-s"> <span>${0}</span> ${0} </span> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m"></iron-icon> </button> </div> `),i||e,i?o(b||(b=$`<span class="text-secondary">${0}</span>`),e):"",this.t("delete"),h({"items-center justify-center rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!this.disabled,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!this.disabled,"cursor-default":this.disabled,flex:!this.readonly,hidden:this.readonly}),this.disabled,(()=>{this.regions=this.regions.filter((t=>t!==e)),this.dispatchEvent(new CustomEvent("update:regions"))}))})),h({"h-s m-xs items-center transition-colors border border-contrast-10":!0,"hover-border-contrast-40":!this.disabled,"focus-within-ring-1 ring-primary-50 focus-within-border-primary-50":!this.disabled,flex:!this.readonly,hidden:this.readonly}),this.t("add_region"),this.__newRegion,this.disabled,this.readonly,(e=>{"Enter"===e.key&&this.__newRegion&&this.__addRegion()}),(e=>{const t=e.currentTarget;this.__newRegion=t.value}),h({"flex-shrink-0":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":!this.__newRegion,"bg-success-10 text-success cursor-pointer":!!this.__newRegion,"hover-bg-success hover-text-success-contrast":!!this.__newRegion,"focus-outline-none focus-ring-2 ring-inset ring-success-50":!!this.__newRegion}),this.disabled||!this.__newRegion,this.__addRegion,Object.values(null!==(t=null===(e=this.data)||void 0===e?void 0:e.values)&&void 0!==t?t:{}).map((e=>o(m||(m=$`<option value="${0}">${0}</option>`),e.code,e.default))))}__addRegion(){this.regions=[...new Set([...this.regions,this.__newRegion])],this.__newRegion="",this.dispatchEvent(new CustomEvent("update:regions"))}}let w,S,j,O=e=>e;const q=c(a(l(d(r))));class T extends q{constructor(){super(...arguments),this.countries={},this.regions="",this.__newCountry=""}static get scopedElements(){return{"x-country-card":k,"iron-icon":customElements.get("iron-icon")}}static get properties(){return e(e({},super.properties),{},{__newCountry:{attribute:!1},countries:{type:Object},regions:{type:String}})}render(){var t,s;return o(w||(w=O` <div> <div class="space-y-s" data-testid="countries"> ${0} <div data-testid="new-country" class="${0}"> <input placeholder="${0}" class="w-full bg-transparent appearance-none h-m text-s px-m focus-outline-none" list="list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> </div> <datalist id="list"> ${0} </datalist> </div> `),Object.entries(this.countries).map((([t,s])=>{var i,n;let a;try{const e=new URL(this.regions);e.searchParams.set("country_code",t),a=e.toString()}catch(e){a=""}return o(S||(S=O` <x-country-card regions="${0}" code="${0}" name="${0}" href="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" @update:regions="${0}" @delete="${0}"> </x-country-card> `),JSON.stringify("*"===s?[]:s),t,g(null===(n=null===(i=this.data)||void 0===i?void 0:i.values[t])||void 0===n?void 0:n.default),a,this.lang,this.ns,this.disabled,this.readonly,(s=>{const i=e({},this.countries),o=s.currentTarget.regions;i[t]=o.length?o:"*",this.countries=i,this.dispatchEvent(new CustomEvent("update:countries"))}),(()=>{const s=e({},this.countries);delete s[t],this.countries=s,this.dispatchEvent(new CustomEvent("update:countries"))}))})),h({"h-m flex items-center rounded transition-colors":!0,"border border-contrast-10 ring-primary-50":!0,"hover-border-contrast-40":!this.disabled,"focus-within-ring-1 focus-within-border-primary-50":!this.disabled,flex:!this.readonly,hidden:this.readonly}),this.t("add_country"),this.__newCountry,this.disabled,this.readonly,(e=>{"Enter"===e.key&&this.__newCountry&&this.__addCountry()}),(e=>{const t=e.currentTarget;this.__newCountry=t.value}),this.t("create"),h({"mr-xs flex-shrink-0":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":!this.__newCountry,"bg-success-10 text-success cursor-pointer":!!this.__newCountry,"hover-bg-success hover-text-success-contrast":!!this.__newCountry,"focus-outline-none focus-ring-2 ring-inset ring-success-50":!!this.__newCountry}),!this.__newCountry||this.disabled,this.__addCountry,Object.entries(null!==(s=null===(t=this.data)||void 0===t?void 0:t.values)&&void 0!==s?s:{}).map((([e,t])=>o(j||(j=O`<option value="${0}">${0}</option>`),e,t.default))))}__addCountry(){this.countries=e(e({},this.countries),{},{[this.__newCountry]:"*"}),this.__newCountry="",this.dispatchEvent(new CustomEvent("update:countries"))}}let J,N,C,E,F,V,R,H,I,z,A,D,G,L,U,B,P,M,W,K,Q,X,Y,Z=e=>e;const ee=c(u(a(l(d(r,"template-config-form")))));class te extends ee{constructor(){super(...arguments),this.templates={},this.countries="",this.regions="",this.__addHiddenFieldInputValue=""}static get scopedElements(){return{"vaadin-text-field":customElements.get("vaadin-text-field"),"iron-icon":customElements.get("iron-icon"),"foxy-internal-source-control":customElements.get("foxy-internal-source-control"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"x-countries-list":T,"x-checkbox":n,"x-choice":s,"x-group":p}}static get properties(){return e(e({},super.properties),{},{__addHiddenFieldInputValue:{attribute:!1},countries:{type:String},regions:{type:String}})}render(){var e,t;const s=this.hiddenSelector,i=this.form.json?JSON.parse(this.form.json):{cart_type:"default",checkout_type:"default_account",csc_requirements:"all_cards",tos_checkbox_settings:{usage:"none",initial_state:"unchecked",is_hidden:!1,url:""},eu_secure_data_transfer_consent:{usage:"required"},newsletter_subscribe:{usage:"none"},analytics_config:{usage:"none",google_analytics:{usage:"none",account_id:"",include_on_site:!1},google_tag:{usage:"none",send_to:"",account_id:""}},colors:{usage:"none",primary:"4D4D4D",secondary:"FFFFFF",tertiary:"FFFFFF"},use_checkout_confirmation_window:{usage:"none"},supported_payment_cards:["visa","mastercard","discover","amex"],custom_checkout_field_requirements:{cart_controls:"enabled",coupon_entry:"enabled",billing_first_name:"required",billing_last_name:"required",billing_company:"optional",billing_tax_id:"hidden",billing_phone:"optional",billing_address1:"required",billing_address2:"optional",billing_city:"required",billing_region:"default",billing_postal_code:"required",billing_country:"required"},cart_display_config:{usage:"none",show_product_weight:!0,show_product_category:!0,show_product_code:!0,show_product_options:!0,show_sub_frequency:!0,show_sub_startdate:!0,show_sub_nextdate:!0,show_sub_enddate:!0,hidden_product_options:[]},foxycomplete:{usage:"required",show_combobox:!0,combobox_open:"\\u25bc",combobox_close:"\\u25b2",show_flags:!0},custom_script_values:{header:"",footer:"",checkout_fields:"",multiship_checkout_fields:""},http_receipt:!1,custom_config:"",debug:{usage:"none"},location_filtering:{usage:"none",shipping_filter_type:"blacklist",billing_filter_type:"blacklist",shipping_filter_values:{},billing_filter_values:{}},postal_code_lookup:{usage:"enabled"}};return o(J||(J=Z` <div class="relative" aria-busy="${0}" aria-live="polite"> <div class="space-y-l"> ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} <foxy-internal-source-control data-testid="custom-config" helper-text="${0}" placeholder='{ "key": "value" }' label="${0}" infer="custom-config" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="header" placeholder="<style>h1 { color: red }</style>" helper-text="${0}" label="${0}" infer="header" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="custom-fields" placeholder='<label>Comment: <input name="comment"></label>' helper-text="${0}" label="${0}" infer="custom-fields" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="footer" placeholder='<script src="https://example.com/code.js"></script>' helper-text="${0}" label="${0}" infer="footer" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> </div> <div class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.in("busy"),s.matches("cart-type",!0)?"":this.__renderCartType(i),s.matches("foxycomplete",!0)?"":this.__renderFoxycomplete(i),s.matches("locations",!0)?"":this.__renderLocations(i),s.matches("hidden-fields",!0)?"":this.__renderHiddenFields(i),s.matches("cards",!0)?"":this.__renderCards(i),s.matches("checkout-type",!0)?"":this.__renderCheckoutType(i),s.matches("consent",!0)?"":this.__renderConsent(i),s.matches("fields",!0)?"":this.__renderFields(i),s.matches("google-analytics",!0)?"":this.__renderGoogleAnalytics(i),s.matches("google-tag",!0)?"":this.__renderGoogleTag(i),s.matches("troubleshooting",!0)?"":this.__renderTroubleshooting(i),this.t("custom_config_helper_text"),this.t("custom_config"),(()=>"string"==typeof i.custom_config?i.custom_config:JSON.stringify(i.custom_config,null,2)),(e=>{try{i.custom_config=JSON.parse(e)}catch(t){i.custom_config=e}this.edit({json:JSON.stringify(i)})}),this.t("custom_header_helper_text"),this.t("custom_header"),(()=>i.custom_script_values.header),(e=>{i.custom_script_values.header=e,this.edit({json:JSON.stringify(i)})}),this.t("custom_fields_helper_text"),this.t("custom_fields"),(()=>i.custom_script_values.checkout_fields),(e=>{i.custom_script_values.checkout_fields=e,this.edit({json:JSON.stringify(i)})}),this.t("custom_footer_helper_text"),this.t("custom_footer"),(()=>i.custom_script_values.footer),(e=>{i.custom_script_values.footer=e,this.edit({json:JSON.stringify(i)})}),h({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":this.in("idle")}),this.in("fail")?"error":"busy",this.lang,this.ns,null!==(t=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==t?t:"")}__renderCartType(t){const{lang:s,ns:i}=this,n=["default","fullpage","custom"],a=!this.in("idle")||this.disabledSelector.matches("cart-type",!0);return o(N||(N=Z` <div data-testid="cart-type"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="cart_type" ns="${0}"> </foxy-i18n> <x-choice data-testid="cart-type-choice" .value="${0}" .items="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} </x-choice> </x-group> ${0} </div> `),this.renderTemplateOrSlot("cart-type:before"),a?"text-disabled":"",s,i,t.cart_type,n,a,this.readonlySelector.matches("cart-type",!0),(s=>{this.edit({json:JSON.stringify(e(e({},t),{},{cart_type:s.detail}))})}),n.map((e=>o(C||(C=Z` <div slot="${0}-label" class="grid leading-s py-s"> <foxy-i18n lang="${0}" key="cart_type_${0}" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs ${0}" lang="${0}" key="cart_type_${0}_explainer" ns="${0}"> </foxy-i18n> </div> `),e,s,e,i,a?"text-disabled":"text-secondary",s,e,i))),this.renderTemplateOrSlot("cart-type:after"))}__renderFoxycomplete(e){const{lang:t,ns:s}=this,n=!this.in("idle")||this.disabledSelector.matches("foxycomplete",!0),a=this.readonlySelector.matches("foxycomplete",!0),r=e.foxycomplete,l=["combobox","search","disabled"],d="none"===r.usage?"disabled":r.show_combobox?"combobox":"search",c=o(E||(E=Z` <x-checkbox data-testid="foxycomplete-flags-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n lang="${0}" key="show_country_flags" ns="${0}"></foxy-i18n> </x-checkbox> `),n,a,r.show_flags,(t=>{r.show_flags=t.detail,this.edit({json:JSON.stringify(e)})}),t,s);return o(F||(F=Z` <div data-testid="foxycomplete"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="foxycomplete" ns="${0}"> </foxy-i18n> <x-choice data-testid="foxycomplete-choice" .value="${0}" .items="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} <div slot="combobox" class="space-y-m pb-s" ?hidden="${0}"> <div class="grid grid-cols-2 gap-m" style="max-width:16rem"> ${0} </div> ${0} </div> <div slot="search" class="pb-s" ?hidden="${0}">${0}</div> </x-choice> <div class="border-t border-contrast-10 p-m"> <x-checkbox data-testid="foxycomplete-lookup-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n lang="${0}" key="enable_postcode_lookup" ns="${0}"></foxy-i18n> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("foxycomplete:before"),n?"text-disabled":"",t,s,d,l,n,a,(t=>{t instanceof i&&(r.usage="disabled"===t.detail?"none":"required",r.show_combobox="combobox"===t.detail,this.edit({json:JSON.stringify(e)}))}),l.map((e=>o(V||(V=Z` <div slot="${0}-label" class="grid leading-s py-s"> <foxy-i18n lang="${0}" key="foxycomplete_${0}" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs ${0}" lang="${0}" key="foxycomplete_${0}_explainer" ns="${0}"> </foxy-i18n> </div> `),e,t,e,s,n?"text-disabled":"text-secondary",t,e,s))),"combobox"!==d,["open","close"].map((t=>{const s="open"===t?"combobox_open":"combobox_close";return o(R||(R=Z` <vaadin-text-field data-testid="foxycomplete-${0}-icon" style="--lumo-border-radius:var(--lumo-border-radius-s)" label="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> `),t,this.t(`${t}_icon`),r[s],n,a,(e=>"Enter"===e.key&&this.submit()),(t=>{r[s]=t.currentTarget.value,this.edit({json:JSON.stringify(e)})}))})),c,"search"!==d,c,n,a,"enabled"===e.postal_code_lookup.usage,(t=>{e.postal_code_lookup.usage=t.detail?"enabled":"none",this.edit({json:JSON.stringify(e)})}),t,s,this.renderTemplateOrSlot("foxycomplete:after"))}__renderLocations(e){const{lang:t,ns:s}=this,i=e.location_filtering,n=!this.in("idle")||this.disabledSelector.matches("locations",!0),a=this.readonlySelector.matches("locations",!0),r="blacklist"===i.shipping_filter_type?"block":"allow",l="both"===i.usage?"copy":"blacklist"===i.billing_filter_type?"block":"allow",d=()=>{if("both"===i.usage)i.billing_filter_type=i.shipping_filter_type,i.billing_filter_values=i.shipping_filter_values;else{const e=Object.keys(i.billing_filter_values).length>0,t=Object.keys(i.shipping_filter_values).length>0;i.usage=e||t?e&&!t?"billing":t&&!e?"shipping":"independent":"none"}};return o(H||(H=Z` <div data-testid="locations"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="location_plural" ns="${0}"> </foxy-i18n> <div class="grid sm-grid-cols-2 bg-contrast-10" style="gap:1px"> <x-group class="bg-base pt-m"> <foxy-i18n class="${0}" slot="header" lang="${0}" key="shipping" ns="${0}"> </foxy-i18n> <x-choice data-testid="locations-shipping-choice" .items="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> <foxy-i18n slot="allow-label" lang="${0}" key="allowlist" ns="${0}"></foxy-i18n> <foxy-i18n slot="block-label" lang="${0}" key="blocklist" ns="${0}"></foxy-i18n> <x-countries-list data-testid="locations-shipping-list" countries="${0}" regions="${0}" class="mb-m" href="${0}" slot="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" @update:countries="${0}"> </x-countries-list> </x-choice> </x-group> <x-group class="bg-base pt-m"> <foxy-i18n class="${0}" slot="header" lang="${0}" key="billing" ns="${0}"> </foxy-i18n> <x-choice data-testid="locations-billing-choice" .items="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> <foxy-i18n slot="allow-label" lang="${0}" key="allowlist" ns="${0}"></foxy-i18n> <foxy-i18n slot="block-label" lang="${0}" key="blocklist" ns="${0}"></foxy-i18n> <foxy-i18n slot="copy-label" lang="${0}" key="same_as_shipping" ns="${0}"> </foxy-i18n> <x-countries-list data-testid="locations-billing-list" countries="${0}" regions="${0}" class="mb-m" href="${0}" slot="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" ?hidden="${0}" @update:countries="${0}"> </x-countries-list> </x-choice> </x-group> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("locations:before"),n?"text-disabled":"",t,s,n?"text-disabled":"text-tertiary",t,s,["allow","block"],r,n,a,(t=>{"both"!==i.usage&&(i.usage="independent"),i.shipping_filter_type="block"===t.detail?"blacklist":"whitelist",d(),this.edit({json:JSON.stringify(e)})}),t,s,t,s,JSON.stringify(i.shipping_filter_values),this.regions,this.countries,r,t,s,n,a,(t=>{i.shipping_filter_values=t.currentTarget.countries,d(),this.edit({json:JSON.stringify(e)})}),n?"text-disabled":"text-tertiary",t,s,["allow","block","copy"],l,n,a,(t=>{"copy"===t.detail?i.usage="both":(i.usage="independent",i.billing_filter_type="block"===t.detail?"blacklist":"whitelist"),d(),this.edit({json:JSON.stringify(e)})}),t,s,t,s,t,s,JSON.stringify(i.billing_filter_values),this.regions,this.countries,l,t,s,n,a,"copy"===l,(t=>{i.billing_filter_values=t.currentTarget.countries,d(),this.edit({json:JSON.stringify(e)})}),this.renderTemplateOrSlot("locations:after"))}__renderHiddenFields(e){const{lang:t,ns:s}=this,i=[],n=[],a=e.cart_display_config,r=!this.in("idle")||this.disabledSelector.matches("hidden-fields",!0),l=this.readonlySelector.matches("hidden-fields",!0);for(const e in a){if(!e.startsWith("show_"))continue;const t=e.substring(5);i.push(t),"required"!==a.usage||a[e]||n.push(t)}"required"===a.usage&&n.push(...a.hidden_product_options);const d=()=>{a.usage="required",i.includes(this.__addHiddenFieldInputValue)?a[`show_${this.__addHiddenFieldInputValue}`]=!1:a.hidden_product_options.includes(this.__addHiddenFieldInputValue)||a.hidden_product_options.push(this.__addHiddenFieldInputValue),this.edit({json:JSON.stringify(e)}),this.__addHiddenFieldInputValue=""},c="calc(var(--lumo-border-radius-l) / 1.2)",u=0===n.length?[c]:["0","0",c,c],g=r||!this.__addHiddenFieldInputValue;return o(I||(I=Z` <div data-testid="hidden-fields"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="hidden_fields" ns="${0}"> </foxy-i18n> <div class="divide-y divide-contrast-10" data-testid="hidden-fields-list"> ${0} </div> <div data-testid="hidden-fields-new" style="border-radius:${0}" class="${0}"> <input placeholder="${0}" class="w-full bg-transparent appearance-none h-m px-m focus-outline-none" list="hidden-fields-list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <datalist id="hidden-fields-list"> ${0} </datalist> <button aria-label="${0}" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("hidden-fields:before"),r?"text-disabled":"",t,s,n.map((n=>o(z||(z=Z` <div class="${0}"> ${0} <button aria-label="${0}" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m m-auto"></iron-icon> </button> </div> `),h({"h-m ml-m pr-xs flex items-center justify-between":!0,"text-secondary":l,"text-disabled":r}),i.includes(n)?o(A||(A=Z`<foxy-i18n lang="${0}" key="${0}" ns="${0}"></foxy-i18n>`),t,n,s):o(D||(D=Z`<span>${0}</span>`),n),this.t("delete"),h({"w-xs h-xs rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!r,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!r,"cursor-default":r,flex:!l,hidden:l}),r,(()=>{"boolean"==typeof a[`show_${n}`]?a[`show_${n}`]=!0:a.hidden_product_options=a.hidden_product_options.filter((e=>e!==n)),this.edit({json:JSON.stringify(e)})})))),u.join(" "),h({"h-m flex items-center ring-inset ring-primary-50 focus-within-ring-2":!0,"border-t border-contrast-10":n.length>0,flex:!l,hidden:l}),this.t("add_field"),f(this.__addHiddenFieldInputValue),r,l,(e=>"Enter"===e.key&&d()),(e=>{this.__addHiddenFieldInputValue=e.currentTarget.value}),i.filter((e=>!n.includes(e))).map((e=>o(G||(G=Z`<option value="${0}">${0}</option>`),e,this.t(e)))),this.t("add_field"),h({"w-xs h-xs mr-xs flex-shrink-0 ring-inset ring-success-50":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":g,"bg-success-10 text-success cursor-pointer":!g,"hover-bg-success hover-text-success-contrast":!g,"focus-outline-none focus-ring-2":!g}),g,d,this.renderTemplateOrSlot("hidden-fields:after"))}__renderCards(e){const{lang:s,ns:i}=this,n=!this.in("idle")||this.disabledSelector.matches("cards",!0),a=this.readonlySelector.matches("cards",!0),r=e.supported_payment_cards;let l,d;"all_cards"===e.csc_requirements?(l=!1,d=!1):"sso_only"===e.csc_requirements?(l=!0,d=!1):(l=!0,d=!0);const c={amex:"American Express",diners:"Diners Club",discover:"Discover",jcb:"JCB",maestro:"Maestro",mastercard:"Mastercard",unionpay:"UnionPay",visa:"Visa"};return o(L||(L=Z` <div data-testid="cards"> ${0} <div class="space-y-xs"> <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="supported_cards" ns="${0}"> </foxy-i18n> <div class="flex flex-wrap m-xs p-s"> ${0} </div> <div class="flex flex-wrap p-s border-t border-contrast-10"> <x-checkbox data-testid="cards-saved-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="skip_csc_for_saved" ns="${0}"> </foxy-i18n> </x-checkbox> <x-checkbox data-testid="cards-sso-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="skip_csc_for_sso" ns="${0}"> </foxy-i18n> </x-checkbox> </div> </x-group> <foxy-i18n class="text-xs leading-s block ${0}" lang="${0}" key="supported_cards_disclaimer" ns="${0}"> </foxy-i18n> </div> ${0} </div> `),this.renderTemplateOrSlot("cards:before"),n?"text-disabled":"",s,i,Object.entries(t).map((([t,s])=>{if(!c[t])return;const i=r.includes(t);return o(U||(U=Z` <div class="${0}"> <label class="${0}"> <div class="h-s">${0}</div> <div class="text-s font-medium mx-s my-auto leading-none"> ${0} </div> <input type="checkbox" class="sr-only" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> </label> </div> `),h({"m-xs rounded":!0,"opacity-50 cursor-default":n,"cursor-pointer ring-primary-50 focus-within-ring-2":!n}),h({"overflow-hidden transition-colors flex rounded-s border":!0,"border-primary bg-primary-10 text-primary":i&&!a,"border-contrast bg-contrast-5 text-secondary":i&&a,"hover-text-body":i&&!n&&!a,"border-contrast-10":!i,"hover-border-primary":!i&&!n&&!a,"hover-text-primary":!i&&!n&&!a}),s,c[t],n,a,i,(s=>{if(a)return s.preventDefault();s.stopPropagation(),s.currentTarget.checked?r.push(t):r.splice(r.indexOf(t),1),this.edit({json:JSON.stringify(e)})}))})),n||"new_cards_only"===e.csc_requirements,a,l,(t=>{e.csc_requirements=t.detail?"sso_only":"all_cards",this.edit({json:JSON.stringify(e)})}),s,i,n,a,d,(t=>{e.csc_requirements=t.detail?"new_cards_only":l?"sso_only":"all_cards",this.edit({json:JSON.stringify(e)})}),s,i,n?"text-disabled":"text-secondary",s,i,this.renderTemplateOrSlot("cards:after"))}__renderCheckoutType(e){const{lang:t,ns:s}=this,i=!this.in("idle")||this.disabledSelector.matches("checkout-type",!0),n=this.readonlySelector.matches("checkout-type",!0);return o(B||(B=Z` <div data-testid="checkout-type"> ${0} <div class="space-y-xs"> <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="checkout_type" ns="${0}"> </foxy-i18n> <x-choice data-testid="checkout-type-choice" ?disabled="${0}" ?readonly="${0}" .items="${0}" .value="${0}" .getText="${0}" @change="${0}"> </x-choice> </x-group> <foxy-i18n class="text-xs leading-s block ${0}" lang="${0}" key="checkout_type_helper_text" ns="${0}"> </foxy-i18n> </div> ${0} </div> `),this.renderTemplateOrSlot("checkout-type:before"),i?"text-disabled":"",t,s,i,n,["default_account","default_guest","guest_only","account_only"],e.checkout_type,(e=>this.t(`checkout_type_${e}`)),(t=>{e.checkout_type=t.detail,this.edit({json:JSON.stringify(e)})}),i?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("checkout-type:after"))}__renderConsent(e){const{lang:t,ns:s}=this,i=e.tos_checkbox_settings,n=e.newsletter_subscribe,a=e.eu_secure_data_transfer_consent,r=!this.in("idle")||this.disabledSelector.matches("consent",!0),l=this.readonlySelector.matches("consent",!0),d="margin-left: calc(1.125rem + (var(--lumo-space-m) * 2))";return o(P||(P=Z` <div data-testid="consent"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="consent" ns="${0}"> </foxy-i18n> <x-checkbox data-testid="consent-tos-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="display_tos_link" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="display_tos_link_explainer" ns="${0}"> </foxy-i18n> </div> <div slot="content" ?hidden="${0}"> <vaadin-text-field data-testid="consent-tos-field" label="${0}" class="w-full mt-m" placeholder="https://example.com/path/to/tos" clear-button-visible ?disabled="${0}" ?readonly="${0}" .value="${0}" @input="${0}"> </vaadin-text-field> <div class="flex flex-wrap -mx-s -mb-s mt-s"> <x-checkbox data-testid="consent-tos-require-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="require_consent" ns="${0}"> </foxy-i18n> </x-checkbox> <x-checkbox data-testid="consent-tos-state-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="checked_by_default" ns="${0}"> </foxy-i18n> </x-checkbox> </div> </div> </x-checkbox> <div style="${0}" class="border-b border-contrast-10"></div> <x-checkbox data-testid="consent-mail-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="newsletter_subscribe" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="newsletter_subscribe_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> <div style="${0}" class="border-b border-contrast-10"></div> <x-checkbox data-testid="consent-sdta-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="display_sdta" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="display_sdta_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </x-group> ${0} </div> `),this.renderTemplateOrSlot("consent:before"),r?"text-disabled":"",t,s,r,l,"required"===i.usage||"optional"===i.usage,(t=>{i.initial_state=t.detail?i.initial_state:"unchecked",i.is_hidden=!1,i.usage=t.detail?"required":"none",i.url=t.detail?i.url:"",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,"none"===i.usage,this.t("location_url"),r,l,i.url,(t=>{i.url=t.currentTarget.value,this.edit({json:JSON.stringify(e)})}),r,l,"required"===i.usage,(t=>{i.usage=t.detail?"required":"optional",this.edit({json:JSON.stringify(e)})}),t,s,r,l,"checked"===i.initial_state,(t=>{i.initial_state=t.detail?"checked":"unchecked",this.edit({json:JSON.stringify(e)})}),t,s,d,r,l,"required"===n.usage,(t=>{n.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,d,r,l,"required"===a.usage,(t=>{a.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("consent:after"))}__renderFields(e){const{lang:t,ns:s}=this,i=!this.in("idle")||this.disabledSelector.matches("fields",!0),n=this.readonlySelector.matches("fields",!0),a=e.custom_checkout_field_requirements;return o(M||(M=Z` <div data-testid="fields"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="field_plural" ns="${0}"> </foxy-i18n> <div class="bg-contrast-10 grid grid-cols-1 sm-grid-cols-2" style="gap:1px"> ${0} <div class="bg-base hidden sm-block"></div> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("fields:before"),i?"text-disabled":"",t,s,Object.entries({cart_controls:["enabled","disabled"],coupon_entry:["enabled","disabled"],billing_first_name:["default","optional","required","hidden"],billing_last_name:["default","optional","required","hidden"],billing_company:["default","optional","required","hidden"],billing_tax_id:["default","optional","required","hidden"],billing_phone:["default","optional","required","hidden"],billing_address1:["default","optional","required","hidden"],billing_address2:["default","optional","required","hidden"],billing_city:["default","optional","required","hidden"],billing_region:["default","optional","required","hidden"],billing_postal_code:["default","optional","required","hidden"],billing_country:["default","optional","required","hidden"]}).map((([r,l])=>o(W||(W=Z` <label class="${0}"> <foxy-i18n class="flex-1" lang="${0}" key="${0}" ns="${0}"> </foxy-i18n> <div class="${0}"> ${0} </div> <div class="${0}"> <select data-testid="fields-${0}" class="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} </select> <iron-icon class="pointer-events-none icon-inline text-xl" icon="icons:expand-more"> </iron-icon> </div> </label> `),h({"flex items-center pl-m bg-base":!0,"text-secondary":n,"text-disabled":i}),t,r.replace("billing_",""),s,h({"flex items-center text-right font-medium h-s px-s m-xs":n,hidden:!n}),this.t(l.find((e=>a[r]===e))),h({"px-s m-xs flex items-center rounded leading-none":!0,"ring-primary-50 ring-inset focus-within-ring-2":!i,"hover-text-primary":!i,"cursor-pointer":!i,"cursor-default":i,flex:!n,hidden:n}),r,h({"h-s mr-xs text-right appearance-none bg-transparent font-medium":!0,"focus-outline-none cursor-pointer":!i,"cursor-default":i}),i,n,(t=>{const s=t.currentTarget,i=s.options[s.options.selectedIndex].value;a[r]=i,this.edit({json:JSON.stringify(e)})}),l.map((e=>o(K||(K=Z` <option value="${0}" ?selected="${0}"> ${0} </option> `),e,a[r]===e,this.t(e))))))),this.renderTemplateOrSlot("fields:after"))}__renderGoogleAnalytics(e){const{lang:t,ns:s}=this,i=e.analytics_config,n=i.google_tag,a=i.google_analytics,r=!this.in("idle")||this.disabledSelector.matches("google-analytics",!0),l=this.readonlySelector.matches("google-analytics",!0);return o(Q||(Q=Z` <div data-testid="google-analytics"> ${0} <x-group frame> <span class="${0}" slot="header">Google Analytics</span> <foxy-i18n class="block bg-error-10 text-error font-medium rounded-t p-m" infer="" key="ga_deprecation_notice"> </foxy-i18n> <div class="p-m space-y-m"> <vaadin-text-field data-testid="google-analytics-field" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="UA-1234567-1" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <x-checkbox data-testid="google-analytics-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="ga_include_on_site" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="ga_include_on_site_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("google-analytics:before"),r?"text-disabled":"",this.t("ga_account_id"),this.t("ga_account_id_explainer"),f(a.account_id),r,l,(e=>"Enter"===e.key&&this.submit()),(t=>{a.account_id=t.currentTarget.value,a.usage=a.account_id?"required":"none",i.usage=a.account_id||n.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),r,l,a.include_on_site,(t=>{a.include_on_site=t.detail,this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("google-analytics:after"))}__renderGoogleTag(e){const t=e.analytics_config,s=t.google_tag,i=t.google_analytics,n=!this.in("idle")||this.disabledSelector.matches("google-tag",!0),a=this.readonlySelector.matches("google-tag",!0);return o(X||(X=Z` <div data-testid="google-tag"> ${0} <x-group frame> <span class="${0}" slot="header">Google Tag</span> <div class="p-m space-y-m"> <vaadin-text-field data-testid="google-tag-account-id" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="G-123456789" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <vaadin-text-field data-testid="google-tag-send-to" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="AW-123456789/sABDCLqU3K2BEJb8cxDE" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <p class="text-xs text-secondary"> <foxy-i18n infer="" key="gt_usage_notice"></foxy-i18n> <a target="_blank" class="cursor-pointer group text-primary rounded-s font-medium focus-outline-none focus-ring-2 focus-ring-primary-50" href="https://wiki.foxycart.com/v/2.0/analytics#google_tag_ga4_google_ads" rel="nofollow noreferrer noopener"> <foxy-i18n class="transition-opacity group-hover-opacity-80" infer="" key="gt_docs_link"> </foxy-i18n> </a> </p> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("google-tag:before"),n?"text-disabled":"",this.t("gt_account_id"),this.t("gt_account_id_explainer"),f(s.account_id),n,a,(e=>"Enter"===e.key&&this.submit()),(o=>{s.account_id=o.currentTarget.value,s.usage=s.account_id?"required":"none",t.usage=s.account_id||i.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),this.t("gt_send_to"),this.t("gt_send_to_explainer"),f(s.send_to),n,a,(e=>"Enter"===e.key&&this.submit()),(o=>{s.send_to=o.currentTarget.value,s.usage=s.account_id?"required":"none",t.usage=s.account_id||i.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),this.renderTemplateOrSlot("google-tag:after"))}__renderTroubleshooting(e){const{lang:t,ns:s}=this,i=e.debug,n=!this.in("idle")||this.disabledSelector.matches("troubleshooting",!0),a=this.readonlySelector.matches("troubleshooting",!0);return o(Y||(Y=Z` <div data-testid="troubleshooting"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="troubleshooting" ns="${0}"> </foxy-i18n> <div class="p-m space-y-m"> <x-checkbox data-testid="troubleshooting-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="troubleshooting_debug" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="troubleshooting_debug_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("troubleshooting:before"),n?"text-disabled":"",t,s,n,a,"required"===i.usage,(t=>{i.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,n?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("troubleshooting:after"))}}customElements.define("foxy-template-config-form",te);export{te as TemplateConfigForm};
+import"./shared-417ab233.js";import"./shared-fe927c53.js";import"./shared-7d933f9d.js";import"./shared-76e71481.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-51a5af7e.js";import{_ as e}from"./shared-4c2e9064.js";import{l as t}from"./shared-d7be11de.js";import{C as s,a as i}from"./shared-5742a841.js";import{h as o}from"./shared-7f33a83a.js";import{C as n}from"./shared-5d795aaf.js";import{C as a}from"./shared-5cf7b194.js";import{N as r}from"./shared-9b12aeac.js";import{T as l,a as d,S as c,R as u}from"./shared-662c576b.js";import{c as h}from"./shared-4e709717.js";import{i as g}from"./shared-d3bf9ac0.js";import{G as p}from"./shared-1313f293.js";import{l as f}from"./shared-f3b35364.js";import"./shared-f3b8de28.js";import"./shared-e3096241.js";import"./shared-e60dc924.js";import"./shared-21293163.js";import"./shared-702eae16.js";import"./shared-fd96bcd1.js";import"./shared-d519a301.js";import"./shared-343d1fd7.js";import"./shared-6e704d83.js";import"./shared-c00049b2.js";import"./shared-fc99076a.js";import"./shared-53d66db2.js";import"./shared-1dbad347.js";import"./shared-96215749.js";import"./shared-71b3559f.js";import"./shared-11c2efc8.js";import"./shared-e8a51c60.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";let y,_,x,b,m,$=e=>e;const v=a(l(d(r)));class k extends v{constructor(){super(...arguments),this.regions=[],this.name="",this.code="",this.__newRegion=""}static get properties(){return e(e({},super.properties),{},{__newRegion:{attribute:!1},regions:{type:Array},name:{type:String},code:{type:String}})}render(){var e,t;return o(y||(y=$` <div class="${0}"> <div data-testid="country" class="h-m flex justify-between items-center border-b border-contrast-10"> <div class="ml-m"> <span>${0}</span> ${0} </div> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m"></iron-icon> </button> </div> <div data-testid="regions" class="flex flex-wrap p-xs"> ${0} <div data-testid="new-region" style="border-radius:var(--lumo-size-s)" class="${0}"> <input placeholder="${0}" class="bg-transparent appearance-none h-s text-s px-s focus-outline-none" style="width:8rem" list="list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <button style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> <datalist id="list"> ${0} </datalist> </div> </div> `),h({"border border-contrast-10 rounded text-s":!0,"text-disabled":this.disabled}),this.name||this.code,this.name?o(_||(_=$`<span class="text-secondary">${0}</span>`),this.code):"",this.t("delete"),h({"mr-xs items-center justify-center rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!this.disabled,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!this.disabled,"cursor-default":this.disabled,flex:!this.readonly,hidden:this.readonly}),this.disabled,(()=>this.dispatchEvent(new CustomEvent("delete"))),this.regions.map((e=>{var t,s;const i=null===(s=null===(t=this.data)||void 0===t?void 0:t.values[e])||void 0===s?void 0:s.default;return o(x||(x=$` <div class="flex items-center border border-contrast-10 h-s m-xs" style="border-radius:var(--lumo-size-s)"> <span class="mx-s"> <span>${0}</span> ${0} </span> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m"></iron-icon> </button> </div> `),i||e,i?o(b||(b=$`<span class="text-secondary">${0}</span>`),e):"",this.t("delete"),h({"items-center justify-center rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!this.disabled,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!this.disabled,"cursor-default":this.disabled,flex:!this.readonly,hidden:this.readonly}),this.disabled,(()=>{this.regions=this.regions.filter((t=>t!==e)),this.dispatchEvent(new CustomEvent("update:regions"))}))})),h({"h-s m-xs items-center transition-colors border border-contrast-10":!0,"hover-border-contrast-40":!this.disabled,"focus-within-ring-1 ring-primary-50 focus-within-border-primary-50":!this.disabled,flex:!this.readonly,hidden:this.readonly}),this.t("add_region"),this.__newRegion,this.disabled,this.readonly,(e=>{"Enter"===e.key&&this.__newRegion&&this.__addRegion()}),(e=>{const t=e.currentTarget;this.__newRegion=t.value}),h({"flex-shrink-0":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":!this.__newRegion,"bg-success-10 text-success cursor-pointer":!!this.__newRegion,"hover-bg-success hover-text-success-contrast":!!this.__newRegion,"focus-outline-none focus-ring-2 ring-inset ring-success-50":!!this.__newRegion}),this.disabled||!this.__newRegion,this.__addRegion,Object.values(null!==(t=null===(e=this.data)||void 0===e?void 0:e.values)&&void 0!==t?t:{}).map((e=>o(m||(m=$`<option value="${0}">${0}</option>`),e.code,e.default))))}__addRegion(){this.regions=[...new Set([...this.regions,this.__newRegion])],this.__newRegion="",this.dispatchEvent(new CustomEvent("update:regions"))}}let w,S,j,O=e=>e;const q=c(a(l(d(r))));class T extends q{constructor(){super(...arguments),this.countries={},this.regions="",this.__newCountry=""}static get scopedElements(){return{"x-country-card":k,"iron-icon":customElements.get("iron-icon")}}static get properties(){return e(e({},super.properties),{},{__newCountry:{attribute:!1},countries:{type:Object},regions:{type:String}})}render(){var t,s;return o(w||(w=O` <div> <div class="space-y-s" data-testid="countries"> ${0} <div data-testid="new-country" class="${0}"> <input placeholder="${0}" class="w-full bg-transparent appearance-none h-m text-s px-m focus-outline-none" list="list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <button aria-label="${0}" class="${0}" style="width:calc(var(--lumo-size-s) - 2px);height:calc(var(--lumo-size-s) - 2px)" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> </div> <datalist id="list"> ${0} </datalist> </div> `),Object.entries(this.countries).map((([t,s])=>{var i,n;let a;try{const e=new URL(this.regions);e.searchParams.set("country_code",t),a=e.toString()}catch(e){a=""}return o(S||(S=O` <x-country-card regions="${0}" code="${0}" name="${0}" href="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" @update:regions="${0}" @delete="${0}"> </x-country-card> `),JSON.stringify("*"===s?[]:s),t,g(null===(n=null===(i=this.data)||void 0===i?void 0:i.values[t])||void 0===n?void 0:n.default),a,this.lang,this.ns,this.disabled,this.readonly,(s=>{const i=e({},this.countries),o=s.currentTarget.regions;i[t]=o.length?o:"*",this.countries=i,this.dispatchEvent(new CustomEvent("update:countries"))}),(()=>{const s=e({},this.countries);delete s[t],this.countries=s,this.dispatchEvent(new CustomEvent("update:countries"))}))})),h({"h-m flex items-center rounded transition-colors":!0,"border border-contrast-10 ring-primary-50":!0,"hover-border-contrast-40":!this.disabled,"focus-within-ring-1 focus-within-border-primary-50":!this.disabled,flex:!this.readonly,hidden:this.readonly}),this.t("add_country"),this.__newCountry,this.disabled,this.readonly,(e=>{"Enter"===e.key&&this.__newCountry&&this.__addCountry()}),(e=>{const t=e.currentTarget;this.__newCountry=t.value}),this.t("create"),h({"mr-xs flex-shrink-0":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":!this.__newCountry,"bg-success-10 text-success cursor-pointer":!!this.__newCountry,"hover-bg-success hover-text-success-contrast":!!this.__newCountry,"focus-outline-none focus-ring-2 ring-inset ring-success-50":!!this.__newCountry}),!this.__newCountry||this.disabled,this.__addCountry,Object.entries(null!==(s=null===(t=this.data)||void 0===t?void 0:t.values)&&void 0!==s?s:{}).map((([e,t])=>o(j||(j=O`<option value="${0}">${0}</option>`),e,t.default))))}__addCountry(){this.countries=e(e({},this.countries),{},{[this.__newCountry]:"*"}),this.__newCountry="",this.dispatchEvent(new CustomEvent("update:countries"))}}let J,N,C,E,F,V,R,H,I,z,A,D,G,L,U,B,P,M,W,K,Q,X,Y,Z=e=>e;const ee=c(u(a(l(d(r,"template-config-form")))));class te extends ee{constructor(){super(...arguments),this.templates={},this.countries="",this.regions="",this.__addHiddenFieldInputValue=""}static get scopedElements(){return{"vaadin-text-field":customElements.get("vaadin-text-field"),"iron-icon":customElements.get("iron-icon"),"foxy-internal-source-control":customElements.get("foxy-internal-source-control"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"x-countries-list":T,"x-checkbox":n,"x-choice":s,"x-group":p}}static get properties(){return e(e({},super.properties),{},{__addHiddenFieldInputValue:{attribute:!1},countries:{type:String},regions:{type:String}})}render(){var e,t;const s=this.hiddenSelector,i=this.form.json?JSON.parse(this.form.json):{cart_type:"default",checkout_type:"default_account",csc_requirements:"all_cards",tos_checkbox_settings:{usage:"none",initial_state:"unchecked",is_hidden:!1,url:""},eu_secure_data_transfer_consent:{usage:"required"},newsletter_subscribe:{usage:"none"},analytics_config:{usage:"none",google_analytics:{usage:"none",account_id:"",include_on_site:!1},google_tag:{usage:"none",send_to:"",account_id:""}},colors:{usage:"none",primary:"4D4D4D",secondary:"FFFFFF",tertiary:"FFFFFF"},use_checkout_confirmation_window:{usage:"none"},supported_payment_cards:["visa","mastercard","discover","amex"],custom_checkout_field_requirements:{cart_controls:"enabled",coupon_entry:"enabled",billing_first_name:"required",billing_last_name:"required",billing_company:"optional",billing_tax_id:"hidden",billing_phone:"optional",billing_address1:"required",billing_address2:"optional",billing_city:"required",billing_region:"default",billing_postal_code:"required",billing_country:"required"},cart_display_config:{usage:"none",show_product_weight:!0,show_product_category:!0,show_product_code:!0,show_product_options:!0,show_sub_frequency:!0,show_sub_startdate:!0,show_sub_nextdate:!0,show_sub_enddate:!0,hidden_product_options:[]},foxycomplete:{usage:"required",show_combobox:!0,combobox_open:"\\u25bc",combobox_close:"\\u25b2",show_flags:!0},custom_script_values:{header:"",footer:"",checkout_fields:"",multiship_checkout_fields:""},http_receipt:!1,custom_config:"",debug:{usage:"none"},location_filtering:{usage:"none",shipping_filter_type:"blacklist",billing_filter_type:"blacklist",shipping_filter_values:{},billing_filter_values:{}},postal_code_lookup:{usage:"enabled"}};return o(J||(J=Z` <div class="relative" aria-busy="${0}" aria-live="polite"> <div class="space-y-l"> ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} ${0} <foxy-internal-source-control data-testid="custom-config" helper-text="${0}" placeholder='{ "key": "value" }' label="${0}" infer="custom-config" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="header" placeholder="<style>h1 { color: red }</style>" helper-text="${0}" label="${0}" infer="header" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="custom-fields" placeholder='<label>Comment: <input name="comment"></label>' helper-text="${0}" label="${0}" infer="custom-fields" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> <foxy-internal-source-control data-testid="footer" placeholder='<script src="https://example.com/code.js"></script>' helper-text="${0}" label="${0}" infer="footer" .getValue="${0}" .setValue="${0}"> </foxy-internal-source-control> </div> <div class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.in("busy"),s.matches("cart-type",!0)?"":this.__renderCartType(i),s.matches("foxycomplete",!0)?"":this.__renderFoxycomplete(i),s.matches("locations",!0)?"":this.__renderLocations(i),s.matches("hidden-fields",!0)?"":this.__renderHiddenFields(i),s.matches("cards",!0)?"":this.__renderCards(i),s.matches("checkout-type",!0)?"":this.__renderCheckoutType(i),s.matches("consent",!0)?"":this.__renderConsent(i),s.matches("fields",!0)?"":this.__renderFields(i),s.matches("google-analytics",!0)?"":this.__renderGoogleAnalytics(i),s.matches("google-tag",!0)?"":this.__renderGoogleTag(i),s.matches("troubleshooting",!0)?"":this.__renderTroubleshooting(i),this.t("custom_config_helper_text"),this.t("custom_config"),(()=>"string"==typeof i.custom_config?i.custom_config:JSON.stringify(i.custom_config,null,2)),(e=>{try{i.custom_config=JSON.parse(e)}catch(t){i.custom_config=e}this.edit({json:JSON.stringify(i)})}),this.t("custom_header_helper_text"),this.t("custom_header"),(()=>i.custom_script_values.header),(e=>{i.custom_script_values.header=e,this.edit({json:JSON.stringify(i)})}),this.t("custom_fields_helper_text"),this.t("custom_fields"),(()=>i.custom_script_values.checkout_fields),(e=>{i.custom_script_values.checkout_fields=e,this.edit({json:JSON.stringify(i)})}),this.t("custom_footer_helper_text"),this.t("custom_footer"),(()=>i.custom_script_values.footer),(e=>{i.custom_script_values.footer=e,this.edit({json:JSON.stringify(i)})}),h({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":this.in("idle")}),this.in("fail")?"error":"busy",this.lang,this.ns,null!==(t=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==t?t:"")}__renderCartType(t){const{lang:s,ns:i}=this,n=["default","fullpage","custom"],a=!this.in("idle")||this.disabledSelector.matches("cart-type",!0);return o(N||(N=Z` <div data-testid="cart-type"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="cart_type" ns="${0}"> </foxy-i18n> <x-choice data-testid="cart-type-choice" .value="${0}" .items="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} </x-choice> </x-group> ${0} </div> `),this.renderTemplateOrSlot("cart-type:before"),a?"text-disabled":"",s,i,t.cart_type,n,a,this.readonlySelector.matches("cart-type",!0),(s=>{this.edit({json:JSON.stringify(e(e({},t),{},{cart_type:s.detail}))})}),n.map((e=>o(C||(C=Z` <div slot="${0}-label" class="grid leading-s py-s"> <foxy-i18n lang="${0}" key="cart_type_${0}" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs ${0}" lang="${0}" key="cart_type_${0}_explainer" ns="${0}"> </foxy-i18n> </div> `),e,s,e,i,a?"text-disabled":"text-secondary",s,e,i))),this.renderTemplateOrSlot("cart-type:after"))}__renderFoxycomplete(e){const{lang:t,ns:s}=this,n=!this.in("idle")||this.disabledSelector.matches("foxycomplete",!0),a=this.readonlySelector.matches("foxycomplete",!0),r=e.foxycomplete,l=["combobox","search","disabled"],d="none"===r.usage?"disabled":r.show_combobox?"combobox":"search",c=o(E||(E=Z` <x-checkbox data-testid="foxycomplete-flags-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n lang="${0}" key="show_country_flags" ns="${0}"></foxy-i18n> </x-checkbox> `),n,a,r.show_flags,(t=>{r.show_flags=t.detail,this.edit({json:JSON.stringify(e)})}),t,s);return o(F||(F=Z` <div data-testid="foxycomplete"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="foxycomplete" ns="${0}"> </foxy-i18n> <x-choice data-testid="foxycomplete-choice" .value="${0}" .items="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} <div slot="combobox" class="space-y-m pb-s" ?hidden="${0}"> <div class="grid grid-cols-2 gap-m" style="max-width:16rem"> ${0} </div> ${0} </div> <div slot="search" class="pb-s" ?hidden="${0}">${0}</div> </x-choice> <div class="border-t border-contrast-10 p-m"> <x-checkbox data-testid="foxycomplete-lookup-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n lang="${0}" key="enable_postcode_lookup" ns="${0}"></foxy-i18n> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("foxycomplete:before"),n?"text-disabled":"",t,s,d,l,n,a,(t=>{t instanceof i&&(r.usage="disabled"===t.detail?"none":"required",r.show_combobox="combobox"===t.detail,this.edit({json:JSON.stringify(e)}))}),l.map((e=>o(V||(V=Z` <div slot="${0}-label" class="grid leading-s py-s"> <foxy-i18n lang="${0}" key="foxycomplete_${0}" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs ${0}" lang="${0}" key="foxycomplete_${0}_explainer" ns="${0}"> </foxy-i18n> </div> `),e,t,e,s,n?"text-disabled":"text-secondary",t,e,s))),"combobox"!==d,["open","close"].map((t=>{const s="open"===t?"combobox_open":"combobox_close";return o(R||(R=Z` <vaadin-text-field data-testid="foxycomplete-${0}-icon" style="--lumo-border-radius:var(--lumo-border-radius-s)" label="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> `),t,this.t(`${t}_icon`),r[s],n,a,(e=>"Enter"===e.key&&this.submit()),(t=>{r[s]=t.currentTarget.value,this.edit({json:JSON.stringify(e)})}))})),c,"search"!==d,c,n,a,"enabled"===e.postal_code_lookup.usage,(t=>{e.postal_code_lookup.usage=t.detail?"enabled":"none",this.edit({json:JSON.stringify(e)})}),t,s,this.renderTemplateOrSlot("foxycomplete:after"))}__renderLocations(e){const{lang:t,ns:s}=this,i=e.location_filtering,n=!this.in("idle")||this.disabledSelector.matches("locations",!0),a=this.readonlySelector.matches("locations",!0),r="blacklist"===i.shipping_filter_type?"block":"allow",l="both"===i.usage?"copy":"blacklist"===i.billing_filter_type?"block":"allow",d=()=>{if("both"===i.usage)i.billing_filter_type=i.shipping_filter_type,i.billing_filter_values=i.shipping_filter_values;else{const e=Object.keys(i.billing_filter_values).length>0,t=Object.keys(i.shipping_filter_values).length>0;i.usage=e||t?e&&!t?"billing":t&&!e?"shipping":"independent":"none"}};return o(H||(H=Z` <div data-testid="locations"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="location_plural" ns="${0}"> </foxy-i18n> <div class="grid sm-grid-cols-2 bg-contrast-10" style="gap:1px"> <x-group class="bg-base pt-m"> <foxy-i18n class="${0}" slot="header" lang="${0}" key="shipping" ns="${0}"> </foxy-i18n> <x-choice data-testid="locations-shipping-choice" .items="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> <foxy-i18n slot="allow-label" lang="${0}" key="allowlist" ns="${0}"></foxy-i18n> <foxy-i18n slot="block-label" lang="${0}" key="blocklist" ns="${0}"></foxy-i18n> <x-countries-list data-testid="locations-shipping-list" countries="${0}" regions="${0}" class="mb-m" href="${0}" slot="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" @update:countries="${0}"> </x-countries-list> </x-choice> </x-group> <x-group class="bg-base pt-m"> <foxy-i18n class="${0}" slot="header" lang="${0}" key="billing" ns="${0}"> </foxy-i18n> <x-choice data-testid="locations-billing-choice" .items="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> <foxy-i18n slot="allow-label" lang="${0}" key="allowlist" ns="${0}"></foxy-i18n> <foxy-i18n slot="block-label" lang="${0}" key="blocklist" ns="${0}"></foxy-i18n> <foxy-i18n slot="copy-label" lang="${0}" key="same_as_shipping" ns="${0}"> </foxy-i18n> <x-countries-list data-testid="locations-billing-list" countries="${0}" regions="${0}" class="mb-m" href="${0}" slot="${0}" lang="${0}" ns="${0}" ?disabled="${0}" ?readonly="${0}" ?hidden="${0}" @update:countries="${0}"> </x-countries-list> </x-choice> </x-group> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("locations:before"),n?"text-disabled":"",t,s,n?"text-disabled":"text-tertiary",t,s,["allow","block"],r,n,a,(t=>{"both"!==i.usage&&(i.usage="independent"),i.shipping_filter_type="block"===t.detail?"blacklist":"whitelist",d(),this.edit({json:JSON.stringify(e)})}),t,s,t,s,JSON.stringify(i.shipping_filter_values),this.regions,this.countries,r,t,s,n,a,(t=>{i.shipping_filter_values=t.currentTarget.countries,d(),this.edit({json:JSON.stringify(e)})}),n?"text-disabled":"text-tertiary",t,s,["allow","block","copy"],l,n,a,(t=>{"copy"===t.detail?i.usage="both":(i.usage="independent",i.billing_filter_type="block"===t.detail?"blacklist":"whitelist"),d(),this.edit({json:JSON.stringify(e)})}),t,s,t,s,t,s,JSON.stringify(i.billing_filter_values),this.regions,this.countries,l,t,s,n,a,"copy"===l,(t=>{i.billing_filter_values=t.currentTarget.countries,d(),this.edit({json:JSON.stringify(e)})}),this.renderTemplateOrSlot("locations:after"))}__renderHiddenFields(e){const{lang:t,ns:s}=this,i=[],n=[],a=e.cart_display_config,r=!this.in("idle")||this.disabledSelector.matches("hidden-fields",!0),l=this.readonlySelector.matches("hidden-fields",!0);for(const e in a){if(!e.startsWith("show_"))continue;const t=e.substring(5);i.push(t),"required"!==a.usage||a[e]||n.push(t)}"required"===a.usage&&n.push(...a.hidden_product_options);const d=()=>{a.usage="required",i.includes(this.__addHiddenFieldInputValue)?a[`show_${this.__addHiddenFieldInputValue}`]=!1:a.hidden_product_options.includes(this.__addHiddenFieldInputValue)||a.hidden_product_options.push(this.__addHiddenFieldInputValue),this.edit({json:JSON.stringify(e)}),this.__addHiddenFieldInputValue=""},c="calc(var(--lumo-border-radius-l) / 1.2)",u=0===n.length?[c]:["0","0",c,c],g=r||!this.__addHiddenFieldInputValue;return o(I||(I=Z` <div data-testid="hidden-fields"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="hidden_fields" ns="${0}"> </foxy-i18n> <div class="divide-y divide-contrast-10" data-testid="hidden-fields-list"> ${0} </div> <div data-testid="hidden-fields-new" style="border-radius:${0}" class="${0}"> <input placeholder="${0}" class="w-full bg-transparent appearance-none h-m px-m focus-outline-none" list="hidden-fields-list" .value="${0}" ?disabled="${0}" ?readonly="${0}" @keydown="${0}" @input="${0}"> <datalist id="hidden-fields-list"> ${0} </datalist> <button aria-label="${0}" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:add" class="icon-inline text-m"></iron-icon> </button> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("hidden-fields:before"),r?"text-disabled":"",t,s,n.map((n=>o(z||(z=Z` <div class="${0}"> ${0} <button aria-label="${0}" class="${0}" ?disabled="${0}" @click="${0}"> <iron-icon icon="icons:close" class="icon-inline text-m m-auto"></iron-icon> </button> </div> `),h({"h-m ml-m pr-xs flex items-center justify-between":!0,"text-secondary":l,"text-disabled":r}),i.includes(n)?o(A||(A=Z`<foxy-i18n lang="${0}" key="${0}" ns="${0}"></foxy-i18n>`),t,n,s):o(D||(D=Z`<span>${0}</span>`),n),this.t("delete"),h({"w-xs h-xs rounded-full transition-colors":!0,"hover-bg-error-10 hover-text-error":!r,"focus-outline-none focus-ring-2 ring-inset ring-error-50":!r,"cursor-default":r,flex:!l,hidden:l}),r,(()=>{"boolean"==typeof a[`show_${n}`]?a[`show_${n}`]=!0:a.hidden_product_options=a.hidden_product_options.filter((e=>e!==n)),this.edit({json:JSON.stringify(e)})})))),u.join(" "),h({"h-m flex items-center ring-inset ring-primary-50 focus-within-ring-2":!0,"border-t border-contrast-10":n.length>0,flex:!l,hidden:l}),this.t("add_field"),f(this.__addHiddenFieldInputValue),r,l,(e=>"Enter"===e.key&&d()),(e=>{this.__addHiddenFieldInputValue=e.currentTarget.value}),i.filter((e=>!n.includes(e))).map((e=>o(G||(G=Z`<option value="${0}">${0}</option>`),e,this.t(e)))),this.t("add_field"),h({"w-xs h-xs mr-xs flex-shrink-0 ring-inset ring-success-50":!0,"flex items-center justify-center rounded-full transition-colors":!0,"bg-contrast-5 text-disabled cursor-default":g,"bg-success-10 text-success cursor-pointer":!g,"hover-bg-success hover-text-success-contrast":!g,"focus-outline-none focus-ring-2":!g}),g,d,this.renderTemplateOrSlot("hidden-fields:after"))}__renderCards(e){const{lang:s,ns:i}=this,n=!this.in("idle")||this.disabledSelector.matches("cards",!0),a=this.readonlySelector.matches("cards",!0),r=e.supported_payment_cards;let l,d;"all_cards"===e.csc_requirements?(l=!1,d=!1):"sso_only"===e.csc_requirements?(l=!0,d=!1):(l=!0,d=!0);const c={amex:"American Express",diners:"Diners Club",discover:"Discover",jcb:"JCB",maestro:"Maestro",mastercard:"Mastercard",unionpay:"UnionPay",visa:"Visa"};return o(L||(L=Z` <div data-testid="cards"> ${0} <div class="space-y-xs"> <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="supported_cards" ns="${0}"> </foxy-i18n> <div class="flex flex-wrap m-xs p-s"> ${0} </div> <div class="flex flex-wrap p-s border-t border-contrast-10"> <x-checkbox data-testid="cards-saved-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="skip_csc_for_saved" ns="${0}"> </foxy-i18n> </x-checkbox> <x-checkbox data-testid="cards-sso-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="skip_csc_for_sso" ns="${0}"> </foxy-i18n> </x-checkbox> </div> </x-group> <foxy-i18n class="text-xs leading-s block ${0}" lang="${0}" key="supported_cards_disclaimer" ns="${0}"> </foxy-i18n> </div> ${0} </div> `),this.renderTemplateOrSlot("cards:before"),n?"text-disabled":"",s,i,Object.entries(t).map((([t,s])=>{if(!c[t])return;const i=r.includes(t);return o(U||(U=Z` <div class="${0}"> <label class="${0}"> <div class="h-s">${0}</div> <div class="text-s font-medium mx-s my-auto leading-none"> ${0} </div> <input type="checkbox" class="sr-only" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> </label> </div> `),h({"m-xs rounded":!0,"opacity-50 cursor-default":n,"cursor-pointer ring-primary-50 focus-within-ring-2":!n}),h({"overflow-hidden transition-colors flex rounded-s border":!0,"border-primary bg-primary-10 text-primary":i&&!a,"border-contrast bg-contrast-5 text-secondary":i&&a,"hover-text-body":i&&!n&&!a,"border-contrast-10":!i,"hover-border-primary":!i&&!n&&!a,"hover-text-primary":!i&&!n&&!a}),s,c[t],n,a,i,(s=>{if(a)return s.preventDefault();s.stopPropagation(),s.currentTarget.checked?r.push(t):r.splice(r.indexOf(t),1),this.edit({json:JSON.stringify(e)})}))})),n||"new_cards_only"===e.csc_requirements,a,l,(t=>{e.csc_requirements=t.detail?"sso_only":"all_cards",this.edit({json:JSON.stringify(e)})}),s,i,n,a,d,(t=>{e.csc_requirements=t.detail?"new_cards_only":l?"sso_only":"all_cards",this.edit({json:JSON.stringify(e)})}),s,i,n?"text-disabled":"text-secondary",s,i,this.renderTemplateOrSlot("cards:after"))}__renderCheckoutType(e){const{lang:t,ns:s}=this,i=!this.in("idle")||this.disabledSelector.matches("checkout-type",!0),n=this.readonlySelector.matches("checkout-type",!0);return o(B||(B=Z` <div data-testid="checkout-type"> ${0} <div class="space-y-xs"> <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="checkout_type" ns="${0}"> </foxy-i18n> <x-choice data-testid="checkout-type-choice" ?disabled="${0}" ?readonly="${0}" .items="${0}" .value="${0}" .getText="${0}" @change="${0}"> </x-choice> </x-group> <foxy-i18n class="text-xs leading-s block ${0}" lang="${0}" key="checkout_type_helper_text" ns="${0}"> </foxy-i18n> </div> ${0} </div> `),this.renderTemplateOrSlot("checkout-type:before"),i?"text-disabled":"",t,s,i,n,["default_account","default_guest","guest_only","account_only"],e.checkout_type,(e=>this.t(`checkout_type_${e}`)),(t=>{e.checkout_type=t.detail,this.edit({json:JSON.stringify(e)})}),i?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("checkout-type:after"))}__renderConsent(e){const{lang:t,ns:s}=this,i=e.tos_checkbox_settings,n=e.newsletter_subscribe,a=e.eu_secure_data_transfer_consent,r=!this.in("idle")||this.disabledSelector.matches("consent",!0),l=this.readonlySelector.matches("consent",!0),d="margin-left: calc(1.125rem + (var(--lumo-space-m) * 2))";return o(P||(P=Z` <div data-testid="consent"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="consent" ns="${0}"> </foxy-i18n> <x-checkbox data-testid="consent-tos-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="display_tos_link" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="display_tos_link_explainer" ns="${0}"> </foxy-i18n> </div> <div slot="content" ?hidden="${0}"> <vaadin-text-field data-testid="consent-tos-field" label="${0}" class="w-full mt-m" placeholder="https://example.com/path/to/tos" clear-button-visible ?disabled="${0}" ?readonly="${0}" .value="${0}" @input="${0}"> </vaadin-text-field> <div class="flex flex-wrap -mx-s -mb-s mt-s"> <x-checkbox data-testid="consent-tos-require-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="require_consent" ns="${0}"> </foxy-i18n> </x-checkbox> <x-checkbox data-testid="consent-tos-state-check" class="m-s" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <foxy-i18n class="leading-s block" lang="${0}" key="checked_by_default" ns="${0}"> </foxy-i18n> </x-checkbox> </div> </div> </x-checkbox> <div style="${0}" class="border-b border-contrast-10"></div> <x-checkbox data-testid="consent-mail-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="newsletter_subscribe" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="newsletter_subscribe_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> <div style="${0}" class="border-b border-contrast-10"></div> <x-checkbox data-testid="consent-sdta-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" class="m-m" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="display_sdta" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="display_sdta_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </x-group> ${0} </div> `),this.renderTemplateOrSlot("consent:before"),r?"text-disabled":"",t,s,r,l,"required"===i.usage||"optional"===i.usage,(t=>{i.initial_state=t.detail?i.initial_state:"unchecked",i.is_hidden=!1,i.usage=t.detail?"required":"none",i.url=t.detail?i.url:"",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,"none"===i.usage,this.t("location_url"),r,l,i.url,(t=>{i.url=t.currentTarget.value,this.edit({json:JSON.stringify(e)})}),r,l,"required"===i.usage,(t=>{i.usage=t.detail?"required":"optional",this.edit({json:JSON.stringify(e)})}),t,s,r,l,"checked"===i.initial_state,(t=>{i.initial_state=t.detail?"checked":"unchecked",this.edit({json:JSON.stringify(e)})}),t,s,d,r,l,"required"===n.usage,(t=>{n.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,d,r,l,"required"===a.usage,(t=>{a.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("consent:after"))}__renderFields(e){const{lang:t,ns:s}=this,i=!this.in("idle")||this.disabledSelector.matches("fields",!0),n=this.readonlySelector.matches("fields",!0),a=e.custom_checkout_field_requirements;return o(M||(M=Z` <div data-testid="fields"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="field_plural" ns="${0}"> </foxy-i18n> <div class="bg-contrast-10 grid grid-cols-1 sm-grid-cols-2" style="gap:1px"> ${0} <div class="bg-base hidden sm-block"></div> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("fields:before"),i?"text-disabled":"",t,s,Object.entries({cart_controls:["enabled","disabled"],coupon_entry:["enabled","disabled"],billing_first_name:["default","optional","required","hidden"],billing_last_name:["default","optional","required","hidden"],billing_company:["default","optional","required","hidden"],billing_tax_id:["default","optional","required","hidden"],billing_phone:["default","optional","required","hidden"],billing_address1:["default","optional","required","hidden"],billing_address2:["default","optional","required","hidden"],billing_city:["default","optional","required","hidden"],billing_region:["default","optional","required","hidden"],billing_postal_code:["default","optional","required","hidden"],billing_country:["default","optional","required","hidden"]}).map((([r,l])=>o(W||(W=Z` <label class="${0}"> <foxy-i18n class="flex-1" lang="${0}" key="${0}" ns="${0}"> </foxy-i18n> <div class="${0}"> ${0} </div> <div class="${0}"> <select data-testid="fields-${0}" class="${0}" ?disabled="${0}" ?readonly="${0}" @change="${0}"> ${0} </select> <iron-icon class="pointer-events-none icon-inline text-xl" icon="icons:expand-more"> </iron-icon> </div> </label> `),h({"flex items-center pl-m bg-base":!0,"text-secondary":n,"text-disabled":i}),t,r.replace("billing_",""),s,h({"flex items-center text-right font-medium h-s px-s m-xs":n,hidden:!n}),this.t(l.find((e=>a[r]===e))),h({"px-s m-xs flex items-center rounded leading-none":!0,"ring-primary-50 ring-inset focus-within-ring-2":!i,"hover-text-primary":!i,"cursor-pointer":!i,"cursor-default":i,flex:!n,hidden:n}),r,h({"h-s mr-xs text-right appearance-none bg-transparent font-medium":!0,"focus-outline-none cursor-pointer":!i,"cursor-default":i}),i,n,(t=>{const s=t.currentTarget,i=s.options[s.options.selectedIndex].value;a[r]=i,this.edit({json:JSON.stringify(e)})}),l.map((e=>o(K||(K=Z` <option value="${0}" ?selected="${0}"> ${0} </option> `),e,a[r]===e,this.t(e))))))),this.renderTemplateOrSlot("fields:after"))}__renderGoogleAnalytics(e){const{lang:t,ns:s}=this,i=e.analytics_config,n=i.google_tag,a=i.google_analytics,r=!this.in("idle")||this.disabledSelector.matches("google-analytics",!0),l=this.readonlySelector.matches("google-analytics",!0);return o(Q||(Q=Z` <div data-testid="google-analytics"> ${0} <x-group frame> <span class="${0}" slot="header">Google Analytics</span> <foxy-i18n class="block bg-error-10 text-error font-medium rounded-t p-m" infer="" key="ga_deprecation_notice"> </foxy-i18n> <div class="p-m space-y-m"> <vaadin-text-field data-testid="google-analytics-field" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="UA-1234567-1" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <x-checkbox data-testid="google-analytics-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="ga_include_on_site" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="ga_include_on_site_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("google-analytics:before"),r?"text-disabled":"",this.t("ga_account_id"),this.t("ga_account_id_explainer"),f(a.account_id),r,l,(e=>"Enter"===e.key&&this.submit()),(t=>{a.account_id=t.currentTarget.value,a.usage=a.account_id?"required":"none",i.usage=a.account_id||n.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),r,l,a.include_on_site,(t=>{a.include_on_site=t.detail,this.edit({json:JSON.stringify(e)})}),t,s,r?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("google-analytics:after"))}__renderGoogleTag(e){const t=e.analytics_config,s=t.google_tag,i=t.google_analytics,n=!this.in("idle")||this.disabledSelector.matches("google-tag",!0),a=this.readonlySelector.matches("google-tag",!0);return o(X||(X=Z` <div data-testid="google-tag"> ${0} <x-group frame> <span class="${0}" slot="header">Google Tag</span> <div class="p-m space-y-m"> <vaadin-text-field data-testid="google-tag-account-id" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="G-123456789" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <vaadin-text-field data-testid="google-tag-send-to" style="--lumo-border-radius:var(--lumo-border-radius-s)" class="w-full" label="${0}" placeholder="AW-123456789/sABDCLqU3K2BEJb8cxDE" helper-text="${0}" .value="${0}" ?disabled="${0}" ?readonly="${0}" clear-button-visible @keydown="${0}" @input="${0}"> </vaadin-text-field> <p class="text-xs text-secondary"> <foxy-i18n infer="" key="gt_usage_notice"></foxy-i18n> <a target="_blank" class="cursor-pointer group text-primary rounded-s font-medium focus-outline-none focus-ring-2 focus-ring-primary-50" href="https://wiki.foxycart.com/v/2.0/analytics#google_tag_ga4_google_ads" rel="nofollow noreferrer noopener"> <foxy-i18n class="transition-opacity group-hover-opacity-80" infer="" key="gt_docs_link"> </foxy-i18n> </a> </p> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("google-tag:before"),n?"text-disabled":"",this.t("gt_account_id"),this.t("gt_account_id_explainer"),f(s.account_id),n,a,(e=>"Enter"===e.key&&this.submit()),(o=>{s.account_id=o.currentTarget.value,s.usage=s.account_id?"required":"none",t.usage=s.account_id||i.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),this.t("gt_send_to"),this.t("gt_send_to_explainer"),f(s.send_to),n,a,(e=>"Enter"===e.key&&this.submit()),(o=>{s.send_to=o.currentTarget.value,s.usage=s.account_id?"required":"none",t.usage=s.account_id||i.account_id?"required":"none",this.edit({json:JSON.stringify(e)})}),this.renderTemplateOrSlot("google-tag:after"))}__renderTroubleshooting(e){const{lang:t,ns:s}=this,i=e.debug,n=!this.in("idle")||this.disabledSelector.matches("troubleshooting",!0),a=this.readonlySelector.matches("troubleshooting",!0);return o(Y||(Y=Z` <div data-testid="troubleshooting"> ${0} <x-group frame> <foxy-i18n class="${0}" slot="header" lang="${0}" key="troubleshooting" ns="${0}"> </foxy-i18n> <div class="p-m space-y-m"> <x-checkbox data-testid="troubleshooting-check" ?disabled="${0}" ?readonly="${0}" ?checked="${0}" @change="${0}"> <div class="flex flex-col"> <foxy-i18n lang="${0}" key="troubleshooting_debug" ns="${0}"></foxy-i18n> <foxy-i18n class="text-xs leading-s ${0}" lang="${0}" key="troubleshooting_debug_explainer" ns="${0}"> </foxy-i18n> </div> </x-checkbox> </div> </x-group> ${0} </div> `),this.renderTemplateOrSlot("troubleshooting:before"),n?"text-disabled":"",t,s,n,a,"required"===i.usage,(t=>{i.usage=t.detail?"required":"none",this.edit({json:JSON.stringify(e)})}),t,s,n?"text-disabled":"text-secondary",t,s,this.renderTemplateOrSlot("troubleshooting:after"))}}customElements.define("foxy-template-config-form",te);export{te as TemplateConfigForm};

package/dist/cdn/foxy-template-form.js

@@ -1 +1 @@
-import"./shared-7abbc95c.js";import"./shared-9048eeb2.js";import"./shared-799dc083.js";import"./shared-f29acc38.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-2edcd981.js";import{_ as e}from"./shared-4c2e9064.js";import{h as t}from"./shared-7f33a83a.js";import"./shared-5784c088.js";import"./shared-eb8a0fdf.js";import"./shared-099c1f57.js";import{S as s,T as a,a as i}from"./shared-3b709ddc.js";import{c as r}from"./shared-4e709717.js";import{C as n,a as o}from"./shared-601f27b1.js";import"./shared-621b3283.js";import"./shared-f21e5761.js";import"./shared-13fbea95.js";import"./shared-3c2414d4.js";import"./shared-bee111d6.js";import"./shared-ef7f2d07.js";import{G as d}from"./shared-d1f5de89.js";import"./shared-3f04e4cc.js";import{M as l}from"./shared-4205699e.js";import{C as c}from"./shared-5cf7b194.js";import{N as h}from"./shared-9b12aeac.js";import"./shared-e5239bec.js";import"./shared-ff7fd5fa.js";import"./shared-ba93be6b.js";import"./shared-fd96bcd1.js";import"./shared-d519a301.js";import"./shared-b446c140.js";import"./shared-343d1fd7.js";import"./shared-6daeb197.js";import"./shared-11c2efc8.js";import"./shared-e8a51c60.js";import"./shared-35728235.js";import"./shared-f5bbb1e0.js";import"./shared-fff03a45.js";import"./shared-d3bf9ac0.js";import"./shared-3ab0306f.js";let m,f,p,u,_,b,$=e=>e;const y=s(a(c(i(h,"template-form"))));class v extends y{constructor(){super(...arguments),this.templates={},this.__cacheState="idle",this.__contentChoice="default"}static get properties(){return e(e({},super.properties),{},{__cacheState:{attribute:!1},__contentChoice:{attribute:!1}})}static get scopedElements(){return{"foxy-internal-confirm-dialog":customElements.get("foxy-internal-confirm-dialog"),"foxy-internal-source-control":customElements.get("foxy-internal-source-control"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"vaadin-text-field":customElements.get("vaadin-text-field"),"vaadin-button":customElements.get("vaadin-button"),"x-metadata":l,"x-choice":n,"x-group":d}}render(){var e,s;const{hiddenSelector:a,href:i,lang:n,ns:o}=this,d=i?"delete":"create",l=this.in("busy"),c=this.in("fail");return t(m||(m=$` <div class="space-y-m relative"> ${0} ${0} ${0} ${0} <div data-testid="spinner" class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),a.matches("description",!0)?"":this.__renderDescription(),a.matches("content",!0)?"":this.__renderContent(),a.matches("timestamps",!0)||!i?"":this.__renderTimestamps(),a.matches(d)?"":this.__renderAction(d),r({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":!l&&!c}),c?"error":l?"busy":"empty",n,o,null!==(s=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==s?s:"")}async _sendPost(e){const t=await super._sendPost(e);if(!t.content_url)return t;this.__cacheState="busy";const s=t._links["fx:cache"].href,a=await new v.API(this).fetch(s,{method:"POST"});return this.__cacheState=a.ok?"idle":"fail",await this._fetch(t._links.self.href)}async _sendPatch(e){const t=await super._sendPatch(e);if(!e.content_url)return t;this.__cacheState="busy";const s=t._links["fx:cache"].href,a=await new v.API(this).fetch(s,{method:"POST"});return this.__cacheState=a.ok?"idle":"fail",await this._fetch(t._links.self.href)}__renderDescription(){var e,s;const a="description";return t(f||(f=$` <div> ${0} <vaadin-text-field data-testid="${0}" class="w-full mb-s" label="${0}" ?disabled="${0}" ?readonly="${0}" .value="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot(`${a}:before`),a,this.t(a),!this.in("idle")||this.disabledSelector.matches(a),this.readonlySelector.matches(a),null!==(s=null===(e=this.form)||void 0===e?void 0:e.description)&&void 0!==s?s:"",(e=>"Enter"===e.key&&this.submit()),(e=>{this.edit({description:e.currentTarget.value})}),this.renderTemplateOrSlot(`${a}:after`))}__renderContent(){var e,s;const a="content",i=this.form.content_url,n=this.form.content,d=i?"url":n?"clipboard":this.__contentChoice,l=!this.in("idle")||this.disabledSelector.matches(a),c=this.readonlySelector.matches(a),h=c||!(null===(e=this.data)||void 0===e?void 0:e.content_url)||i!==this.data.content_url;return t(p||(p=$` <div data-testid="content"> <x-group frame> <foxy-i18n class="${0}" lang="${0}" slot="header" key="template" ns="${0}"> </foxy-i18n> <x-choice data-testid="content-type" .value="${0}" .items="${0}" ?readonly="${0}" ?disabled="${0}" @change="${0}"> ${0} <div style="--lumo-border-radius:var(--lumo-border-radius-s)" class="mb-m" slot="url" ?hidden="${0}"> <div class="flex items-end mt-0"> <vaadin-text-field data-testid="content-url" placeholder="https://example.com/my-template" label="${0}" class="flex-1 min-w-0" ?readonly="${0}" ?disabled="${0}" .value="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> <vaadin-button data-testid="cache" class="relative flex-shrink-0 ml-s" ?hidden="${0}" ?disabled="${0}" @click="${0}"> <foxy-i18n class="${0}" lang="${0}" key="cache" ns="${0}"> </foxy-i18n> <div class="${0}"> <foxy-spinner layout="no-label" class="m-auto" state="${0}" lang="${0}" ns="${0}"> </foxy-spinner> </div> </vaadin-button> </div> <foxy-internal-source-control placeholder="${0}" helper-text="" label="${0}" infer="content" class="mt-m${0}"> </foxy-internal-source-control> </div> <foxy-internal-source-control placeholder="${0}" helper-text="" label="${0}" infer="content" class="mb-m${0}" style="--lumo-border-radius:var(--lumo-border-radius-s)" slot="clipboard"> </foxy-internal-source-control> </x-choice> </x-group> </div> `),r({"transition-colors":!0,"text-disabled":l}),this.lang,this.ns,d,["default","url","clipboard"],c,l,(e=>{e instanceof o&&(this.edit({content:"",content_url:""}),this.__contentChoice=e.detail)}),["default","url","clipboard"].map((e=>t(u||(u=$` <div slot="${0}-label" class="py-s leading-s"> <foxy-i18n class="block" lang="${0}" key="template_${0}" ns="${0}"> </foxy-i18n> </div> `),e,this.lang,e,this.ns))),"url"!==d,this.t("url"),c,l,this.form.content_url,(e=>"Enter"===e.key&&this.submit()),(e=>{const t=e.currentTarget.value;this.edit({content:"",content_url:t})}),h,l||"busy"===this.__cacheState,this.__cache,r({"relative transition-opacity":!0,"opacity-0":"idle"!==this.__cacheState}),this.lang,this.ns,r({"absolute inset-0 flex transition-opacity":!0,"opacity-0":"idle"===this.__cacheState}),"fail"===this.__cacheState?"error":"busy",this.lang,this.ns,this.t("url_source_placeholder"),this.t("url_source_label"),(null===(s=this.data)||void 0===s?void 0:s.content)?"":" hidden",this.t("clipboard_source_placeholder"),this.t("clipboard_source_label"),"clipboard"===d?"":" hidden")}__renderTimestamps(){const e="timestamps";return t(_||(_=$` <div> ${0} <x-metadata data-testid="timestamps" .items="${0}"> </x-metadata> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),["date_modified","date_created"].map((e=>{var t;return{name:this.t(e),value:(null===(t=this.data)||void 0===t?void 0:t[e])?this.t("date",{value:new Date(this.data[e])}):""}})),this.renderTemplateOrSlot(`${e}:after`))}__renderAction(e){const{disabledSelector:s,href:a,lang:i,ns:r}=this,n=this.in({idle:{template:{dirty:"valid"}}}),o=this.in({idle:{snapshot:{dirty:"valid"}}}),d=!this.in("idle")||s.matches(e,!0),l=n||o;return t(b||(b=$` <div> ${0} <foxy-internal-confirm-dialog message="delete_prompt" confirm="delete" cancel="cancel" header="delete" theme="primary error" lang="${0}" ns="${0}" id="confirm" data-testid="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> <vaadin-button class="w-full" theme="${0}" data-testid="${0}" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="${0}" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),i,r,(e=>{e.detail.cancelled||this.delete()}),this.in("idle")?a?"error":"primary success":"",e,this.in({idle:"template"})&&!l||d,(t=>{if("delete"===e){this.renderRoot.querySelector("#confirm").show(t.currentTarget)}else this.submit()}),r,e,i,this.renderTemplateOrSlot(`${e}:after`))}async __cache(){var e,t;this.__cacheState="busy";try{const s=null!==(t=null===(e=this.data)||void 0===e?void 0:e._links["fx:cache"].href)&&void 0!==t?t:"",a=await new v.API(this).fetch(s,{method:"POST"});this.__cacheState=a.ok?"idle":"fail",this.refresh()}catch(e){this.__cacheState="fail"}}}customElements.define("foxy-template-form",v);export{v as TemplateForm};
+import"./shared-7d933f9d.js";import"./shared-732bee4b.js";import"./shared-4e05dfb4.js";import"./shared-76e71481.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-51a5af7e.js";import{_ as e}from"./shared-4c2e9064.js";import{h as t}from"./shared-7f33a83a.js";import"./shared-fe927c53.js";import"./shared-e3096241.js";import"./shared-6e704d83.js";import{S as s,T as a,a as i}from"./shared-662c576b.js";import{c as r}from"./shared-4e709717.js";import{C as n,a as o}from"./shared-5742a841.js";import"./shared-8c681381.js";import"./shared-e2db3ab5.js";import"./shared-c00049b2.js";import"./shared-fc99076a.js";import"./shared-1dbad347.js";import"./shared-96215749.js";import{G as d}from"./shared-1313f293.js";import"./shared-e60dc924.js";import{M as l}from"./shared-fed6cd4d.js";import{C as c}from"./shared-5cf7b194.js";import{N as h}from"./shared-9b12aeac.js";import"./shared-f3b8de28.js";import"./shared-21293163.js";import"./shared-702eae16.js";import"./shared-fd96bcd1.js";import"./shared-d519a301.js";import"./shared-417ab233.js";import"./shared-343d1fd7.js";import"./shared-53d66db2.js";import"./shared-11c2efc8.js";import"./shared-e8a51c60.js";import"./shared-35728235.js";import"./shared-7b771301.js";import"./shared-71b3559f.js";import"./shared-d3bf9ac0.js";import"./shared-3ab0306f.js";let m,f,p,u,_,b,$=e=>e;const y=s(a(c(i(h,"template-form"))));class v extends y{constructor(){super(...arguments),this.templates={},this.__cacheState="idle",this.__contentChoice="default"}static get properties(){return e(e({},super.properties),{},{__cacheState:{attribute:!1},__contentChoice:{attribute:!1}})}static get scopedElements(){return{"foxy-internal-confirm-dialog":customElements.get("foxy-internal-confirm-dialog"),"foxy-internal-source-control":customElements.get("foxy-internal-source-control"),"foxy-internal-sandbox":customElements.get("foxy-internal-sandbox"),"foxy-spinner":customElements.get("foxy-spinner"),"foxy-i18n":customElements.get("foxy-i18n"),"vaadin-text-field":customElements.get("vaadin-text-field"),"vaadin-button":customElements.get("vaadin-button"),"x-metadata":l,"x-choice":n,"x-group":d}}render(){var e,s;const{hiddenSelector:a,href:i,lang:n,ns:o}=this,d=i?"delete":"create",l=this.in("busy"),c=this.in("fail");return t(m||(m=$` <div class="space-y-m relative"> ${0} ${0} ${0} ${0} <div data-testid="spinner" class="${0}"> <foxy-spinner layout="vertical" class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l" state="${0}" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),a.matches("description",!0)?"":this.__renderDescription(),a.matches("content",!0)?"":this.__renderContent(),a.matches("timestamps",!0)||!i?"":this.__renderTimestamps(),a.matches(d)?"":this.__renderAction(d),r({"transition duration-500 ease-in-out absolute inset-0 flex":!0,"opacity-0 pointer-events-none":!l&&!c}),c?"error":l?"busy":"empty",n,o,null!==(s=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==s?s:"")}async _sendPost(e){const t=await super._sendPost(e);if(!t.content_url)return t;this.__cacheState="busy";const s=t._links["fx:cache"].href,a=await new v.API(this).fetch(s,{method:"POST"});return this.__cacheState=a.ok?"idle":"fail",await this._fetch(t._links.self.href)}async _sendPatch(e){const t=await super._sendPatch(e);if(!e.content_url)return t;this.__cacheState="busy";const s=t._links["fx:cache"].href,a=await new v.API(this).fetch(s,{method:"POST"});return this.__cacheState=a.ok?"idle":"fail",await this._fetch(t._links.self.href)}__renderDescription(){var e,s;const a="description";return t(f||(f=$` <div> ${0} <vaadin-text-field data-testid="${0}" class="w-full mb-s" label="${0}" ?disabled="${0}" ?readonly="${0}" .value="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> ${0} </div> `),this.renderTemplateOrSlot(`${a}:before`),a,this.t(a),!this.in("idle")||this.disabledSelector.matches(a),this.readonlySelector.matches(a),null!==(s=null===(e=this.form)||void 0===e?void 0:e.description)&&void 0!==s?s:"",(e=>"Enter"===e.key&&this.submit()),(e=>{this.edit({description:e.currentTarget.value})}),this.renderTemplateOrSlot(`${a}:after`))}__renderContent(){var e,s;const a="content",i=this.form.content_url,n=this.form.content,d=i?"url":n?"clipboard":this.__contentChoice,l=!this.in("idle")||this.disabledSelector.matches(a),c=this.readonlySelector.matches(a),h=c||!(null===(e=this.data)||void 0===e?void 0:e.content_url)||i!==this.data.content_url;return t(p||(p=$` <div data-testid="content"> <x-group frame> <foxy-i18n class="${0}" lang="${0}" slot="header" key="template" ns="${0}"> </foxy-i18n> <x-choice data-testid="content-type" .value="${0}" .items="${0}" ?readonly="${0}" ?disabled="${0}" @change="${0}"> ${0} <div style="--lumo-border-radius:var(--lumo-border-radius-s)" class="mb-m" slot="url" ?hidden="${0}"> <div class="flex items-end mt-0"> <vaadin-text-field data-testid="content-url" placeholder="https://example.com/my-template" label="${0}" class="flex-1 min-w-0" ?readonly="${0}" ?disabled="${0}" .value="${0}" @keydown="${0}" @input="${0}"> </vaadin-text-field> <vaadin-button data-testid="cache" class="relative flex-shrink-0 ml-s" ?hidden="${0}" ?disabled="${0}" @click="${0}"> <foxy-i18n class="${0}" lang="${0}" key="cache" ns="${0}"> </foxy-i18n> <div class="${0}"> <foxy-spinner layout="no-label" class="m-auto" state="${0}" lang="${0}" ns="${0}"> </foxy-spinner> </div> </vaadin-button> </div> <foxy-internal-source-control placeholder="${0}" helper-text="" label="${0}" infer="content" class="mt-m${0}"> </foxy-internal-source-control> </div> <foxy-internal-source-control placeholder="${0}" helper-text="" label="${0}" infer="content" class="mb-m${0}" style="--lumo-border-radius:var(--lumo-border-radius-s)" slot="clipboard"> </foxy-internal-source-control> </x-choice> </x-group> </div> `),r({"transition-colors":!0,"text-disabled":l}),this.lang,this.ns,d,["default","url","clipboard"],c,l,(e=>{e instanceof o&&(this.edit({content:"",content_url:""}),this.__contentChoice=e.detail)}),["default","url","clipboard"].map((e=>t(u||(u=$` <div slot="${0}-label" class="py-s leading-s"> <foxy-i18n class="block" lang="${0}" key="template_${0}" ns="${0}"> </foxy-i18n> </div> `),e,this.lang,e,this.ns))),"url"!==d,this.t("url"),c,l,this.form.content_url,(e=>"Enter"===e.key&&this.submit()),(e=>{const t=e.currentTarget.value;this.edit({content:"",content_url:t})}),h,l||"busy"===this.__cacheState,this.__cache,r({"relative transition-opacity":!0,"opacity-0":"idle"!==this.__cacheState}),this.lang,this.ns,r({"absolute inset-0 flex transition-opacity":!0,"opacity-0":"idle"===this.__cacheState}),"fail"===this.__cacheState?"error":"busy",this.lang,this.ns,this.t("url_source_placeholder"),this.t("url_source_label"),(null===(s=this.data)||void 0===s?void 0:s.content)?"":" hidden",this.t("clipboard_source_placeholder"),this.t("clipboard_source_label"),"clipboard"===d?"":" hidden")}__renderTimestamps(){const e="timestamps";return t(_||(_=$` <div> ${0} <x-metadata data-testid="timestamps" .items="${0}"> </x-metadata> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),["date_modified","date_created"].map((e=>{var t;return{name:this.t(e),value:(null===(t=this.data)||void 0===t?void 0:t[e])?this.t("date",{value:new Date(this.data[e])}):""}})),this.renderTemplateOrSlot(`${e}:after`))}__renderAction(e){const{disabledSelector:s,href:a,lang:i,ns:r}=this,n=this.in({idle:{template:{dirty:"valid"}}}),o=this.in({idle:{snapshot:{dirty:"valid"}}}),d=!this.in("idle")||s.matches(e,!0),l=n||o;return t(b||(b=$` <div> ${0} <foxy-internal-confirm-dialog message="delete_prompt" confirm="delete" cancel="cancel" header="delete" theme="primary error" lang="${0}" ns="${0}" id="confirm" data-testid="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> <vaadin-button class="w-full" theme="${0}" data-testid="${0}" ?disabled="${0}" @click="${0}"> <foxy-i18n ns="${0}" key="${0}" lang="${0}"></foxy-i18n> </vaadin-button> ${0} </div> `),this.renderTemplateOrSlot(`${e}:before`),i,r,(e=>{e.detail.cancelled||this.delete()}),this.in("idle")?a?"error":"primary success":"",e,this.in({idle:"template"})&&!l||d,(t=>{if("delete"===e){this.renderRoot.querySelector("#confirm").show(t.currentTarget)}else this.submit()}),r,e,i,this.renderTemplateOrSlot(`${e}:after`))}async __cache(){var e,t;this.__cacheState="busy";try{const s=null!==(t=null===(e=this.data)||void 0===e?void 0:e._links["fx:cache"].href)&&void 0!==t?t:"",a=await new v.API(this).fetch(s,{method:"POST"});this.__cacheState=a.ok?"idle":"fail",this.refresh()}catch(e){this.__cacheState="fail"}}}customElements.define("foxy-template-form",v);export{v as TemplateForm};

package/dist/cdn/foxy-template-set-card.js

@@ -1 +1 @@
-import"./shared-f9180815.js";import"./foxy-spinner.js";import{a as r}from"./shared-3b709ddc.js";import{T as s}from"./shared-f0a9f3c2.js";import{h as e}from"./shared-7f33a83a.js";import"./shared-5784c088.js";import"./shared-e5239bec.js";import"./shared-b446c140.js";import"./shared-2edcd981.js";import"./shared-4c2e9064.js";import"./shared-343d1fd7.js";import"./shared-fd96bcd1.js";import"./shared-5cf7b194.js";import"./shared-d3bf9ac0.js";import"./shared-31d8e3b8.js";import"./shared-9b12aeac.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-4e709717.js";let d,t,a=r=>r;const o=r(s,"template-set-card");class m extends o{renderBody(){return super.renderBody({title:r=>e(d||(d=a`${0}`),r.description),subtitle:r=>e(t||(t=a`${0}`),r.code)})}}customElements.define("foxy-template-set-card",m);export{m as TemplateSetCard};
+import"./shared-f9180815.js";import"./foxy-spinner.js";import{a as r}from"./shared-662c576b.js";import{T as s}from"./shared-468de081.js";import{h as e}from"./shared-7f33a83a.js";import"./shared-fe927c53.js";import"./shared-f3b8de28.js";import"./shared-417ab233.js";import"./shared-51a5af7e.js";import"./shared-4c2e9064.js";import"./shared-343d1fd7.js";import"./shared-fd96bcd1.js";import"./shared-5cf7b194.js";import"./shared-d3bf9ac0.js";import"./shared-112dbca7.js";import"./shared-9b12aeac.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-4e709717.js";let a,t,d=r=>r;const o=r(s,"template-set-card");class m extends o{renderBody(){return super.renderBody({title:r=>e(a||(a=d`${0}`),r.description),subtitle:r=>e(t||(t=d`${0}`),r.code)})}}customElements.define("foxy-template-set-card",m);export{m as TemplateSetCard};

package/dist/cdn/foxy-template-set-form.js

@@ -1 +1 @@
-import"./shared-c839e147.js";import"./shared-0c0ee663.js";import"./shared-d90dbae7.js";import"./shared-f9180815.js";import{I as e}from"./shared-5280c80a.js";import"./foxy-nucleon-element.js";import"./foxy-i18n-editor.js";import{_ as t,B as o}from"./shared-4c2e9064.js";import{R as r,a}from"./shared-3b709ddc.js";import{i as s}from"./shared-d3bf9ac0.js";import{h as d}from"./shared-7f33a83a.js";import"./shared-ef7f2d07.js";import"./shared-eb8a0fdf.js";import"./shared-e5239bec.js";import"./shared-3f04e4cc.js";import"./shared-fff03a45.js";import"./shared-5784c088.js";import"./shared-7abbc95c.js";import"./shared-ff7fd5fa.js";import"./shared-ba93be6b.js";import"./shared-2edcd981.js";import"./shared-343d1fd7.js";import"./shared-fd96bcd1.js";import"./shared-5cf7b194.js";import"./shared-9b12aeac.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-9048eeb2.js";import"./shared-799dc083.js";import"./shared-621b3283.js";import"./shared-4e709717.js";import"./foxy-spinner.js";import"./shared-b446c140.js";import"./shared-fd40a40c.js";import"./shared-f5bbb1e0.js";import"./shared-d519a301.js";let i,n,l=e=>e;const h=r(a(e,"template-set-form"));class c extends h{constructor(){super(...arguments),this.paymentMethodSets=null,this.languageStrings=null,this.localeCodes=null,this.languages=null,this.templates={},this.__paymentMethodSetLoaderId="paymentMethodSetLoader",this.__localeCodesLoaderId="localeCodesLoader",this.__languagesLoaderId="languagesLoader"}static get properties(){return t(t({},super.properties),{},{paymentMethodSets:{attribute:"payment-method-sets"},languageStrings:{attribute:"language-strings"},localeCodes:{attribute:"locale-codes"},languages:{}})}static get v8n(){return[({description:e})=>!!e||"description:v8n_required",({description:e})=>!!e&&e.length<=100||"description:v8n_too_long",({code:e})=>!!e||"code:v8n_required",({code:e})=>!!e&&e.length<=50||"code:v8n_too_long",({language:e})=>!!e||"language:v8n_required",({locale_code:e})=>!!e||"locale_code:v8n_required"]}get disabledSelector(){var e,t,r;const a=[];return(null===(e=this.__languagesLoader)||void 0===e?void 0:e.data)||a.push("language"),(null===(t=this.__localeCodesLoader)||void 0===t?void 0:t.data)||a.push("locale-code"),!(null===(r=this.__paymentMethodSetLoader)||void 0===r?void 0:r.data)&&this.form.payment_method_set_uri&&a.push("payment-method-set-uri"),new o(`${a.join(" ")} ${super.disabledSelector}`)}get readonlySelector(){var e;const t=[];return"DEFAULT"===(null===(e=this.data)||void 0===e?void 0:e.code)&&t.push("code","description"),new o(`${t.join(" ")} ${super.readonlySelector}`)}get hiddenSelector(){var e;const t=[];return"DEFAULT"===(null===(e=this.data)||void 0===e?void 0:e.code)&&t.push("delete"),new o(`${t.join(" ")} ${super.hiddenSelector}`)}renderBody(){var e,t,o,r,a,h,c,u,p;const m=Object.entries(null!==(o=null===(t=null===(e=this.__localeCodesLoader)||void 0===e?void 0:e.data)||void 0===t?void 0:t.values)&&void 0!==o?o:{}).map((([e,t])=>({value:e,label:t}))),g=Object.entries(null!==(h=null===(a=null===(r=this.__languagesLoader)||void 0===r?void 0:r.data)||void 0===a?void 0:a.values)&&void 0!==h?h:{}).map((([e,t])=>({value:e,label:t})));return d(i||(i=l` <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <div class="grid grid-cols-1 gap-m sm-grid-cols-2"> <foxy-internal-text-control infer="description"></foxy-internal-text-control> <foxy-internal-text-control infer="code"></foxy-internal-text-control> <foxy-internal-select-control infer="language" .options="${0}"> </foxy-internal-select-control> <foxy-internal-select-control infer="locale-code" .options="${0}"> </foxy-internal-select-control> </div> <foxy-internal-async-combo-box-control item-label-path="description" item-id-path="_links.self.href" infer="payment-method-set-uri" first="${0}" .selectedItem="${0}"> </foxy-internal-async-combo-box-control> ${0} ${0} `),s(null!==(c=this.languages)&&void 0!==c?c:void 0),this.__languagesLoaderId,(()=>this.requestUpdate()),s(null!==(u=this.localeCodes)&&void 0!==u?u:void 0),this.__localeCodesLoaderId,(()=>this.requestUpdate()),s(this.form.payment_method_set_uri||void 0),this.__paymentMethodSetLoaderId,(()=>this.requestUpdate()),g,m,this.paymentMethodSets,null===(p=this.__paymentMethodSetLoader)||void 0===p?void 0:p.data,this.data&&this.languageStrings&&!this.hiddenSelector.matches("language-overrides",!0)?d(n||(n=l` ${0} <foxy-i18n-editor language-overrides="${0}" selected-language="${0}" infer="language-overrides" href="${0}"> </foxy-i18n-editor> ${0} `),this.renderTemplateOrSlot("language-overrides:before"),this.data._links["fx:language_overrides"].href,this.form.language,this.languageStrings,this.renderTemplateOrSlot("language-overrides:after")):"",super.renderBody())}get __paymentMethodSetLoader(){return this.renderRoot.querySelector(`#${this.__paymentMethodSetLoaderId}`)}get __localeCodesLoader(){return this.renderRoot.querySelector(`#${this.__localeCodesLoaderId}`)}get __languagesLoader(){return this.renderRoot.querySelector(`#${this.__languagesLoaderId}`)}}customElements.define("foxy-template-set-form",c);export{c as TemplateSetForm};
+import"./shared-da5e32c1.js";import"./shared-1a65fd20.js";import"./shared-f1b36324.js";import"./shared-f9180815.js";import{I as e}from"./shared-870074ff.js";import"./foxy-nucleon-element.js";import"./foxy-i18n-editor.js";import{_ as t,B as o}from"./shared-4c2e9064.js";import{R as r,a}from"./shared-662c576b.js";import{i as s}from"./shared-d3bf9ac0.js";import{h as d}from"./shared-7f33a83a.js";import"./shared-96215749.js";import"./shared-e3096241.js";import"./shared-f3b8de28.js";import"./shared-e60dc924.js";import"./shared-71b3559f.js";import"./shared-fe927c53.js";import"./shared-7d933f9d.js";import"./shared-21293163.js";import"./shared-702eae16.js";import"./shared-51a5af7e.js";import"./shared-343d1fd7.js";import"./shared-fd96bcd1.js";import"./shared-5cf7b194.js";import"./shared-9b12aeac.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-732bee4b.js";import"./shared-4e05dfb4.js";import"./shared-8c681381.js";import"./shared-4e709717.js";import"./foxy-spinner.js";import"./shared-417ab233.js";import"./shared-093b64b4.js";import"./shared-7b771301.js";import"./shared-d519a301.js";let i,n,l=e=>e;const h=r(a(e,"template-set-form"));class c extends h{constructor(){super(...arguments),this.paymentMethodSets=null,this.languageStrings=null,this.localeCodes=null,this.languages=null,this.templates={},this.__paymentMethodSetLoaderId="paymentMethodSetLoader",this.__localeCodesLoaderId="localeCodesLoader",this.__languagesLoaderId="languagesLoader"}static get properties(){return t(t({},super.properties),{},{paymentMethodSets:{attribute:"payment-method-sets"},languageStrings:{attribute:"language-strings"},localeCodes:{attribute:"locale-codes"},languages:{}})}static get v8n(){return[({description:e})=>!!e||"description:v8n_required",({description:e})=>!!e&&e.length<=100||"description:v8n_too_long",({code:e})=>!!e||"code:v8n_required",({code:e})=>!!e&&e.length<=50||"code:v8n_too_long",({language:e})=>!!e||"language:v8n_required",({locale_code:e})=>!!e||"locale_code:v8n_required"]}get disabledSelector(){var e,t,r;const a=[];return(null===(e=this.__languagesLoader)||void 0===e?void 0:e.data)||a.push("language"),(null===(t=this.__localeCodesLoader)||void 0===t?void 0:t.data)||a.push("locale-code"),!(null===(r=this.__paymentMethodSetLoader)||void 0===r?void 0:r.data)&&this.form.payment_method_set_uri&&a.push("payment-method-set-uri"),new o(`${a.join(" ")} ${super.disabledSelector}`)}get readonlySelector(){var e;const t=[];return"DEFAULT"===(null===(e=this.data)||void 0===e?void 0:e.code)&&t.push("code","description"),new o(`${t.join(" ")} ${super.readonlySelector}`)}get hiddenSelector(){var e;const t=[];return"DEFAULT"===(null===(e=this.data)||void 0===e?void 0:e.code)&&t.push("delete"),new o(`${t.join(" ")} ${super.hiddenSelector}`)}renderBody(){var e,t,o,r,a,h,c,u,p;const m=Object.entries(null!==(o=null===(t=null===(e=this.__localeCodesLoader)||void 0===e?void 0:e.data)||void 0===t?void 0:t.values)&&void 0!==o?o:{}).map((([e,t])=>({value:e,label:t}))),g=Object.entries(null!==(h=null===(a=null===(r=this.__languagesLoader)||void 0===r?void 0:r.data)||void 0===a?void 0:a.values)&&void 0!==h?h:{}).map((([e,t])=>({value:e,label:t})));return d(i||(i=l` <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <foxy-nucleon class="hidden" infer="" href="${0}" id="${0}" @update="${0}"> </foxy-nucleon> <div class="grid grid-cols-1 gap-m sm-grid-cols-2"> <foxy-internal-text-control infer="description"></foxy-internal-text-control> <foxy-internal-text-control infer="code"></foxy-internal-text-control> <foxy-internal-select-control infer="language" .options="${0}"> </foxy-internal-select-control> <foxy-internal-select-control infer="locale-code" .options="${0}"> </foxy-internal-select-control> </div> <foxy-internal-async-combo-box-control item-label-path="description" item-id-path="_links.self.href" infer="payment-method-set-uri" first="${0}" .selectedItem="${0}"> </foxy-internal-async-combo-box-control> ${0} ${0} `),s(null!==(c=this.languages)&&void 0!==c?c:void 0),this.__languagesLoaderId,(()=>this.requestUpdate()),s(null!==(u=this.localeCodes)&&void 0!==u?u:void 0),this.__localeCodesLoaderId,(()=>this.requestUpdate()),s(this.form.payment_method_set_uri||void 0),this.__paymentMethodSetLoaderId,(()=>this.requestUpdate()),g,m,this.paymentMethodSets,null===(p=this.__paymentMethodSetLoader)||void 0===p?void 0:p.data,this.data&&this.languageStrings&&!this.hiddenSelector.matches("language-overrides",!0)?d(n||(n=l` ${0} <foxy-i18n-editor language-overrides="${0}" selected-language="${0}" infer="language-overrides" href="${0}"> </foxy-i18n-editor> ${0} `),this.renderTemplateOrSlot("language-overrides:before"),this.data._links["fx:language_overrides"].href,this.form.language,this.languageStrings,this.renderTemplateOrSlot("language-overrides:after")):"",super.renderBody())}get __paymentMethodSetLoader(){return this.renderRoot.querySelector(`#${this.__paymentMethodSetLoaderId}`)}get __localeCodesLoader(){return this.renderRoot.querySelector(`#${this.__localeCodesLoaderId}`)}get __languagesLoader(){return this.renderRoot.querySelector(`#${this.__languagesLoaderId}`)}}customElements.define("foxy-template-set-form",c);export{c as TemplateSetForm};

package/dist/cdn/foxy-transaction-card.js

@@ -1 +1 @@
-import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-2edcd981.js";import{h as t}from"./shared-7f33a83a.js";import{C as e}from"./shared-5cf7b194.js";import{N as s}from"./shared-9b12aeac.js";import{T as i,a as r}from"./shared-3b709ddc.js";import{c as n}from"./shared-4e709717.js";import"./shared-5784c088.js";import"./shared-e5239bec.js";import"./shared-b446c140.js";import"./shared-4c2e9064.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-d3bf9ac0.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";let a,o,d,c,l,p,u,m,h,f,v,y,_,$=t=>t;const x=i(e(r(s,"transaction-card")));class b extends x{constructor(){super(...arguments),this.templates={},this.__currencyDisplay=""}render(){var e,s;const i=this.hiddenSelector,r=!i.matches("total",!0),d=!i.matches("status",!0);return t(a||(a=$` <div aria-busy="${0}" aria-live="polite" class="relative leading-s font-lumo text-m"> <div class="${0}"> ${0} ${0} ${0} </div> <div class="${0}"> <foxy-spinner data-testid="spinner" state="${0}" class="m-auto" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.in("busy"),n({"transition-opacity":!0,"opacity-0":!this.data}),r||d?t(o||(o=$` <div class="flex items-center justify-between gap-s"> ${0} ${0} </div> `),r?this.__renderTotal():"",d?this.__renderStatus():""):"",i.matches("description",!0)?"":this.__renderDescription(),i.matches("customer",!0)?"":this.__renderCustomer(),n({"pointer-events-none absolute inset-0 flex transition-opacity":!0,"opacity-0":!!this.data}),this.in("fail")?"error":this.in({idle:"template"})?"empty":"busy",this.lang,this.ns,null!==(s=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==s?s:"")}async _sendGet(){var t;const e=await super._sendGet(),s=null===(t=e._links["fx:store"])||void 0===t?void 0:t.href;if("string"==typeof s){const t=await super._fetch(s);this.__currencyDisplay=t.use_international_currency_symbol?"code":"symbol"}else this.__currencyDisplay="symbol";return e}__renderTotal(){var e,s;const i=this.data;let r;if(i){const n=`${i.total_order} ${i.currency_code}`,a=this.__currencyDisplay,o=["subscription_cancellation","subscription_modification","subscription_renewal","updateinfo"].includes(i.type)?i.type:"fx:subscription"in i._links?"new_subscription":"new_order",l=null===(s=null===(e=this.data)||void 0===e?void 0:e.source)||void 0===s?void 0:s.substring(0,3).toUpperCase();r=t(d||(d=$` ${0} <foxy-i18n class="truncate" lang="${0}" key="type_${0}" ns="${0}"></foxy-i18n> <span>&bull;</span> <foxy-i18n options="${0}" lang="${0}" key="price" ns="${0}"> </foxy-i18n> `),l?t(c||(c=$`<span title="${0}">${0}</span>`),this.t(`source_${l}`),l):"",this.lang,o,this.ns,JSON.stringify({amount:n,currencyDisplay:a}),this.lang,this.ns)}else r=t(l||(l=$`&ZeroWidthSpace;`));return t(p||(p=$` <div class="min-w-0" data-testid="total"> ${0} <div class="font-medium flex items-center gap-xs">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("total:before"),r,this.renderTemplateOrSlot("total:after"))}__renderStatus(){var e,s,i,r;const n=(null===(e=this.data)||void 0===e?void 0:e.status)||"completed";return t(u||(u=$` <div class="flex-shrink-0" data-testid="status"> ${0} <div class="text-tertiary text-s flex items-center space-x-s"> <foxy-i18n options="${0}" lang="${0}" key="time" ns="${0}"> </foxy-i18n> <iron-icon data-testid="status-icon" class="icon-inline text-l ${0}" title="${0}" icon="${0}"> </iron-icon> </div> ${0} </div> `),this.renderTemplateOrSlot("status:before"),JSON.stringify({value:null===(s=this.data)||void 0===s?void 0:s.transaction_date}),this.lang,this.ns,null!==(i={completed:"text-success",rejected:"text-error",declined:"text-error"}[n])&&void 0!==i?i:"text-tertiary",this.t(`transaction_${n}`),null!==(r={completed:"icons:done-all",refunded:"icons:restore",rejected:"icons:highlight-off",declined:"icons:highlight-off",voided:"icons:remove-circle-outline"}[n])&&void 0!==r?r:"icons:schedule",this.renderTemplateOrSlot("status:after"))}__renderDescription(){var e,s;const i=null===(s=null===(e=this.data)||void 0===e?void 0:e._embedded)||void 0===s?void 0:s["fx:items"];let r;if(i){const e={most_expensive_item:[...i].sort(((t,e)=>t.price-e.price))[0],count_minus_one:i.length-1,count:i.length};r=t(m||(m=$` <foxy-i18n options="${0}" lang="${0}" key="transaction_summary" ns="${0}"> </foxy-i18n> `),JSON.stringify(e),this.lang,this.ns)}else r=t(h||(h=$`&ZeroWidthSpace;`));return t(f||(f=$` <div data-testid="description"> ${0} <div class="text-s text-secondary truncate">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("description:before"),r,this.renderTemplateOrSlot("description:after"))}__renderCustomer(){const e=this.data,s=e?t(v||(v=$`${0} ${0} (${0})`),e.customer_first_name,e.customer_last_name,e.customer_email):t(y||(y=$`&ZeroWidthSpace;`));return t(_||(_=$` <div data-testid="customer"> ${0} <div class="text-tertiary truncate text-s">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("customer:before"),s,this.renderTemplateOrSlot("customer:after"))}}customElements.define("foxy-transaction-card",b);export{b as TransactionCard};
+import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-51a5af7e.js";import{h as t}from"./shared-7f33a83a.js";import{C as e}from"./shared-5cf7b194.js";import{N as s}from"./shared-9b12aeac.js";import{T as i,a as r}from"./shared-662c576b.js";import{c as n}from"./shared-4e709717.js";import"./shared-fe927c53.js";import"./shared-f3b8de28.js";import"./shared-417ab233.js";import"./shared-4c2e9064.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-d3bf9ac0.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";let a,o,d,c,l,p,u,m,h,f,v,y,_,$=t=>t;const x=i(e(r(s,"transaction-card")));class b extends x{constructor(){super(...arguments),this.templates={},this.__currencyDisplay=""}render(){var e,s;const i=this.hiddenSelector,r=!i.matches("total",!0),d=!i.matches("status",!0);return t(a||(a=$` <div aria-busy="${0}" aria-live="polite" class="relative leading-s font-lumo text-m"> <div class="${0}"> ${0} ${0} ${0} </div> <div class="${0}"> <foxy-spinner data-testid="spinner" state="${0}" class="m-auto" lang="${0}" ns="${0} ${0}"> </foxy-spinner> </div> </div> `),this.in("busy"),n({"transition-opacity":!0,"opacity-0":!this.data}),r||d?t(o||(o=$` <div class="flex items-center justify-between gap-s"> ${0} ${0} </div> `),r?this.__renderTotal():"",d?this.__renderStatus():""):"",i.matches("description",!0)?"":this.__renderDescription(),i.matches("customer",!0)?"":this.__renderCustomer(),n({"pointer-events-none absolute inset-0 flex transition-opacity":!0,"opacity-0":!!this.data}),this.in("fail")?"error":this.in({idle:"template"})?"empty":"busy",this.lang,this.ns,null!==(s=null===(e=customElements.get("foxy-spinner"))||void 0===e?void 0:e.defaultNS)&&void 0!==s?s:"")}async _sendGet(){var t;const e=await super._sendGet(),s=null===(t=e._links["fx:store"])||void 0===t?void 0:t.href;if("string"==typeof s){const t=await super._fetch(s);this.__currencyDisplay=t.use_international_currency_symbol?"code":"symbol"}else this.__currencyDisplay="symbol";return e}__renderTotal(){var e,s;const i=this.data;let r;if(i){const n=`${i.total_order} ${i.currency_code}`,a=this.__currencyDisplay,o=["subscription_cancellation","subscription_modification","subscription_renewal","updateinfo"].includes(i.type)?i.type:"fx:subscription"in i._links?"new_subscription":"new_order",l=null===(s=null===(e=this.data)||void 0===e?void 0:e.source)||void 0===s?void 0:s.substring(0,3).toUpperCase();r=t(d||(d=$` ${0} <foxy-i18n class="truncate" lang="${0}" key="type_${0}" ns="${0}"></foxy-i18n> <span>&bull;</span> <foxy-i18n options="${0}" lang="${0}" key="price" ns="${0}"> </foxy-i18n> `),l?t(c||(c=$`<span title="${0}">${0}</span>`),this.t(`source_${l}`),l):"",this.lang,o,this.ns,JSON.stringify({amount:n,currencyDisplay:a}),this.lang,this.ns)}else r=t(l||(l=$`&ZeroWidthSpace;`));return t(p||(p=$` <div class="min-w-0" data-testid="total"> ${0} <div class="font-medium flex items-center gap-xs">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("total:before"),r,this.renderTemplateOrSlot("total:after"))}__renderStatus(){var e,s,i,r;const n=(null===(e=this.data)||void 0===e?void 0:e.status)||"completed";return t(u||(u=$` <div class="flex-shrink-0" data-testid="status"> ${0} <div class="text-tertiary text-s flex items-center space-x-s"> <foxy-i18n options="${0}" lang="${0}" key="time" ns="${0}"> </foxy-i18n> <iron-icon data-testid="status-icon" class="icon-inline text-l ${0}" title="${0}" icon="${0}"> </iron-icon> </div> ${0} </div> `),this.renderTemplateOrSlot("status:before"),JSON.stringify({value:null===(s=this.data)||void 0===s?void 0:s.transaction_date}),this.lang,this.ns,null!==(i={completed:"text-success",rejected:"text-error",declined:"text-error"}[n])&&void 0!==i?i:"text-tertiary",this.t(`transaction_${n}`),null!==(r={completed:"icons:done-all",refunded:"icons:restore",rejected:"icons:highlight-off",declined:"icons:highlight-off",voided:"icons:remove-circle-outline"}[n])&&void 0!==r?r:"icons:schedule",this.renderTemplateOrSlot("status:after"))}__renderDescription(){var e,s;const i=null===(s=null===(e=this.data)||void 0===e?void 0:e._embedded)||void 0===s?void 0:s["fx:items"];let r;if(i){const e={most_expensive_item:[...i].sort(((t,e)=>t.price-e.price))[0],count_minus_one:i.length-1,count:i.length};r=t(m||(m=$` <foxy-i18n options="${0}" lang="${0}" key="transaction_summary" ns="${0}"> </foxy-i18n> `),JSON.stringify(e),this.lang,this.ns)}else r=t(h||(h=$`&ZeroWidthSpace;`));return t(f||(f=$` <div data-testid="description"> ${0} <div class="text-s text-secondary truncate">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("description:before"),r,this.renderTemplateOrSlot("description:after"))}__renderCustomer(){const e=this.data,s=e?t(v||(v=$`${0} ${0} (${0})`),e.customer_first_name,e.customer_last_name,e.customer_email):t(y||(y=$`&ZeroWidthSpace;`));return t(_||(_=$` <div data-testid="customer"> ${0} <div class="text-tertiary truncate text-s">${0}</div> ${0} </div> `),this.renderTemplateOrSlot("customer:before"),s,this.renderTemplateOrSlot("customer:after"))}}customElements.define("foxy-transaction-card",b);export{b as TransactionCard};

package/dist/cdn/foxy-transaction.js

@@ -1 +1 @@
-import"./foxy-attribute-card.js";import"./foxy-attribute-form.js";import"./foxy-custom-field-form.js";import"./foxy-custom-field-card.js";import"./foxy-applied-tax-card.js";import"./foxy-discount-card.js";import"./foxy-shipment-card.js";import"./foxy-payment-card.js";import"./foxy-item-form.js";import"./shared-2edcd981.js";import"./shared-406ce9ad.js";import{I as t}from"./shared-5280c80a.js";import{I as o}from"./shared-ba93be6b.js";import"./foxy-customer-card.js";import"./foxy-form-dialog.js";import"./foxy-customer.js";import{h as r,c as e}from"./shared-7f33a83a.js";import{i}from"./shared-d3bf9ac0.js";import"./shared-9048eeb2.js";import"./shared-799dc083.js";import{_ as s,B as n}from"./shared-4c2e9064.js";import{N as a}from"./shared-9b12aeac.js";import{a as d}from"./shared-3b709ddc.js";import"./shared-b446c140.js";import"./shared-5784c088.js";import"./shared-e5239bec.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-5cf7b194.js";import"./shared-4e709717.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-6daeb197.js";import"./shared-eb8a0fdf.js";import"./shared-7abbc95c.js";import"./shared-3f04e4cc.js";import"./shared-099c1f57.js";import"./shared-601f27b1.js";import"./shared-13fbea95.js";import"./shared-3c2414d4.js";import"./shared-bee111d6.js";import"./shared-ef7f2d07.js";import"./shared-fff03a45.js";import"./shared-11c2efc8.js";import"./shared-621b3283.js";import"./shared-f21e5761.js";import"./shared-f5bbb1e0.js";import"./shared-d1f5de89.js";import"./shared-4205699e.js";import"./shared-ad80244a.js";import"./shared-f0a9f3c2.js";import"./shared-31d8e3b8.js";import"./shared-9aa72495.js";import"./foxy-item-card.js";import"./shared-584174ff.js";import"./foxy-nucleon-element.js";import"./shared-5a889c45.js";import"./shared-ff7fd5fa.js";import"./shared-5103c1b4.js";import"./foxy-collection-page.js";import"./shared-d519a301.js";import"./foxy-swipe-actions.js";import"./foxy-pagination.js";import"./shared-27d21f4a.js";import"./shared-d90dbae7.js";import"./foxy-discount-detail-card.js";import"./foxy-coupon-detail-card.js";import"./foxy-item-option-card.js";import"./foxy-item-option-form.js";import"./foxy-coupon-card.js";import"./shared-c839e147.js";import"./foxy-discount-builder.js";import"./shared-bb05cfed.js";import"./shared-773e7177.js";import"./shared-c76ef8d8.js";import"./shared-79d0699c.js";import"./shared-efaf8d49.js";import"./foxy-subscription-card.js";import"./shared-630a0ff2.js";import"./foxy-subscription-form.js";import"./foxy-cancellation-form.js";import"./foxy-transaction-card.js";import"./shared-e006e82c.js";import"./shared-800ee6c0.js";import"./shared-d7be11de.js";import"./foxy-payment-method-card.js";import"./foxy-transactions-table.js";import"./shared-7a455b15.js";import"./foxy-collection-pages.js";import"./foxy-customer-form.js";import"./shared-b87d1af0.js";import"./shared-1196b6a7.js";import"./shared-de3dae6c.js";import"./shared-b738ee96.js";import"./foxy-address-card.js";import"./foxy-address-form.js";import"./foxy-table.js";import"./shared-f29d410a.js";let l,c=t=>t;customElements.define("foxy-internal-transaction-customer-control",class extends o{renderControl(){var t,o,e,s;return r(l||(l=c` <foxy-internal-details summary="customer" infer="" open> <foxy-form-dialog header="header" infer="dialog" form="foxy-customer" href="${0}" id="dialog"> </foxy-form-dialog> <button class="w-full text-left block rounded-b-l transition-colors hover-bg-contrast-5 focus-outline-none focus-ring-2 focus-ring-primary-50" @click="${0}"> <foxy-customer-card infer="card" class="p-m" href="${0}"> </foxy-customer-card> </button> </foxy-internal-details> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:customer"].href),(t=>{this.renderRoot.querySelector("#dialog").show(t.currentTarget)}),i(null===(s=null===(e=this.nucleon)||void 0===e?void 0:e.data)||void 0===s?void 0:s._links["fx:customer"].href))}});let f,m=t=>t;customElements.define("foxy-internal-transaction-post-action-control",class extends o{constructor(){super(...arguments),this.theme=null,this.href=null,this.__state="idle"}static get properties(){return s(s({},super.properties),{},{__state:{type:String},theme:{type:String},href:{type:String}})}renderControl(){const t=this.__state,o="fail"===t?"error":"idle"===t?this.theme:"";return r(f||(f=m` <foxy-internal-confirm-dialog header="header" infer="confirm" id="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> <vaadin-button class="w-full" theme="${0} tertiary" ?disabled="${0}" @click="${0}"> <foxy-i18n key="${0}" infer=""></foxy-i18n> </vaadin-button> `),(t=>!t.detail.cancelled&&this.__submit()),o,"busy"===t||this.disabled,(t=>{this.renderRoot.querySelector("#confirm").show(t.currentTarget)}),t)}async __submit(){var t;if("busy"!==this.__state)try{this.__state="busy";const o=new a.API(this),r=await o.fetch(null!==(t=this.href)&&void 0!==t?t:"",{method:"POST"});this.__state=r.ok?"idle":"fail",r.ok&&this.dispatchEvent(new CustomEvent("done"))}catch(t){this.__state="fail"}}});let u,p,h,y,x,v=t=>t;customElements.define("foxy-internal-transaction-actions-control",class extends o{renderControl(){var t,o,e,i,s,n,a,d;return r(u||(u=v` <div class="divide-y divide-contrast-10"> ${0} ${0} ${0} ${0} </div> `),(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:capture"])?this.__renderCaptureAction():"",(null===(i=null===(e=this.nucleon)||void 0===e?void 0:e.data)||void 0===i?void 0:i._links["fx:void"])?this.__renderVoidAction():"",(null===(n=null===(s=this.nucleon)||void 0===s?void 0:s.data)||void 0===n?void 0:n._links["fx:refund"])?this.__renderRefundAction():"",(null===(d=null===(a=this.nucleon)||void 0===a?void 0:a.data)||void 0===d?void 0:d._links["fx:send_emails"])?this.__renderSendEmailsAction():"")}__renderSendEmailsAction(){var t,o;return r(p||(p=v` <foxy-internal-transaction-post-action-control infer="send-emails" theme="contrast" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:send_emails"].href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderCaptureAction(){var t,o;return r(h||(h=v` <foxy-internal-transaction-post-action-control theme="success" infer="capture" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:capture"].href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderVoidAction(){var t,o,e;return r(y||(y=v` <foxy-internal-transaction-post-action-control theme="error" infer="void" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(e=null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:void"])||void 0===e?void 0:e.href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderRefundAction(){var t,o,e;return r(x||(x=v` <foxy-internal-transaction-post-action-control theme="contrast" infer="refund" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(e=null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:refund"])||void 0===e?void 0:e.href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}});let j,_,b,$,g,k,w,S,A,E=t=>t;customElements.define("foxy-internal-transaction-summary-control",class extends o{renderControl(){var t;return r(j||(j=E` <div class="border-t border-transparent"> <div class="h-m flex items-center justify-between"> <div class="text-xl font-medium">${0}</div> <div>${0}</div> </div> <div class="border-t border-contrast-10 mb-s"></div> ${0} </div> `),this.__renderPrice(),(null===(t=this.nucleon)||void 0===t?void 0:t.data)?this.__renderStatus():"",this.__renderTotals())}__renderStatus(){var t,o;const e={authorized:"bg-success text-success-contrast",completed:"bg-success text-success-contrast",declined:"bg-error text-error-contrast",rejected:"bg-error text-error-contrast"},i=(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o.status)||"completed";return r(_||(_=E` <foxy-i18n class="flex items-center h-xs px-s text-s font-medium rounded ${0}" infer="" key="transaction_${0}"> </foxy-i18n> `),i in e?e[i]:"bg-contrast-5 text-contrast",i)}__renderPrice(){var t;const o=null===(t=this.nucleon)||void 0===t?void 0:t.data,e=null==o?void 0:o.currency_code;if(!o)return r(b||(b=E`--`));const i={amount:`${o.total_order} ${e}`};return r($||($=E`<foxy-i18n infer="" key="price" .options="${0}"></foxy-i18n>`),i)}__renderTotals(){var t,o;const e=null===(t=this.nucleon)||void 0===t?void 0:t.data,i=null===(o=null==e?void 0:e._embedded)||void 0===o?void 0:o["fx:discounts"],s=null==i?void 0:i.reduce(((t,o)=>t+o.amount),0),n=null==e?void 0:e.currency_code;return r(g||(g=E` ${0} ${0} `),["total_item_price","total_shipping","total_tax"].map((t=>{const o={amount:`${null==e?void 0:e[t]} ${n}`};return r(k||(k=E` <div class="flex justify-between text-m text-secondary"> <foxy-i18n key="${0}" infer=""></foxy-i18n> ${0} </div> `),t,e?r(w||(w=E`<foxy-i18n infer="" key="price" .options="${0}"></foxy-i18n>`),o):r(S||(S=E`<span>--</span>`)))})),s?r(A||(A=E` <div class="flex justify-between text-m text-secondary"> <foxy-i18n key="total_discount" infer=""></foxy-i18n> <foxy-i18n infer="" key="${0}" .options="${0}"> </foxy-i18n> </div> `),20===(null==i?void 0:i.length)?"total_discount_see_below":"price",{amount:`${s} ${n}`}):"")}});let C,T,P=t=>t;class R extends(d(t,"transaction")){static get styles(){return[...super.styles,e(C||(C=P`#body{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(18.75 * var(--lumo-space-m)),1fr))}#body>:first-child{grid-column-start:1;grid-column-end:-2}`))]}get readonlySelector(){var t,o,r;return Boolean(null!==(o=null===(t=this.data)||void 0===t?void 0:t._links["fx:void"])&&void 0!==o?o:null===(r=this.data)||void 0===r?void 0:r._links["fx:refund"])?super.readonlySelector:new n(`${super.readonlySelector} attributes custom-fields`)}renderBody(){var t,o,e,s,n,a;return r(T||(T=P` <div id="body" class="gap-m"> <foxy-internal-async-details-control infer="shipments" first="${0}" item="foxy-shipment-card" open> </foxy-internal-async-details-control> <div class="grid gap-m self-start"> <foxy-internal-transaction-summary-control infer="summary"> </foxy-internal-transaction-summary-control> <foxy-internal-transaction-customer-control infer="customer"> </foxy-internal-transaction-customer-control> <foxy-internal-async-details-control infer="payments" class="max-w-full overflow-hidden" first="${0}" limit="1" item="foxy-payment-card" open> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="discounts" first="${0}" limit="5" item="foxy-discount-card"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="applied-taxes" first="${0}" limit="5" item="foxy-applied-tax-card"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="custom-fields" first="${0}" limit="5" form="foxy-custom-field-form" item="foxy-custom-field-card" .related="${0}"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="attributes" first="${0}" limit="5" form="foxy-attribute-form" item="foxy-attribute-card" .related="${0}"> </foxy-internal-async-details-control> <foxy-internal-transaction-actions-control infer="actions"> </foxy-internal-transaction-actions-control> </div> </div> `),i(null===(t=this.data)||void 0===t?void 0:t._links["fx:shipments"].href),i(null===(o=this.data)||void 0===o?void 0:o._links["fx:payments"].href),i(null===(e=this.data)||void 0===e?void 0:e._links["fx:discounts"].href),i(null===(s=this.data)||void 0===s?void 0:s._links["fx:applied_taxes"].href),i(null===(n=this.data)||void 0===n?void 0:n._links["fx:custom_fields"].href),[this.href],i(null===(a=this.data)||void 0===a?void 0:a._links["fx:attributes"].href),[this.href])}}customElements.define("foxy-transaction",R);export{R as Transaction};
+import"./foxy-attribute-card.js";import"./foxy-attribute-form.js";import"./foxy-custom-field-form.js";import"./foxy-custom-field-card.js";import"./foxy-applied-tax-card.js";import"./foxy-discount-card.js";import"./foxy-shipment-card.js";import"./foxy-payment-card.js";import"./foxy-item-form.js";import"./shared-51a5af7e.js";import"./shared-2f082f50.js";import{I as t}from"./shared-870074ff.js";import{I as o}from"./shared-702eae16.js";import"./foxy-customer-card.js";import"./foxy-form-dialog.js";import"./foxy-customer.js";import{h as r,c as e}from"./shared-7f33a83a.js";import{i}from"./shared-d3bf9ac0.js";import"./shared-732bee4b.js";import"./shared-4e05dfb4.js";import{_ as s,B as n}from"./shared-4c2e9064.js";import{N as a}from"./shared-9b12aeac.js";import{a as d}from"./shared-662c576b.js";import"./shared-417ab233.js";import"./shared-fe927c53.js";import"./shared-f3b8de28.js";import"./shared-f9180815.js";import"./foxy-spinner.js";import"./shared-fd96bcd1.js";import"./shared-343d1fd7.js";import"./shared-5cf7b194.js";import"./shared-4e709717.js";import"./shared-35728235.js";import"./shared-3ab0306f.js";import"./shared-e8a51c60.js";import"./shared-53d66db2.js";import"./shared-e3096241.js";import"./shared-7d933f9d.js";import"./shared-e60dc924.js";import"./shared-6e704d83.js";import"./shared-5742a841.js";import"./shared-c00049b2.js";import"./shared-fc99076a.js";import"./shared-1dbad347.js";import"./shared-96215749.js";import"./shared-71b3559f.js";import"./shared-11c2efc8.js";import"./shared-8c681381.js";import"./shared-e2db3ab5.js";import"./shared-7b771301.js";import"./shared-1313f293.js";import"./shared-fed6cd4d.js";import"./shared-9771ef0f.js";import"./shared-468de081.js";import"./shared-112dbca7.js";import"./shared-074a74c3.js";import"./foxy-item-card.js";import"./shared-26dea180.js";import"./foxy-nucleon-element.js";import"./shared-fff7db77.js";import"./shared-21293163.js";import"./shared-e312da08.js";import"./foxy-collection-page.js";import"./shared-d519a301.js";import"./foxy-swipe-actions.js";import"./foxy-pagination.js";import"./shared-8771fb61.js";import"./shared-f1b36324.js";import"./foxy-discount-detail-card.js";import"./foxy-coupon-detail-card.js";import"./foxy-item-option-card.js";import"./foxy-item-option-form.js";import"./foxy-coupon-card.js";import"./shared-da5e32c1.js";import"./foxy-discount-builder.js";import"./shared-bb05cfed.js";import"./shared-5d718eaf.js";import"./shared-d01f42d0.js";import"./shared-79d0699c.js";import"./shared-e79b5765.js";import"./foxy-subscription-card.js";import"./shared-5e932eb5.js";import"./foxy-subscription-form.js";import"./foxy-cancellation-form.js";import"./foxy-transaction-card.js";import"./shared-e006e82c.js";import"./shared-800ee6c0.js";import"./shared-d7be11de.js";import"./foxy-payment-method-card.js";import"./foxy-transactions-table.js";import"./shared-131988fc.js";import"./foxy-collection-pages.js";import"./foxy-customer-form.js";import"./shared-cb9cdc88.js";import"./shared-783f5705.js";import"./shared-4c3cb511.js";import"./shared-b738ee96.js";import"./foxy-address-card.js";import"./foxy-address-form.js";import"./foxy-table.js";import"./shared-c320cfef.js";let l,c=t=>t;customElements.define("foxy-internal-transaction-customer-control",class extends o{renderControl(){var t,o,e,s;return r(l||(l=c` <foxy-internal-details summary="customer" infer="" open> <foxy-form-dialog header="header" infer="dialog" form="foxy-customer" href="${0}" id="dialog"> </foxy-form-dialog> <button class="w-full text-left block rounded-b-l transition-colors hover-bg-contrast-5 focus-outline-none focus-ring-2 focus-ring-primary-50" @click="${0}"> <foxy-customer-card infer="card" class="p-m" href="${0}"> </foxy-customer-card> </button> </foxy-internal-details> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:customer"].href),(t=>{this.renderRoot.querySelector("#dialog").show(t.currentTarget)}),i(null===(s=null===(e=this.nucleon)||void 0===e?void 0:e.data)||void 0===s?void 0:s._links["fx:customer"].href))}});let f,m=t=>t;customElements.define("foxy-internal-transaction-post-action-control",class extends o{constructor(){super(...arguments),this.theme=null,this.href=null,this.__state="idle"}static get properties(){return s(s({},super.properties),{},{__state:{type:String},theme:{type:String},href:{type:String}})}renderControl(){const t=this.__state,o="fail"===t?"error":"idle"===t?this.theme:"";return r(f||(f=m` <foxy-internal-confirm-dialog header="header" infer="confirm" id="confirm" @hide="${0}"> </foxy-internal-confirm-dialog> <vaadin-button class="w-full" theme="${0} tertiary" ?disabled="${0}" @click="${0}"> <foxy-i18n key="${0}" infer=""></foxy-i18n> </vaadin-button> `),(t=>!t.detail.cancelled&&this.__submit()),o,"busy"===t||this.disabled,(t=>{this.renderRoot.querySelector("#confirm").show(t.currentTarget)}),t)}async __submit(){var t;if("busy"!==this.__state)try{this.__state="busy";const o=new a.API(this),r=await o.fetch(null!==(t=this.href)&&void 0!==t?t:"",{method:"POST"});this.__state=r.ok?"idle":"fail",r.ok&&this.dispatchEvent(new CustomEvent("done"))}catch(t){this.__state="fail"}}});let u,p,h,y,x,v=t=>t;customElements.define("foxy-internal-transaction-actions-control",class extends o{renderControl(){var t,o,e,i,s,n,a,d;return r(u||(u=v` <div class="divide-y divide-contrast-10"> ${0} ${0} ${0} ${0} </div> `),(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:capture"])?this.__renderCaptureAction():"",(null===(i=null===(e=this.nucleon)||void 0===e?void 0:e.data)||void 0===i?void 0:i._links["fx:void"])?this.__renderVoidAction():"",(null===(n=null===(s=this.nucleon)||void 0===s?void 0:s.data)||void 0===n?void 0:n._links["fx:refund"])?this.__renderRefundAction():"",(null===(d=null===(a=this.nucleon)||void 0===a?void 0:a.data)||void 0===d?void 0:d._links["fx:send_emails"])?this.__renderSendEmailsAction():"")}__renderSendEmailsAction(){var t,o;return r(p||(p=v` <foxy-internal-transaction-post-action-control infer="send-emails" theme="contrast" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:send_emails"].href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderCaptureAction(){var t,o;return r(h||(h=v` <foxy-internal-transaction-post-action-control theme="success" infer="capture" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:capture"].href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderVoidAction(){var t,o,e;return r(y||(y=v` <foxy-internal-transaction-post-action-control theme="error" infer="void" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(e=null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:void"])||void 0===e?void 0:e.href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}__renderRefundAction(){var t,o,e;return r(x||(x=v` <foxy-internal-transaction-post-action-control theme="contrast" infer="refund" href="${0}" @done="${0}"> </foxy-internal-transaction-post-action-control> `),i(null===(e=null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o._links["fx:refund"])||void 0===e?void 0:e.href),(()=>{var t;return null===(t=this.nucleon)||void 0===t?void 0:t.refresh()}))}});let j,_,b,$,g,k,w,S,A,E=t=>t;customElements.define("foxy-internal-transaction-summary-control",class extends o{renderControl(){var t;return r(j||(j=E` <div class="border-t border-transparent"> <div class="h-m flex items-center justify-between"> <div class="text-xl font-medium">${0}</div> <div>${0}</div> </div> <div class="border-t border-contrast-10 mb-s"></div> ${0} </div> `),this.__renderPrice(),(null===(t=this.nucleon)||void 0===t?void 0:t.data)?this.__renderStatus():"",this.__renderTotals())}__renderStatus(){var t,o;const e={authorized:"bg-success text-success-contrast",completed:"bg-success text-success-contrast",declined:"bg-error text-error-contrast",rejected:"bg-error text-error-contrast"},i=(null===(o=null===(t=this.nucleon)||void 0===t?void 0:t.data)||void 0===o?void 0:o.status)||"completed";return r(_||(_=E` <foxy-i18n class="flex items-center h-xs px-s text-s font-medium rounded ${0}" infer="" key="transaction_${0}"> </foxy-i18n> `),i in e?e[i]:"bg-contrast-5 text-contrast",i)}__renderPrice(){var t;const o=null===(t=this.nucleon)||void 0===t?void 0:t.data,e=null==o?void 0:o.currency_code;if(!o)return r(b||(b=E`--`));const i={amount:`${o.total_order} ${e}`};return r($||($=E`<foxy-i18n infer="" key="price" .options="${0}"></foxy-i18n>`),i)}__renderTotals(){var t,o;const e=null===(t=this.nucleon)||void 0===t?void 0:t.data,i=null===(o=null==e?void 0:e._embedded)||void 0===o?void 0:o["fx:discounts"],s=null==i?void 0:i.reduce(((t,o)=>t+o.amount),0),n=null==e?void 0:e.currency_code;return r(g||(g=E` ${0} ${0} `),["total_item_price","total_shipping","total_tax"].map((t=>{const o={amount:`${null==e?void 0:e[t]} ${n}`};return r(k||(k=E` <div class="flex justify-between text-m text-secondary"> <foxy-i18n key="${0}" infer=""></foxy-i18n> ${0} </div> `),t,e?r(w||(w=E`<foxy-i18n infer="" key="price" .options="${0}"></foxy-i18n>`),o):r(S||(S=E`<span>--</span>`)))})),s?r(A||(A=E` <div class="flex justify-between text-m text-secondary"> <foxy-i18n key="total_discount" infer=""></foxy-i18n> <foxy-i18n infer="" key="${0}" .options="${0}"> </foxy-i18n> </div> `),20===(null==i?void 0:i.length)?"total_discount_see_below":"price",{amount:`${s} ${n}`}):"")}});let C,T,P=t=>t;class R extends(d(t,"transaction")){static get styles(){return[...super.styles,e(C||(C=P`#body{display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(18.75 * var(--lumo-space-m)),1fr))}#body>:first-child{grid-column-start:1;grid-column-end:-2}`))]}get readonlySelector(){var t,o,r;return Boolean(null!==(o=null===(t=this.data)||void 0===t?void 0:t._links["fx:void"])&&void 0!==o?o:null===(r=this.data)||void 0===r?void 0:r._links["fx:refund"])?super.readonlySelector:new n(`${super.readonlySelector} attributes custom-fields`)}renderBody(){var t,o,e,s,n,a;return r(T||(T=P` <div id="body" class="gap-m"> <foxy-internal-async-details-control infer="shipments" first="${0}" item="foxy-shipment-card" open> </foxy-internal-async-details-control> <div class="grid gap-m self-start"> <foxy-internal-transaction-summary-control infer="summary"> </foxy-internal-transaction-summary-control> <foxy-internal-transaction-customer-control infer="customer"> </foxy-internal-transaction-customer-control> <foxy-internal-async-details-control infer="payments" class="max-w-full overflow-hidden" first="${0}" limit="1" item="foxy-payment-card" open> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="discounts" first="${0}" limit="5" item="foxy-discount-card"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="applied-taxes" first="${0}" limit="5" item="foxy-applied-tax-card"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="custom-fields" first="${0}" limit="5" form="foxy-custom-field-form" item="foxy-custom-field-card" .related="${0}"> </foxy-internal-async-details-control> <foxy-internal-async-details-control infer="attributes" first="${0}" limit="5" form="foxy-attribute-form" item="foxy-attribute-card" .related="${0}"> </foxy-internal-async-details-control> <foxy-internal-transaction-actions-control infer="actions"> </foxy-internal-transaction-actions-control> </div> </div> `),i(null===(t=this.data)||void 0===t?void 0:t._links["fx:shipments"].href),i(null===(o=this.data)||void 0===o?void 0:o._links["fx:payments"].href),i(null===(e=this.data)||void 0===e?void 0:e._links["fx:discounts"].href),i(null===(s=this.data)||void 0===s?void 0:s._links["fx:applied_taxes"].href),i(null===(n=this.data)||void 0===n?void 0:n._links["fx:custom_fields"].href),[this.href],i(null===(a=this.data)||void 0===a?void 0:a._links["fx:attributes"].href),[this.href])}}customElements.define("foxy-transaction",R);export{R as Transaction};