@solvimon/solvimon-web 0.1.0-alpha.13 → 0.1.0-alpha.15

package/dist/PaymentMethodForm.vue_vue_type_script_setup_true_lang-DfdaWRO0.js

@@ -0,0 +1 @@
+const e=require("vue"),t=require("./vendor-ui-C3Tq-qY_.js"),n=require("./Skeleton.vue_vue_type_script_setup_true_lang-DfMgIsGm.js"),o=require("./PaymentIntegrationForm.vue_vue_type_script_setup_true_lang-BxdcIX-Z.js"),a=e.defineComponent({__name:"PaymentMethodForm",props:{customer:{type:Object},paymentMethodOptions:{type:Array},configuration:{type:Object},isLoading:{type:Boolean,default:!1},countryCode:{type:String}},emits:["payment-success","payment-failed"],setup(a,{emit:r}){const i={currency:"EUR",quantity:"0"},u=a,s=r,{$t:m}=t.useIntl(),c=e.ref(),l=e.ref(),d=e.ref(!1);function p(){var e;d.value=!0,null==(e=c.value)||e.submit()}function v(){d.value=!1,s("payment-success")}function y(e){d.value=!1,s("payment-failed",e)}const f=e.computed(()=>{return"AUTHORIZE"===(null==(e=u.configuration)?void 0:e.variant)?e:{...e,variant:"TOKENIZE"};var e}),_=e.computed(()=>{let e="NL";if(u.countryCode)return e=u.countryCode,e;if(u.customer){const n=t.getCustomerCountry(u.customer);if(n)return e=n,e}return"NL"}),g=e.computed(()=>{const e=f.value.variant,n=t.getCustomerName(u.customer),o={amount:f.value.amount??i,paymentMethodOptions:u.paymentMethodOptions,countryCode:_.value,...u.customer.email?{email:u.customer.email}:{},...n?{name:n}:{},validateOnSubmit:f.value.validateOnSubmit,forceStorePaymentMethod:f.value.forceStorePaymentMethod,selectedOption:f.value.selectedOption,invoiceId:f.value.invoiceId};return"AUTHORIZE"===e?{...o,variant:e,context:f.value.context}:{...o,variant:"TOKENIZE",customerId:u.customer.id}});return(r,i)=>a.isLoading?(e.openBlock(),e.createBlock(n._sfc_main,{key:0,variant:"section",class:"sv-payment-method-form sv-root sv-component sv-loading min-h-[180px]","data-testid":"payment-method-form-skeleton"})):(e.openBlock(),e.createBlock(e.unref(t._sfc_main),{key:1,class:"sv-payment-method-form sv-root sv-component","no-border":"","no-spacing":"","content-background":"none",title:e.unref(m)({defaultMessage:"Available payment methods",description:"Title of the available payment methods form",id:"components.payment_method_form.section_title"})},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass({"pointer-events-none opacity-60":d.value})},[e.createVNode(o._sfc_main,e.mergeProps({ref_key:"paymentIntegrationFormRef",ref:c,class:"sv-payment-method-form__integration"},g.value,{onSelect:i[0]||(i[0]=e=>l.value=e),onPaymentSuccess:v,onPaymentFailed:y}),null,16)],2),e.createVNode(e.unref(t._sfc_main$1),{color:"primary",class:"mt-4 w-full",loading:d.value,onClick:p},{default:e.withCtx(()=>[...i[1]||(i[1]=[e.createTextVNode("Save payment method",-1)])]),_:1},8,["loading"])]),_:1},8,["title"]))}});exports._sfc_main=a;

package/dist/PaymentMethodForm.vue_vue_type_script_setup_true_lang-h-JUw1DV.mjs

