@solvimon/solvimon-web 0.1.0-alpha.3 → 0.1.0-alpha.5

package/README.md

@@ -1,80 +1,108 @@
 # @solvimon/solvimon-web
 
-## Getting started
+Solvimon's front-end SDK. Provides framework-agnostic web components and a set of screens for building a billing self-serve experience.
+
+## Installation
 
 ```bash
 npm install @solvimon/solvimon-web
 ```
 
-Solvimon's SDK exports web components, that are framework agnostic. Each component requires at least:
+## Requirements
+
+Every component requires at minimum:
+
+| Property      | Type                 | Description                                 |
+| ------------- | -------------------- | ------------------------------------------- |
+| `token`       | `string`             | Session token fetched from the Solvimon API |
+| `environment` | `"TEST"` \| `"LIVE"` | Target environment                          |
+
+## Usage
 
-| Property      | Description                                  |
-| ------------- | -------------------------------------------- |
-| `token`       | Fetched from our API                         |
-| `environment` | Specifies the environment (`TEST` or `LIVE`) |
+The SDK exports web components (Custom Elements). There are two ways to register them.
 
-It supports two ways of importing:
+### Auto-register via define function
 
-### `defineSolvimonAddPaymentMethodForm`
+Call the `define` function once — it registers the custom element globally.
 
 ```tsx
-import { defineSolvimonAddPaymentMethodForm } from '@solvimon/solvimon-web/solvimon-add-payment-method-form';
+import { defineSolvimonCheckout } from '@solvimon/solvimon-web/screens/checkout';
 
-defineSolvimonAddPaymentMethodForm();
+defineSolvimonCheckout();
 
-export default function Home() {
-    return (
-        <solvimon-add-payment-method-form
-            token="<my-token-retrieved-from-solvimon-api>"
-            environment="LIVE"
-        />
-    );
+export default function Page() {
+    return <solvimon-checkout token="<token>" environment="LIVE" />;
 }
 ```
 
-### Register yourself (beneficial in Vue setup for typed components)
+### Manual registration (recommended for Vue — enables typed components)
 
 ```vue
 <script setup lang="ts">
-import { SolvimonAddPaymentMethodForm } from '@solvimon/solvimon-web/solvimon-add-payment-method-form';
+import { SolvimonCheckout } from '@solvimon/solvimon-web/screens/checkout';
 
-if (customElements.get('solvimon-add-payment-method-form')) {
-    customElements.define('solvimon-add-payment-method-form', SolvimonAddPaymentMethodForm);
+if (!customElements.get('solvimon-checkout')) {
+    customElements.define('solvimon-checkout', SolvimonCheckout);
 }
 </script>
 
 <template>
-    <solvimon-add-payment-method-form
-        token="<my-token-retrieved-from-solvimon-api>"
-        environment="LIVE"
-    />
+    <solvimon-checkout token="<token>" environment="LIVE" />
 </template>
 ```
 
-### Isomorphic (server side rendered) usage
+### Server-side rendering (SSR / isomorphic)
 
-Our component define functions might cause issues when run in isomorphic setups. To solve this, you might want to consider only loading our SDK client side only:
+The define functions access browser APIs and must only run client-side. Lazy-import them inside a client-only lifecycle hook:
 
 ```tsx
 import { useEffect } from 'react';
 
-export default function Home() {
+export default function Page() {
     useEffect(() => {
-        async function loadSolvimonSdkComponent() {
-            const { defineSolvimonAddPaymentMethodForm } = await import(
-                '@solvimon/solvimon-web/solvimon-add-payment-method-form'
-            );
-            defineSolvimonAddPaymentMethodForm();
-        }
-
-        loadSolvimonSdkComponent();
+        import('@solvimon/solvimon-web/screens/checkout').then(({ defineSolvimonCheckout }) =>
+            defineSolvimonCheckout(),
+        );
     }, []);
 
-    return (
-        <solvimon-add-payment-method-form
-            token="<my-token-retrieved-from-solvimon-api>"
-            environment="LIVE"
-        />
-    );
+    return <solvimon-checkout token="<token>" environment="LIVE" />;
 }
 ```