@@ -0,0 +1,145 @@
+import { defineComponent, ref, computed, openBlock, createBlock, unref, withCtx, createElementVNode, normalizeClass, createVNode, mergeProps, createTextVNode } from "vue";
+import { u as useIntl, g as getCustomerCountry, b as getCustomerName, _ as _sfc_main$2, c as _sfc_main$4 } from "./vendor-ui-B8IlviSs.mjs";
+import { _ as _sfc_main$1 } from "./Skeleton.vue_vue_type_script_setup_true_lang-DGMxHc20.mjs";
+import { _ as _sfc_main$3 } from "./PaymentIntegrationForm.vue_vue_type_script_setup_true_lang-aP-gCq7V.mjs";
+const FALLBACK_COUNTRY_CODE = "NL";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PaymentMethodForm",
+  props: {
+    customer: { type: Object },
+    paymentMethodOptions: { type: Array },
+    configuration: { type: Object },
+    isLoading: { type: Boolean, default: false },
+    countryCode: { type: String }
+  },
+  emits: ["payment-success", "payment-failed"],
+  setup(__props, { emit: __emit }) {
+    const DEFAULT_AMOUNT = {
+      currency: "EUR",
+      quantity: "0"
+    };
+    const props = __props;
+    const emit = __emit;
+    const { $t } = useIntl();
+    const paymentIntegrationFormRef = ref();
+    const selectedPaymentMethod = ref();
+    const isPaymentPending = ref(false);
+    function handleSubmit() {
+      var _a;
+      isPaymentPending.value = true;
+      (_a = paymentIntegrationFormRef.value) == null ? void 0 : _a.submit();
+    }
+    function handlePaymentSuccess() {
+      isPaymentPending.value = false;
+      emit("payment-success");
+    }
+    function handlePaymentFailed(error) {
+      isPaymentPending.value = false;
+      emit("payment-failed", error);
+    }
+    const resolveConfiguration = (configuration2) => {
+      if ((configuration2 == null ? void 0 : configuration2.variant) === "AUTHORIZE") {
+        return configuration2;
+      }
+      return {
+        ...configuration2,
+        variant: "TOKENIZE"
+      };
+    };
+    const configuration = computed(
+      () => resolveConfiguration(props.configuration)
+    );
+    const countryCode = computed(() => {
+      let result = FALLBACK_COUNTRY_CODE;
+      if (props.countryCode) {
+        result = props.countryCode;
+        return result;
+      }
+      if (props.customer) {
+        const country = getCustomerCountry(props.customer);
+        if (country) {
+          result = country;
+          return result;
+        }
+      }
+      return FALLBACK_COUNTRY_CODE;
+    });
+    const paymentIntegrationProps = computed(() => {
+      const variant = configuration.value.variant;
+      const customerName = getCustomerName(props.customer);
+      const commonProps = {
+        amount: configuration.value.amount ?? DEFAULT_AMOUNT,
+        paymentMethodOptions: props.paymentMethodOptions,
+        countryCode: countryCode.value,
+        ...props.customer.email ? { email: props.customer.email } : {},
+        ...customerName ? { name: customerName } : {},
+        validateOnSubmit: configuration.value.validateOnSubmit,
+        forceStorePaymentMethod: configuration.value.forceStorePaymentMethod,
+        selectedOption: configuration.value.selectedOption,
+        invoiceId: configuration.value.invoiceId
+      };
+      if (variant === "AUTHORIZE") {
+        return {
+          ...commonProps,
+          variant,
+          context: configuration.value.context
+        };
+      }
+      return {
+        ...commonProps,
+        variant: "TOKENIZE",
+        customerId: props.customer.id
+      };
+    });
+    return (_ctx, _cache) => {
+      return __props.isLoading ? (openBlock(), createBlock(_sfc_main$1, {
+        key: 0,
+        variant: "section",
+        class: "sv-payment-method-form sv-root sv-component sv-loading min-h-[180px]",
+        "data-testid": "payment-method-form-skeleton"
+      })) : (openBlock(), createBlock(unref(_sfc_main$2), {
+        key: 1,
+        class: "sv-payment-method-form sv-root sv-component",
+        "no-border": "",
+        "no-spacing": "",
+        "content-background": "none",
+        title: unref($t)({
+          defaultMessage: "Available payment methods",
+          description: "Title of the available payment methods form",
+          id: "components.payment_method_form.section_title"
+        })
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", {
+            class: normalizeClass({ "pointer-events-none opacity-60": isPaymentPending.value })
+          }, [
+            createVNode(_sfc_main$3, mergeProps({
+              ref_key: "paymentIntegrationFormRef",
+              ref: paymentIntegrationFormRef,
+              class: "sv-payment-method-form__integration"
+            }, paymentIntegrationProps.value, {
+              onSelect: _cache[0] || (_cache[0] = (payload) => selectedPaymentMethod.value = payload),
+              onPaymentSuccess: handlePaymentSuccess,
+              onPaymentFailed: handlePaymentFailed
+            }), null, 16)
+          ], 2),
+          createVNode(unref(_sfc_main$4), {
+            color: "primary",
+            class: "mt-4 w-full",
+            loading: isPaymentPending.value,
+            onClick: handleSubmit
+          }, {
+            default: withCtx(() => [..._cache[1] || (_cache[1] = [
+              createTextVNode("Save payment method", -1)
+            ])]),
+            _: 1
+          }, 8, ["loading"])
+        ]),
+        _: 1
+      }, 8, ["title"]));
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/PaymentMethodsList.vue_vue_type_script_setup_true_lang-DxndhDxR.js

@@ -0,0 +1 @@
+const e=require("vue"),t=require("./vendor-ui-C3Tq-qY_.js"),n=require("./useService-CHrkefKd.js"),o=require("./paymentMethods-u5y9B5ng.js");const a={key:0,class:"sv-payment-methods__list grid grid-cols-1 gap-4"},l=e.defineComponent({__name:"PaymentMethodsList",props:{paymentMethods:{type:Array}},emits:["delete","set-default"],setup(l,{emit:d}){const s=d,{$t:m}=t.useIntl(),i=e.ref(null),{execute:u}=function(){const{setDefaultPaymentMethod:e}=o.createPaymentMethodsService(),{data:t,execute:a,error:l,isPending:d}=n.useService({service:t=>e({paymentMethodId:t})});return{data:t,execute:a,error:l,isPending:d}}(),{getContextMenuItems:r}=function({onSetDefault:e,onDeleteRequest:n}){const{$t:o}=t.useIntl();return{getContextMenuItems:t=>{const a=[];return t.is_default||a.push({label:o({defaultMessage:"Set as default",id:"payment_method.context_menu.set_as_default.label",description:"Context menu option for setting the default payment method"}),onClick:()=>e(t)}),a.push({label:o({defaultMessage:"Delete",id:"payment_method.context_menu.delete.label",description:"Context menu option for deleting the payment method"}),onClick:()=>n(t)}),a}}}({onDeleteRequest:e=>{i.value=e},onSetDefault:async e=>{await u(e.id),s("set-default",e)}});function c(){i.value&&s("delete",i.value),i.value=null}return(n,o)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[l.paymentMethods.length>0?(e.openBlock(),e.createElementBlock("div",a,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.paymentMethods,n=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main),{key:n.id,class:"sv-payment-methods__item"},{default:e.withCtx(()=>[e.createVNode(e.unref(t._sfc_main$6),{class:"sv-payment-methods__item-content","payment-method":n,options:e.unref(r)(n)},null,8,["payment-method","options"])]),_:2},1024))),128))])):e.createCommentVNode("",!0),e.createVNode(e.unref(t._sfc_main$12),{"show-modal":!!i.value,title:e.unref(m)({id:"payment_methods_list.delete_modal.title",defaultMessage:"Delete payment method",description:"Title of the delete payment method confirmation modal"}),"confirm-button-text":e.unref(m)({id:"payment_methods_list.delete_modal.confirm",defaultMessage:"Delete",description:"Confirm button in the delete payment method modal"}),"cancel-button-text":e.unref(m)({id:"payment_methods_list.delete_modal.cancel",defaultMessage:"Cancel",description:"Cancel button in the delete payment method modal"}),onConfirm:c,onClose:o[0]||(o[0]=e=>i.value=null)},e.createSlots({_:2},[i.value?{name:"body",fn:e.withCtx(()=>[e.createVNode(e.unref(t._sfc_main$3),null,{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(e.unref(m)({id:"payment_methods_list.delete_modal.body",defaultMessage:"Are you sure you want to delete this payment method?",description:"Confirmation message in the delete payment method modal"})),1)]),_:1}),e.createVNode(e.unref(t._sfc_main),null,{default:e.withCtx(()=>[e.createVNode(e.unref(t._sfc_main$6),{"payment-method":i.value},null,8,["payment-method"])]),_:1})]),key:"0"}:void 0]),1032,["show-modal","title","confirm-button-text","cancel-button-text"])],64))}});exports._sfc_main=l;

package/dist/PaymentMethodsList.vue_vue_type_script_setup_true_lang-j5VNsyu7.mjs