+
+## Available components
+
+### Screens
+
+Full-page experiences.
+
+| Export path                                           | Custom element                    |
+| ----------------------------------------------------- | --------------------------------- |
+| `@solvimon/solvimon-web/screens/checkout`             | `<solvimon-checkout>`             |
+| `@solvimon/solvimon-web/screens/customer-overview`    | `<solvimon-customer-overview>`    |
+| `@solvimon/solvimon-web/screens/upgrade-subscription` | `<solvimon-upgrade-subscription>` |
+
+### Components
+
+Embeddable building blocks.
+
+| Export path                                                  | Custom element                        |
+| ------------------------------------------------------------ | ------------------------------------- |
+| `@solvimon/solvimon-web/components/billing-information`      | `<solvimon-billing-information>`      |
+| `@solvimon/solvimon-web/components/billing-information-form` | `<solvimon-billing-information-form>` |
+| `@solvimon/solvimon-web/components/customer-payment-methods` | `<solvimon-customer-payment-methods>` |
+| `@solvimon/solvimon-web/components/invoice`                  | `<solvimon-invoice>`                  |
+| `@solvimon/solvimon-web/components/invoice-details`          | `<solvimon-invoice-details>`          |
+| `@solvimon/solvimon-web/components/invoices-list`            | `<solvimon-invoices-list>`            |
+| `@solvimon/solvimon-web/components/payment-history`          | `<solvimon-payment-history>`          |
+| `@solvimon/solvimon-web/components/payment-method-form`      | `<solvimon-payment-method-form>`      |
+| `@solvimon/solvimon-web/components/subscription-schedules`   | `<solvimon-subscription-schedules>`   |
+| `@solvimon/solvimon-web/components/subscriptions-list`       | `<solvimon-subscriptions-list>`       |
+| `@solvimon/solvimon-web/components/wallet-balances`          | `<solvimon-wallet-balances>`          |
+
+## Release pipeline
+
+Releases are published to [npm](https://www.npmjs.com/package/@solvimon/solvimon-web)
+automatically via GitHub Actions. See the
+[publishing documentation](./docs/development/publish.md) for the release flow.
+
+Want to contribute? Check the [developer documentation](./docs/development/readme.md).

package/dist/{BillingInformation.vue_vue_type_script_setup_true_lang-BD3CrJzj.js → BillingInformation.vue_vue_type_script_setup_true_lang-BouYyZhD.js}

@@ -1 +1 @@
-const e=require("vue"),t=require("./component-XHQYFLA_.js"),i=require("./useActionDispatchProvider-Cru69mAl.js"),o=e.defineComponent({__name:"BillingInformation",props:{customer:{type:Object},isLoading:{type:Boolean},configuration:{default:()=>({showEditButton:!0}),type:Object}},emits:["edit-billing-information"],setup(o){const{$t:n}=t.useIntl(),{dispatchAction:r}=i.useActionDispatchProvider();return(i,a)=>o.isLoading?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$14),{key:0,variant:"section",class:"min-h-[100px]","data-testid":"billing-information-skeleton"})):(e.openBlock(),e.createBlock(e.unref(t._sfc_main$z),{key:1,customer:o.customer,"fallback-to-reference":!1},e.createSlots({_:2},[o.configuration.showEditButton?{name:"settings",fn:e.withCtx(()=>[e.createVNode(e.unref(t._sfc_main$2H),{size:"sm",variant:"ghost",color:"gray","icon-prefix":"edit",onClick:a[0]||(a[0]=t=>e.unref(r)({action:"edit-billing-information"}))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Edit",id:"customer_overview.billing_information_block.view_all_payment_methods_link_label",description:"The link text that links to the overview page of the customer billing information"})),1)]),_:1})]),key:"0"}:void 0]),1032,["customer"]))}});exports._sfc_main=o;
+const e=require("vue"),t=require("./component-BeqkeC9h.js"),i=require("./useActionDispatchProvider-D4OtXsNA.js"),o=e.defineComponent({__name:"BillingInformation",props:{customer:{type:Object},isLoading:{type:Boolean},configuration:{default:()=>({showEditButton:!0}),type:Object}},emits:["edit-billing-information"],setup(o){const{$t:n}=t.useIntl(),{dispatchAction:r}=i.useActionDispatchProvider();return(i,a)=>o.isLoading?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$14),{key:0,variant:"section",class:"min-h-[100px]","data-testid":"billing-information-skeleton"})):(e.openBlock(),e.createBlock(e.unref(t._sfc_main$z),{key:1,customer:o.customer,"fallback-to-reference":!1},e.createSlots({_:2},[o.configuration.showEditButton?{name:"settings",fn:e.withCtx(()=>[e.createVNode(e.unref(t._sfc_main$2H),{size:"sm",variant:"ghost",color:"gray","icon-prefix":"edit",onClick:a[0]||(a[0]=t=>e.unref(r)({action:"edit-billing-information"}))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Edit",id:"customer_overview.billing_information_block.view_all_payment_methods_link_label",description:"The link text that links to the overview page of the customer billing information"})),1)]),_:1})]),key:"0"}:void 0]),1032,["customer"]))}});exports._sfc_main=o;

package/dist/{BillingInformation.vue_vue_type_script_setup_true_lang-DQAp1xwu.mjs → BillingInformation.vue_vue_type_script_setup_true_lang-CvUwy_tp.mjs}

@@ -1,6 +1,6 @@
 import { defineComponent, openBlock, createBlock, unref, createSlots, withCtx, createVNode, createTextVNode, toDisplayString } from "vue";
-import { b as useIntl, k as _sfc_main$14, l as _sfc_main$z, m as _sfc_main$2H } from "./component-DEo_ndpK.mjs";
-import { u as useActionDispatchProvider } from "./useActionDispatchProvider-CgRcOqv3.mjs";
+import { b as useIntl, k as _sfc_main$14, l as _sfc_main$z, m as _sfc_main$2H } from "./component-B0RYS5uK.mjs";
+import { u as useActionDispatchProvider } from "./useActionDispatchProvider-B_SkyymZ.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "BillingInformation",
   props: {

package/dist/{ContentWithAsideLayout-DczcgSrt.js → ContentWithAsideLayout-BjJufFeN.js}

@@ -1 +1 @@
-const e=require("vue"),o=require("./component-XHQYFLA_.js");const t={class:"grid w-full grid-cols-1 gap-4"},r={key:0},s={class:"flex flex-col items-start gap-6 md:flex-row"},l={class:"grid w-full grow grid-cols-1 gap-4 md:w-auto"},n={class:"grid w-full grid-cols-1 gap-4 md:w-80 md:shrink-0"};const c=((e,o)=>{const t=e.__vccOpts||e;for(const[r,s]of o)t[r]=s;return t})({},[["render",function(o,c){return e.openBlock(),e.createElementBlock("div",t,[o.$slots.header?(e.openBlock(),e.createElementBlock("div",r,[e.renderSlot(o.$slots,"header")])):e.createCommentVNode("",!0),e.createElementVNode("div",s,[e.createElementVNode("div",l,[e.renderSlot(o.$slots,"content")]),e.createElementVNode("aside",n,[e.renderSlot(o.$slots,"aside")])])])}]]);exports.ContentWithAsideLayout=c,exports.usePortal=function(){const t=e.inject(o.PORTAL_INJECTION_KEY);if(!t)throw new Error("PortalProvider is not provided");return t};
+const e=require("vue"),o=require("./component-BeqkeC9h.js");const t={class:"grid w-full grid-cols-1 gap-4"},r={key:0},s={class:"flex flex-col items-start gap-6 md:flex-row"},l={class:"grid w-full grow grid-cols-1 gap-4 md:w-auto"},n={class:"grid w-full grid-cols-1 gap-4 md:w-80 md:shrink-0"};const c=((e,o)=>{const t=e.__vccOpts||e;for(const[r,s]of o)t[r]=s;return t})({},[["render",function(o,c){return e.openBlock(),e.createElementBlock("div",t,[o.$slots.header?(e.openBlock(),e.createElementBlock("div",r,[e.renderSlot(o.$slots,"header")])):e.createCommentVNode("",!0),e.createElementVNode("div",s,[e.createElementVNode("div",l,[e.renderSlot(o.$slots,"content")]),e.createElementVNode("aside",n,[e.renderSlot(o.$slots,"aside")])])])}]]);exports.ContentWithAsideLayout=c,exports.usePortal=function(){const t=e.inject(o.PORTAL_INJECTION_KEY);if(!t)throw new Error("PortalProvider is not provided");return t};

package/dist/{ContentWithAsideLayout-CRsFr9TH.mjs → ContentWithAsideLayout-CKbnuXMU.mjs}

@@ -1,5 +1,5 @@
 import { inject, openBlock, createElementBlock, renderSlot, createCommentVNode, createElementVNode } from "vue";
-import { P as PORTAL_INJECTION_KEY } from "./component-DEo_ndpK.mjs";
+import { P as PORTAL_INJECTION_KEY } from "./component-B0RYS5uK.mjs";
 function usePortal() {
   const portal = inject(PORTAL_INJECTION_KEY);
   if (!portal) {

package/dist/{InvoiceDetailsBlock.vue_vue_type_script_setup_true_lang-D0ie9Krt.mjs → InvoiceDetailsBlock.vue_vue_type_script_setup_true_lang-DaEPSNrY.mjs}

@@ -1,5 +1,5 @@
 import { defineComponent, openBlock, createBlock, unref, withCtx, createElementBlock, createElementVNode, createVNode, createTextVNode, toDisplayString, createCommentVNode } from "vue";
-import { b as useIntl, d as _sfc_main$1g, _ as _sfc_main$2 } from "./component-DEo_ndpK.mjs";
+import { b as useIntl, d as _sfc_main$1g, _ as _sfc_main$2 } from "./component-B0RYS5uK.mjs";
 const _hoisted_1 = {
   key: 0,
   class: "flex flex-col gap-2"

package/dist/{InvoiceDetailsBlock.vue_vue_type_script_setup_true_lang-BE3I7Oe1.js → InvoiceDetailsBlock.vue_vue_type_script_setup_true_lang-sbmK2un9.js}

@@ -1 +1 @@
-const e=require("vue"),t=require("./component-XHQYFLA_.js"),i={key:0,class:"flex flex-col gap-2"},o=e.defineComponent({__name:"InvoiceDetailsBlock",props:{invoice:{type:Object}},setup(o){const{$t:n,formatDate:a}=t.useIntl();return(c,d)=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main$1g),{title:e.unref(n)({defaultMessage:"Invoice details",description:"Title for the invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.title"})},{default:e.withCtx(()=>[o.invoice?(e.openBlock(),e.createElementBlock("div",i,[e.createElementVNode("div",null,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Invoice date",description:"Title for the invoice date in invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.invoice_date"})),1)]),_:1}),o.invoice.invoice_date?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$2),{key:0,variant:"body-xs"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(a)({date:o.invoice.invoice_date,format:"date",timezone:o.invoice.customer.timezone,offsetType:"offsetted"})),1)]),_:1})):e.createCommentVNode("",!0)]),e.createElementVNode("div",null,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Due date",description:"Title for the due date in invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.due_date"})),1)]),_:1}),o.invoice.due_date?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$2),{key:0,variant:"body-xs"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(a)({date:o.invoice.due_date,format:"date",timezone:o.invoice.customer.timezone,offsetType:"offsetted"})),1)]),_:1})):e.createCommentVNode("",!0)])])):e.createCommentVNode("",!0)]),_:1},8,["title"]))}});exports._sfc_main=o;
+const e=require("vue"),t=require("./component-BeqkeC9h.js"),i={key:0,class:"flex flex-col gap-2"},o=e.defineComponent({__name:"InvoiceDetailsBlock",props:{invoice:{type:Object}},setup(o){const{$t:n,formatDate:a}=t.useIntl();return(c,d)=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main$1g),{title:e.unref(n)({defaultMessage:"Invoice details",description:"Title for the invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.title"})},{default:e.withCtx(()=>[o.invoice?(e.openBlock(),e.createElementBlock("div",i,[e.createElementVNode("div",null,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Invoice date",description:"Title for the invoice date in invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.invoice_date"})),1)]),_:1}),o.invoice.invoice_date?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$2),{key:0,variant:"body-xs"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(a)({date:o.invoice.invoice_date,format:"date",timezone:o.invoice.customer.timezone,offsetType:"offsetted"})),1)]),_:1})):e.createCommentVNode("",!0)]),e.createElementVNode("div",null,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(n)({defaultMessage:"Due date",description:"Title for the due date in invoice details block on the invoice overview page",id:"sdk.invoice_details.invoice_details_block.due_date"})),1)]),_:1}),o.invoice.due_date?(e.openBlock(),e.createBlock(e.unref(t._sfc_main$2),{key:0,variant:"body-xs"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(a)({date:o.invoice.due_date,format:"date",timezone:o.invoice.customer.timezone,offsetType:"offsetted"})),1)]),_:1})):e.createCommentVNode("",!0)])])):e.createCommentVNode("",!0)]),_:1},8,["title"]))}});exports._sfc_main=o;

package/dist/{PaymentHistoryBlock.vue_vue_type_script_setup_true_lang-DVDOsMnT.mjs → PaymentHistoryBlock.vue_vue_type_script_setup_true_lang-CLU-8-Ao.mjs}

@@ -1,5 +1,5 @@
 import { defineComponent, openBlock, createElementBlock, createVNode, unref, withCtx, createTextVNode, toDisplayString, createElementVNode, Fragment, renderList, createBlock, createCommentVNode } from "vue";
-import { b as useIntl, _ as _sfc_main$2, d as _sfc_main$1g, e as _sfc_main$3, f as formatEnum, g as _sfc_main$1 } from "./component-DEo_ndpK.mjs";
+import { b as useIntl, _ as _sfc_main$2, d as _sfc_main$1g, e as _sfc_main$3, f as formatEnum, g as _sfc_main$1 } from "./component-B0RYS5uK.mjs";
 const _hoisted_1 = { class: "flex flex-col-reverse gap-1" };
 const _hoisted_2 = { class: "flex justify-between items-center mb-2" };
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/{PaymentHistoryBlock.vue_vue_type_script_setup_true_lang-sNdlKgdU.js → PaymentHistoryBlock.vue_vue_type_script_setup_true_lang-NRmK7iN3.js}

@@ -1 +1 @@
-const e=require("vue"),t=require("./component-XHQYFLA_.js"),a={class:"flex flex-col-reverse gap-1"},n={class:"flex justify-between items-center mb-2"},o=e.defineComponent({__name:"PaymentHistoryBlock",props:{paymentAttempts:{type:Array},customer:{type:Object}},setup(o){const{$t:r,formatDate:i}=t.useIntl(),s={AUTHORIZED:"green",CANCELLED:"red",ERROR:"red",PENDING:"orange",PENDING_REFUND:"orange",REFUNDED:"orange",CHARGED_BACK:"orange",REFUSED:"red"};return(m,c)=>(e.openBlock(),e.createElementBlock("div",null,[e.createVNode(e.unref(t._sfc_main$2),{tag:"h2",variant:"heading-3"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)({defaultMessage:"Payment history",description:"Title for the payment history block on the invoice details page",id:"sdk.invoice_details.payment_history.title"})),1)]),_:1}),e.createElementVNode("div",a,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.paymentAttempts,a=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main$1g),{key:a.id,class:"mt-1 md:mt-2"},{default:e.withCtx(()=>[e.createElementVNode("div",n,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)({defaultMessage:"Payment attempt",description:"Title for the payment attempt block",id:"sdk.invoice_details.payment_history.payment_attempt"})),1)]),_:1}),e.createVNode(e.unref(t._sfc_main$3),{color:s[a.result]},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(t.formatEnum)(a.result)),1)]),_:2},1032,["color"])]),a.payment_method_details?(e.openBlock(),e.createBlock(e.unref(t._sfc_main),{key:0,"payment-method":a.payment_method_details},{description:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(i)({date:a.created_at,format:"dateTime",offsetType:"offsetted",timezone:o.customer.timezone})),1)]),_:2},1032,["payment-method"])):e.createCommentVNode("",!0)]),_:2},1024))),128))])]))}});exports._sfc_main=o;
+const e=require("vue"),t=require("./component-BeqkeC9h.js"),a={class:"flex flex-col-reverse gap-1"},n={class:"flex justify-between items-center mb-2"},o=e.defineComponent({__name:"PaymentHistoryBlock",props:{paymentAttempts:{type:Array},customer:{type:Object}},setup(o){const{$t:r,formatDate:i}=t.useIntl(),s={AUTHORIZED:"green",CANCELLED:"red",ERROR:"red",PENDING:"orange",PENDING_REFUND:"orange",REFUNDED:"orange",CHARGED_BACK:"orange",REFUSED:"red"};return(m,c)=>(e.openBlock(),e.createElementBlock("div",null,[e.createVNode(e.unref(t._sfc_main$2),{tag:"h2",variant:"heading-3"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)({defaultMessage:"Payment history",description:"Title for the payment history block on the invoice details page",id:"sdk.invoice_details.payment_history.title"})),1)]),_:1}),e.createElementVNode("div",a,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.paymentAttempts,a=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main$1g),{key:a.id,class:"mt-1 md:mt-2"},{default:e.withCtx(()=>[e.createElementVNode("div",n,[e.createVNode(e.unref(t._sfc_main$2),{variant:"caps-heading"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(r)({defaultMessage:"Payment attempt",description:"Title for the payment attempt block",id:"sdk.invoice_details.payment_history.payment_attempt"})),1)]),_:1}),e.createVNode(e.unref(t._sfc_main$3),{color:s[a.result]},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(t.formatEnum)(a.result)),1)]),_:2},1032,["color"])]),a.payment_method_details?(e.openBlock(),e.createBlock(e.unref(t._sfc_main),{key:0,"payment-method":a.payment_method_details},{description:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(i)({date:a.created_at,format:"dateTime",offsetType:"offsetted",timezone:o.customer.timezone})),1)]),_:2},1032,["payment-method"])):e.createCommentVNode("",!0)]),_:2},1024))),128))])]))}});exports._sfc_main=o;