@@ -0,0 +1,139 @@
+import { defineComponent, ref, openBlock, createElementBlock, Fragment, renderList, createBlock, unref, withCtx, createVNode, createCommentVNode, createSlots, createTextVNode, toDisplayString } from "vue";
+import { u as useIntl, _ as _sfc_main$1, m as _sfc_main$2, y as _sfc_main$3, e as _sfc_main$4 } from "./vendor-ui-B8IlviSs.mjs";
+import { u as useService } from "./useService-DF57xuDd.mjs";
+import { c as createPaymentMethodsService } from "./paymentMethods-D-5FNN8W.mjs";
+function usePaymentMethodContextMenuOptions({
+  onSetDefault,
+  onDeleteRequest
+}) {
+  const { $t } = useIntl();
+  const getContextMenuItems = (paymentMethod) => {
+    const items = [];
+    if (!paymentMethod.is_default) {
+      items.push({
+        label: $t({
+          defaultMessage: "Set as default",
+          id: "payment_method.context_menu.set_as_default.label",
+          description: "Context menu option for setting the default payment method"
+        }),
+        onClick: () => onSetDefault(paymentMethod)
+      });
+    }
+    items.push({
+      label: $t({
+        defaultMessage: "Delete",
+        id: "payment_method.context_menu.delete.label",
+        description: "Context menu option for deleting the payment method"
+      }),
+      onClick: () => onDeleteRequest(paymentMethod)
+    });
+    return items;
+  };
+  return { getContextMenuItems };
+}
+function useSetDefaultPaymentMethod() {
+  const { setDefaultPaymentMethod } = createPaymentMethodsService();
+  const { data, execute, error, isPending } = useService({
+    service: (paymentMethodId) => setDefaultPaymentMethod({ paymentMethodId })
+  });
+  return { data, execute, error, isPending };
+}
+const _hoisted_1 = {
+  key: 0,
+  class: "sv-payment-methods__list grid grid-cols-1 gap-4"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PaymentMethodsList",
+  props: {
+    paymentMethods: { type: Array }
+  },
+  emits: ["delete", "set-default"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const { $t } = useIntl();
+    const pendingDeletePaymentMethod = ref(null);
+    const { execute: setDefault } = useSetDefaultPaymentMethod();
+    const { getContextMenuItems } = usePaymentMethodContextMenuOptions({
+      onDeleteRequest: (paymentMethod) => {
+        pendingDeletePaymentMethod.value = paymentMethod;
+      },
+      onSetDefault: async (paymentMethod) => {
+        await setDefault(paymentMethod.id);
+        emit("set-default", paymentMethod);
+      }
+    });
+    function handleConfirmDelete() {
+      if (pendingDeletePaymentMethod.value) {
+        emit("delete", pendingDeletePaymentMethod.value);
+      }
+      pendingDeletePaymentMethod.value = null;
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        __props.paymentMethods.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.paymentMethods, (paymentMethod) => {
+            return openBlock(), createBlock(unref(_sfc_main$1), {
+              key: paymentMethod.id,
+              class: "sv-payment-methods__item"
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(_sfc_main$2), {
+                  class: "sv-payment-methods__item-content",
+                  "payment-method": paymentMethod,
+                  options: unref(getContextMenuItems)(paymentMethod)
+                }, null, 8, ["payment-method", "options"])
+              ]),
+              _: 2
+            }, 1024);
+          }), 128))
+        ])) : createCommentVNode("", true),
+        createVNode(unref(_sfc_main$3), {
+          "show-modal": !!pendingDeletePaymentMethod.value,
+          title: unref($t)({
+            id: "payment_methods_list.delete_modal.title",
+            defaultMessage: "Delete payment method",
+            description: "Title of the delete payment method confirmation modal"
+          }),
+          "confirm-button-text": unref($t)({
+            id: "payment_methods_list.delete_modal.confirm",
+            defaultMessage: "Delete",
+            description: "Confirm button in the delete payment method modal"
+          }),
+          "cancel-button-text": unref($t)({
+            id: "payment_methods_list.delete_modal.cancel",
+            defaultMessage: "Cancel",
+            description: "Cancel button in the delete payment method modal"
+          }),
+          onConfirm: handleConfirmDelete,
+          onClose: _cache[0] || (_cache[0] = ($event) => pendingDeletePaymentMethod.value = null)
+        }, createSlots({ _: 2 }, [
+          pendingDeletePaymentMethod.value ? {
+            name: "body",
+            fn: withCtx(() => [
+              createVNode(unref(_sfc_main$4), null, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(unref($t)({
+                    id: "payment_methods_list.delete_modal.body",
+                    defaultMessage: "Are you sure you want to delete this payment method?",
+                    description: "Confirmation message in the delete payment method modal"
+                  })), 1)
+                ]),
+                _: 1
+              }),
+              createVNode(unref(_sfc_main$1), null, {
+                default: withCtx(() => [
+                  createVNode(unref(_sfc_main$2), { "payment-method": pendingDeletePaymentMethod.value }, null, 8, ["payment-method"])
+                ]),
+                _: 1
+              })
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["show-modal", "title", "confirm-button-text", "cancel-button-text"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};

package/dist/SecurePaymentsKPI.vue_vue_type_script_setup_true_lang-BVoS3ZXS.js

@@ -0,0 +1 @@
+const e=require("vue"),t=require("./vendor-ui-C3Tq-qY_.js"),a={class:"flex items-start"},n={class:"flex flex-col grow"},s={class:"flex items-center gap-1"},l={class:"flex items-center ml-4 self-center"},r=e.defineComponent({__name:"PricingGroupContent",props:{name:{type:String},description:{type:String}},setup:r=>(c,i)=>(e.openBlock(),e.createElementBlock("div",a,[e.createElementVNode("div",n,[e.createElementVNode("div",s,[e.createVNode(e.unref(t._sfc_main$3),{tag:"span",variant:"body-sm",weight:"semibold"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.name),1)]),_:1}),e.renderSlot(c.$slots,"badge")]),e.createVNode(e.unref(t._sfc_main$3),{tag:"span",variant:"body-xs",shade:"lighter"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1})]),e.createElementVNode("div",l,[e.renderSlot(c.$slots,"default")])]))}),c={class:"sv-empty-state__body flex flex-col items-center justify-center py-4"},i=e.defineComponent({__name:"EmptyStatePlaceholder",props:{icon:{type:null}},setup:a=>(n,s)=>(e.openBlock(),e.createBlock(e.unref(t._sfc_main),{class:"sv-empty-state"},{default:e.withCtx(()=>[e.createElementVNode("div",c,[e.createVNode(e.unref(t._sfc_main$14),{icon:a.icon,size:"lg",class:"sv-empty-state__icon text-gray-500"},null,8,["icon"]),e.createVNode(e.unref(t._sfc_main$3),{center:"",tag:"span",variant:"body-sm",weight:"semibold",shade:"lighter",class:"sv-empty-state__title mt-2"},{default:e.withCtx(()=>[e.renderSlot(n.$slots,"title")]),_:3}),e.createVNode(e.unref(t._sfc_main$3),{center:"",tag:"span",variant:"body-xs",shade:"lightest",class:"sv-empty-state__message mt-1"},{default:e.withCtx(()=>[e.renderSlot(n.$slots,"message")]),_:3})])]),_:3}))}),o={class:"flex justify-around"},d={class:"flex items-center gap-0.5"},p=["aria-label","innerHTML"],m=e.defineComponent({__name:"SecurePaymentsKPI",props:{paymentMethodOptions:{type:Array}},setup(a){const n=a,{$t:s}=t.useIntl(),l={ADYEN:{svg:'<svg xmlns="http://www.w3.org/2000/svg" width="40" height="15" fill="none" viewBox="0 0 40 15"><path fill="currentColor" d="M.049 2.917h5.845c.646 0 1.17.522 1.17 1.166v5.834H1.217c-.646 0-1.17-.522-1.17-1.167V5.833h2.924v2.334H4.14v-3.5H.049zm32.735 0v7h2.922v-5.25h1.17v5.25h2.922V4.083c0-.644-.523-1.166-1.169-1.166zm-16.367 9.916h5.845c.646 0 1.17-.522 1.17-1.166v-8.75h-2.924v5.25H19.34v-5.25h-2.922V8.75c0 .645.523 1.167 1.169 1.167h2.922v1.166h-4.091zm15.197-2.916H25.77c-.646 0-1.17-.522-1.17-1.167V2.917h5.846c.646 0 1.17.522 1.17 1.166V7h-2.923V4.667h-1.17v3.5h4.092zM15.248 0v9.917H9.402c-.646 0-1.17-.522-1.17-1.167V4.083c0-.644.524-1.166 1.17-1.166h1.754v5.25h1.169V0z"/></svg>',label:"Adyen"},STRIPE:{svg:'<svg xmlns="http://www.w3.org/2000/svg" width="36" height="15" viewBox="0 0 36 15"><path d="M35.996 7.746c0-2.559-1.238-4.578-3.61-4.578-2.378 0-3.816 2.02-3.816 4.559 0 3.011 1.7 4.53 4.137 4.53 1.191 0 2.09-.269 2.77-.648v-2c-.68.34-1.457.547-2.45.547-.968 0-1.828-.34-1.937-1.52h4.887c0-.128.02-.648.02-.89m-4.937-.95c0-1.128.691-1.597 1.32-1.597.61 0 1.258.469 1.258 1.598ZM24.707 3.168c-.977 0-1.61.46-1.957.781l-.133-.62h-2.199v11.66l2.5-.532.012-2.828c.36.258.89.629 1.77.629 1.788 0 3.417-1.442 3.417-4.61-.008-2.898-1.66-4.48-3.41-4.48m-.598 6.89c-.59 0-.941-.21-1.18-.472l-.011-3.707c.262-.29.621-.492 1.191-.492.91 0 1.54 1.02 1.54 2.332 0 1.34-.622 2.34-1.54 2.34M16.98 2.578l2.508-.539V.008L16.98.539ZM16.98 3.34h2.508v8.746H16.98ZM14.29 4.078l-.161-.738h-2.16v8.746h2.5v-5.93c.59-.77 1.59-.629 1.898-.52V3.34c-.316-.121-1.488-.34-2.078.738M9.29 1.168l-2.438.52-.012 8.011c0 1.48 1.11 2.57 2.59 2.57.82 0 1.418-.152 1.75-.332v-2.03c-.32.132-1.899.59-1.899-.887V5.469h1.899v-2.13H9.28ZM2.531 5.879c0-.39.32-.54.848-.54a5.56 5.56 0 0 1 2.48.638V3.629a6.55 6.55 0 0 0-2.48-.461C1.352 3.168 0 4.227 0 6c0 2.758 3.8 2.316 3.8 3.508 0 .46-.402.61-.96.61-.828 0-1.89-.34-2.73-.802V11.7c.93.399 1.87.57 2.73.57 2.078 0 3.512-1.03 3.512-2.82-.012-2.98-3.82-2.453-3.82-3.57m0 0" style="stroke:none;fill-rule:evenodd;fill:currentColor;fill-opacity:1"/></svg>',label:"Stripe"}},r=e.computed(()=>{const e=n.paymentMethodOptions.find(({integration:e})=>{var t;return null!=(null==(t=e.payment_gateway)?void 0:t.variant)&&e.payment_gateway.variant in l});return e?l[e.integration.payment_gateway.variant]:null}),c=e.computed(()=>r.value?s({defaultMessage:"Secure and encrypted payments by",description:"Secure encrypted payments KPI for a specific vendor, followed by a vendor logo",id:"secure_payments_kpi.specific_vendor"}):s({defaultMessage:"Secure and encrypted payments",description:"Secure encrypted payments KPI",id:"secure_payments_kpi.generic"}));return(a,n)=>(e.openBlock(),e.createElementBlock("div",o,[e.createElementVNode("div",d,[e.createVNode(e.unref(t._sfc_main$14),{icon:"lock",size:"xs"}),e.createVNode(e.unref(t._sfc_main$3),{tag:"span",variant:"body-xs",shade:"lighter"},{default:e.withCtx(()=>[e.createElementVNode("span",null,e.toDisplayString(c.value),1),n[0]||(n[0]=e.createTextVNode(e.toDisplayString(" ")+" ",-1)),r.value?(e.openBlock(),e.createElementBlock("span",{key:0,"aria-label":r.value.label,role:"img",class:"inline-block h-[15px] align-middle",innerHTML:r.value.svg},null,8,p)):e.createCommentVNode("",!0)]),_:1})])]))}});exports._sfc_main=r,exports._sfc_main$1=m,exports._sfc_main$2=i;

package/dist/SecurePaymentsKPI.vue_vue_type_script_setup_true_lang-Cqk-vonA.mjs

@@ -0,0 +1,170 @@
+import { defineComponent, openBlock, createElementBlock, createElementVNode, createVNode, unref, withCtx, createTextVNode, toDisplayString, renderSlot, createBlock, computed, createCommentVNode } from "vue";
+import { e as _sfc_main$3, _ as _sfc_main$4, A as _sfc_main$5, u as useIntl } from "./vendor-ui-B8IlviSs.mjs";
+const _hoisted_1$2 = { class: "flex items-start" };
+const _hoisted_2$1 = { class: "flex flex-col grow" };
+const _hoisted_3$1 = { class: "flex items-center gap-1" };
+const _hoisted_4 = { class: "flex items-center ml-4 self-center" };
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "PricingGroupContent",
+  props: {
+    name: { type: String },
+    description: { type: String }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$2, [
+        createElementVNode("div", _hoisted_2$1, [
+          createElementVNode("div", _hoisted_3$1, [
+            createVNode(unref(_sfc_main$3), {
+              tag: "span",
+              variant: "body-sm",
+              weight: "semibold"
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(__props.name), 1)
+              ]),
+              _: 1
+            }),
+            renderSlot(_ctx.$slots, "badge")
+          ]),
+          createVNode(unref(_sfc_main$3), {
+            tag: "span",
+            variant: "body-xs",
+            shade: "lighter"
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(__props.description), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        createElementVNode("div", _hoisted_4, [
+          renderSlot(_ctx.$slots, "default")
+        ])
+      ]);
+    };
+  }
+});
+const _hoisted_1$1 = { class: "sv-empty-state__body flex flex-col items-center justify-center py-4" };
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "EmptyStatePlaceholder",
+  props: {
+    icon: { type: null }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$4), { class: "sv-empty-state" }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1$1, [
+            createVNode(unref(_sfc_main$5), {
+              icon: __props.icon,
+              size: "lg",
+              class: "sv-empty-state__icon text-gray-500"
+            }, null, 8, ["icon"]),
+            createVNode(unref(_sfc_main$3), {
+              center: "",
+              tag: "span",
+              variant: "body-sm",
+              weight: "semibold",
+              shade: "lighter",
+              class: "sv-empty-state__title mt-2"
+            }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "title")
+              ]),
+              _: 3
+            }),
+            createVNode(unref(_sfc_main$3), {
+              center: "",
+              tag: "span",
+              variant: "body-xs",
+              shade: "lightest",
+              class: "sv-empty-state__message mt-1"
+            }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "message")
+              ]),
+              _: 3
+            })
+          ])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const adyenLogo = '<svg xmlns="http://www.w3.org/2000/svg" width="40" height="15" fill="none" viewBox="0 0 40 15"><path fill="currentColor" d="M.049 2.917h5.845c.646 0 1.17.522 1.17 1.166v5.834H1.217c-.646 0-1.17-.522-1.17-1.167V5.833h2.924v2.334H4.14v-3.5H.049zm32.735 0v7h2.922v-5.25h1.17v5.25h2.922V4.083c0-.644-.523-1.166-1.169-1.166zm-16.367 9.916h5.845c.646 0 1.17-.522 1.17-1.166v-8.75h-2.924v5.25H19.34v-5.25h-2.922V8.75c0 .645.523 1.167 1.169 1.167h2.922v1.166h-4.091zm15.197-2.916H25.77c-.646 0-1.17-.522-1.17-1.167V2.917h5.846c.646 0 1.17.522 1.17 1.166V7h-2.923V4.667h-1.17v3.5h4.092zM15.248 0v9.917H9.402c-.646 0-1.17-.522-1.17-1.167V4.083c0-.644.524-1.166 1.17-1.166h1.754v5.25h1.169V0z"/></svg>';
+const stripeLogo = '<svg xmlns="http://www.w3.org/2000/svg" width="36" height="15" viewBox="0 0 36 15"><path d="M35.996 7.746c0-2.559-1.238-4.578-3.61-4.578-2.378 0-3.816 2.02-3.816 4.559 0 3.011 1.7 4.53 4.137 4.53 1.191 0 2.09-.269 2.77-.648v-2c-.68.34-1.457.547-2.45.547-.968 0-1.828-.34-1.937-1.52h4.887c0-.128.02-.648.02-.89m-4.937-.95c0-1.128.691-1.597 1.32-1.597.61 0 1.258.469 1.258 1.598ZM24.707 3.168c-.977 0-1.61.46-1.957.781l-.133-.62h-2.199v11.66l2.5-.532.012-2.828c.36.258.89.629 1.77.629 1.788 0 3.417-1.442 3.417-4.61-.008-2.898-1.66-4.48-3.41-4.48m-.598 6.89c-.59 0-.941-.21-1.18-.472l-.011-3.707c.262-.29.621-.492 1.191-.492.91 0 1.54 1.02 1.54 2.332 0 1.34-.622 2.34-1.54 2.34M16.98 2.578l2.508-.539V.008L16.98.539ZM16.98 3.34h2.508v8.746H16.98ZM14.29 4.078l-.161-.738h-2.16v8.746h2.5v-5.93c.59-.77 1.59-.629 1.898-.52V3.34c-.316-.121-1.488-.34-2.078.738M9.29 1.168l-2.438.52-.012 8.011c0 1.48 1.11 2.57 2.59 2.57.82 0 1.418-.152 1.75-.332v-2.03c-.32.132-1.899.59-1.899-.887V5.469h1.899v-2.13H9.28ZM2.531 5.879c0-.39.32-.54.848-.54a5.56 5.56 0 0 1 2.48.638V3.629a6.55 6.55 0 0 0-2.48-.461C1.352 3.168 0 4.227 0 6c0 2.758 3.8 2.316 3.8 3.508 0 .46-.402.61-.96.61-.828 0-1.89-.34-2.73-.802V11.7c.93.399 1.87.57 2.73.57 2.078 0 3.512-1.03 3.512-2.82-.012-2.98-3.82-2.453-3.82-3.57m0 0" style="stroke:none;fill-rule:evenodd;fill:currentColor;fill-opacity:1"/></svg>';
+const _hoisted_1 = { class: "flex justify-around" };
+const _hoisted_2 = { class: "flex items-center gap-0.5" };
+const _hoisted_3 = ["aria-label", "innerHTML"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SecurePaymentsKPI",
+  props: {
+    paymentMethodOptions: { type: Array }
+  },
+  setup(__props) {
+    const props = __props;
+    const { $t } = useIntl();
+    const VENDOR_LOGOS = {
+      ADYEN: { svg: adyenLogo, label: "Adyen" },
+      STRIPE: { svg: stripeLogo, label: "Stripe" }
+    };
+    const vendorLogo = computed(() => {
+      const entry = props.paymentMethodOptions.find(
+        ({ integration }) => {
+          var _a;
+          return ((_a = integration.payment_gateway) == null ? void 0 : _a.variant) != null && integration.payment_gateway.variant in VENDOR_LOGOS;
+        }
+      );
+      return entry ? VENDOR_LOGOS[entry.integration.payment_gateway.variant] : null;
+    });
+    const securePaymentsText = computed(() => {
+      if (vendorLogo.value) {
+        return $t({
+          defaultMessage: "Secure and encrypted payments by",
+          description: "Secure encrypted payments KPI for a specific vendor, followed by a vendor logo",
+          id: "secure_payments_kpi.specific_vendor"
+        });
+      }
+      return $t({
+        defaultMessage: "Secure and encrypted payments",
+        description: "Secure encrypted payments KPI",
+        id: "secure_payments_kpi.generic"
+      });
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createVNode(unref(_sfc_main$5), {
+            icon: "lock",
+            size: "xs"
+          }),
+          createVNode(unref(_sfc_main$3), {
+            tag: "span",
+            variant: "body-xs",
+            shade: "lighter"
+          }, {
+            default: withCtx(() => [
+              createElementVNode("span", null, toDisplayString(securePaymentsText.value), 1),
+              _cache[0] || (_cache[0] = createTextVNode(toDisplayString(" ") + " ", -1)),
+              vendorLogo.value ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                "aria-label": vendorLogo.value.label,
+                role: "img",
+                class: "inline-block h-[15px] align-middle",
+                innerHTML: vendorLogo.value.svg
+              }, null, 8, _hoisted_3)) : createCommentVNode("", true)
+            ]),
+            _: 1
+          })
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main$2 as _,
+  _sfc_main as a,
+  _sfc_main$1 as b
+};

package/dist/{SubscriptionsList.vue_vue_type_script_setup_true_lang-BkzLj8n2.mjs → SubscriptionsList.vue_vue_type_script_setup_true_lang-Cv6lz35J.mjs}

@@ -1,9 +1,9 @@
-import { u as useIncrementalLoading } from "./useIncrementalLoading-Cnzh2mAz.mjs";
-import { c as createSubscriptionsService } from "./subscriptions-ClGIr_aS.mjs";
+import { u as useIncrementalLoading } from "./useIncrementalLoading-DmOT2MXH.mjs";
+import { c as createSubscriptionsService } from "./subscriptions-DHjXDyH1.mjs";
 import { defineComponent, computed, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode, createTextVNode, toDisplayString, createCommentVNode, createElementBlock, createSlots, Fragment, renderList } from "vue";
-import { u as useIntl, b as _sfc_main$3, _ as _sfc_main$4, j as _sfc_main$5, e as _sfc_main$6 } from "./vendor-ui-C0K3osvz.mjs";
-import { _ as _sfc_main$7 } from "./Skeleton.vue_vue_type_script_setup_true_lang-DGMxHc20.mjs";
-import { u as useActionDispatchProvider } from "./useActionDispatchProvider-BC57-Ufn.mjs";
+import { u as useIntl, _ as _sfc_main$3, e as _sfc_main$4, m as _sfc_main$5, c as _sfc_main$6, z as _sfc_main$7 } from "./vendor-ui-B8IlviSs.mjs";
+import { _ as _sfc_main$8 } from "./Skeleton.vue_vue_type_script_setup_true_lang-DGMxHc20.mjs";
+import { u as useActionDispatchProvider } from "./useActionDispatchProvider-DmhD9mYX.mjs";
 function useSubscriptionsList({
   customerId,
   batchSize: pageSize = 15
@@ -31,9 +31,10 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     customer: { type: Object },
     showViewSubscriptionDetailsButton: { type: Boolean, default: true },
     showCancelSubscriptionButton: { type: Boolean, default: true },
-    showRenewSubscriptionButton: { type: Boolean, default: true }
+    showRenewSubscriptionButton: { type: Boolean, default: true },
+    showUpgradeSubscriptionButton: { type: Boolean, default: true }
   },
-  emits: ["view-subscription-details", "cancel-subscription", "renew-subscription"],
+  emits: ["view-subscription-details", "cancel-subscription", "renew-subscription", "upgrade-subscription"],
   setup(__props) {
     const props = __props;
     const { $t } = useIntl();
@@ -163,29 +164,45 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                 ]),
                 _: 1
               })) : createCommentVNode("", true),
-              isCancelButtonVisible.value ? (openBlock(), createBlock(unref(_sfc_main$6), {
+              __props.showUpgradeSubscriptionButton ? (openBlock(), createBlock(unref(_sfc_main$6), {
                 key: 1,
                 variant: "outline",
                 color: "gray",
-                class: "sv-action sv-action--secondary sv-subscriptions-list__item-cancel w-full md:w-auto",
+                class: "sv-action sv-action--secondary sv-subscriptions-list__item-upgrade w-full md:w-auto",
                 type: "button",
-                onClick: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("cancel-subscription", { subscriptionId: __props.subscription.id }))
+                onClick: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("upgrade-subscription", { subscriptionId: __props.subscription.id }))
               }, {
                 default: withCtx(() => [
                   createTextVNode(toDisplayString(unref($t)({
-                    defaultMessage: "Cancel subscription",
-                    description: "The label for the cancel subscription button in the subscriptions block",
-                    id: "customer.subscriptions_block.cancel_button_label"
+                    defaultMessage: "Upgrade subscription",
+                    description: "The label for the upgrade subscription button in the subscriptions block",
+                    id: "customer.subscriptions_block.upgrade_button_label"
                   })), 1)
                 ]),
                 _: 1
-              })) : isRenewButtonVisible.value ? (openBlock(), createBlock(unref(_sfc_main$6), {
+              })) : createCommentVNode("", true),
+              isCancelButtonVisible.value ? (openBlock(), createBlock(unref(_sfc_main$7), {
                 key: 2,
+                icon: "delete",
+                variant: "outline",
+                color: "gray",
+                size: "md",
+                class: "sv-action sv-subscriptions-list__item-cancel",
+                type: "button",
+                "aria-label": unref($t)({
+                  defaultMessage: "Cancel subscription",
+                  description: "Aria label for the cancel subscription icon button",
+                  id: "customer.subscriptions_block.cancel_button_label"
+                }),
+                onClick: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("cancel-subscription", { subscriptionId: __props.subscription.id }))
+              }, null, 8, ["aria-label"])) : createCommentVNode("", true),
+              isRenewButtonVisible.value ? (openBlock(), createBlock(unref(_sfc_main$6), {
+                key: 3,
                 variant: "outline",
                 color: "gray",
                 class: "sv-action sv-action--secondary sv-subscriptions-list__item-renew w-full md:w-auto",
                 type: "button",
-                onClick: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("renew-subscription", { subscriptionId: __props.subscription.id }))
+                onClick: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("renew-subscription", { subscriptionId: __props.subscription.id }))
               }, {
                 default: withCtx(() => [
                   createTextVNode(toDisplayString(unref($t)({
@@ -218,9 +235,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     showViewAllButton: { type: Boolean, default: true },
     showViewDetailsButton: { type: Boolean, default: true },
     showCancelButton: { type: Boolean, default: true },
-    showRenewButton: { type: Boolean, default: true }
+    showRenewButton: { type: Boolean, default: true },
+    showUpgradeButton: { type: Boolean, default: true }
   },
-  emits: ["view-subscription-details", "view-all-subscriptions", "cancel-subscription", "renew-subscription", "load-more"],
+  emits: ["view-subscription-details", "view-all-subscriptions", "cancel-subscription", "renew-subscription", "upgrade-subscription", "load-more"],
   setup(__props) {
     const props = __props;
     const { $t } = useIntl();
@@ -288,10 +306,12 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 "show-view-subscription-details-button": __props.showViewDetailsButton,
                 "show-cancel-subscription-button": __props.showCancelButton,
                 "show-renew-subscription-button": __props.showRenewButton,
+                "show-upgrade-subscription-button": __props.showUpgradeButton,
                 onViewSubscriptionDetails: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("view-subscription-details", $event)),
                 onCancelSubscription: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("cancel-subscription", $event)),
-                onRenewSubscription: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("renew-subscription", $event))
-              }, null, 8, ["subscription", "payment-method", "customer", "show-view-subscription-details-button", "show-cancel-subscription-button", "show-renew-subscription-button"]);
+                onRenewSubscription: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("renew-subscription", $event)),
+                onUpgradeSubscription: _cache[4] || (_cache[4] = ($event) => _ctx.$emit("upgrade-subscription", $event))
+              }, null, 8, ["subscription", "payment-method", "customer", "show-view-subscription-details-button", "show-cancel-subscription-button", "show-renew-subscription-button", "show-upgrade-subscription-button"]);
             }), 128))
           ]))
         ]),
@@ -338,8 +358,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const { dispatchAction } = useActionDispatchProvider();
     return (_ctx, _cache) => {
-      var _a, _b, _c, _d;
-      return __props.isLoading ? (openBlock(), createBlock(_sfc_main$7, {
+      var _a, _b, _c, _d, _e;
+      return __props.isLoading ? (openBlock(), createBlock(_sfc_main$8, {
         key: 0,
         variant: "section",
         class: "sv-subscriptions-list sv-root sv-component sv-loading min-h-[100px]",
@@ -355,6 +375,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "show-view-details-button": (_b = __props.configuration) == null ? void 0 : _b.showViewDetailsButton,
         "show-cancel-button": (_c = __props.configuration) == null ? void 0 : _c.showCancelButton,
         "show-renew-button": (_d = __props.configuration) == null ? void 0 : _d.showRenewButton,
+        "show-upgrade-button": (_e = __props.configuration) == null ? void 0 : _e.showUpgradeButton,
         onViewSubscriptionDetails: _cache[0] || (_cache[0] = ($event) => unref(dispatchAction)({
           action: "view-subscription-details",
           data: { subscriptionId: $event.subscriptionId }
@@ -368,8 +389,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           action: "renew-subscription",
           data: { subscriptionId: $event.subscriptionId }
         })),
-        onLoadMore: _cache[4] || (_cache[4] = ($event) => _ctx.$emit("load-more"))
-      }, null, 8, ["customer", "subscriptions", "payment-methods", "is-loading", "show-view-all-button", "show-view-details-button", "show-cancel-button", "show-renew-button"])) : createCommentVNode("", true);
+        onUpgradeSubscription: _cache[4] || (_cache[4] = ($event) => unref(dispatchAction)({
+          action: "upgrade-subscription",
+          data: { subscriptionId: $event.subscriptionId }
+        })),
+        onLoadMore: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("load-more"))
+      }, null, 8, ["customer", "subscriptions", "payment-methods", "is-loading", "show-view-all-button", "show-view-details-button", "show-cancel-button", "show-renew-button", "show-upgrade-button"])) : createCommentVNode("", true);
     };
   }
 });