@solidgate/vue-sdk 1.26.0 → 1.28.0

package/README.md

@@ -72,7 +72,7 @@ const merchantData: InitConfig['merchantData'] = {
 
 #### Custom containers
 
-To render <a href="https://docs.solidgate.com/payments/integrate/payment-form/google-pay-button/" target="_blank">Google Pay</a>, <a href="https://docs.solidgate.com/payments/integrate/payment-form/apple-pay-button/" target="_blank">Apple Pay</a>, or <a href="https://docs.solidgate.com/payments/integrate/payment-form/apm-buttons/#paypal-button" target="_blank">PayPal</a> buttons in separate containers, define payment as an asynchronous component and pass references to the container elements.
+To render <a href="https://docs.solidgate.com/payments/integrate/payment-form/google-pay-button/" target="_blank">Google Pay</a>, <a href="https://docs.solidgate.com/payments/integrate/payment-form/apple-pay-button/" target="_blank">Apple Pay</a>, <a href="https://docs.solidgate.com/payments/integrate/payment-form/apm-buttons/#paypal-button" target="_blank">PayPal</a>, <a href="https://docs.solidgate.com/payments/integrate/payment-form/apm-buttons/" target="_blank">MB Way</a>, or <a href="https://docs.solidgate.com/payments/integrate/payment-form/apm-buttons/" target="_blank">Pix QR</a> buttons in separate containers, define payment as an asynchronous component and pass references to the container elements.
 
 ```vue
 <template>
@@ -82,11 +82,13 @@ To render <a href="https://docs.solidgate.com/payments/integrate/payment-form/go
     :apple-pay-container-ref="appleButton"
     :paypal-container-ref="paypalButton"
     :mbway-container-ref="mbwayButton"
+    :pix-qr-container-ref="pixQrButton"
   />
   <div ref="googleButton" />
   <div ref="appleButton" />
   <div ref="paypalButton" />
   <div ref="mbwayButton" />
+  <div ref="pixQrButton" />
 </template>
 
 <script lang="ts" setup>
@@ -98,6 +100,7 @@ To render <a href="https://docs.solidgate.com/payments/integrate/payment-form/go
   const appleButton = ref<HTMLDivElement>()
   const paypalButton = ref<HTMLDivElement>()
   const mbwayButton = ref<HTMLDivElement>()
+  const pixQrButton = ref<HTMLDivElement>()
 
   const merchantData: InitConfig['merchantData'] = {
     merchant: '<<--YOUR MERCHANT ID-->>',

package/dist/Payment.vue.d.ts

@@ -11,7 +11,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     width?: string | undefined;
     styles?: Record<string, unknown> | undefined;
     formParams?: Partial<{
-        enabled: false;
+        enabled: boolean;
         autoFocus: boolean;
         submitButtonText: string;
         isCardHolderVisible: boolean;
@@ -39,13 +39,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     } & Record<"zipСodeLabel" | "argentinaDniLabel" | "bangladeshNicLabel" | "boliviaCiLabel" | "brazilCpfLabel" | "cameroonCniLabel" | "chileCiLabel" | "chinaIdLabel" | "colombiaCcLabel" | "costaRicaCiLabel" | "dominicanaIdLabel" | "ecuadorCiLabel" | "elSalvadorIdLabel" | "egyptIdLabel" | "ghanaCardLabel" | "guatemalaCuiLabel" | "indiaPanLabel" | "indonesiaNikLabel" | "japanIdLabel" | "kenyaIdLabel" | "malaysiaNricLabel" | "mexicoCurpLabel" | "moroccoCnieLabel" | "nigeriaNinLabel" | "panamaIdLabel" | "paraguayCiLabel" | "peruDniLabel" | "philipinesPsnLabel" | "senegalCniLabel" | "southAfricaIdLabel" | "tanzaniaIdLabel" | "thailandIdLabel" | "turkeyTcKimlikNoLabel" | "ugandaNicLabel" | "uriguayCiLabel" | "vietnamVnidLabel", string> & Record<"zipСodePlaceholder" | "argentinaDniPlaceholder" | "bangladeshNicPlaceholder" | "boliviaCiPlaceholder" | "brazilCpfPlaceholder" | "cameroonCniPlaceholder" | "chileCiPlaceholder" | "chinaIdPlaceholder" | "colombiaCcPlaceholder" | "costaRicaCiPlaceholder" | "dominicanaIdPlaceholder" | "ecuadorCiPlaceholder" | "elSalvadorIdPlaceholder" | "egyptIdPlaceholder" | "ghanaCardPlaceholder" | "guatemalaCuiPlaceholder" | "indiaPanPlaceholder" | "indonesiaNikPlaceholder" | "japanIdPlaceholder" | "kenyaIdPlaceholder" | "malaysiaNricPlaceholder" | "mexicoCurpPlaceholder" | "moroccoCniePlaceholder" | "nigeriaNinPlaceholder" | "panamaIdPlaceholder" | "paraguayCiPlaceholder" | "peruDniPlaceholder" | "philipinesPsnPlaceholder" | "senegalCniPlaceholder" | "southAfricaIdPlaceholder" | "tanzaniaIdPlaceholder" | "thailandIdPlaceholder" | "turkeyTcKimlikNoPlaceholder" | "ugandaNicPlaceholder" | "uriguayCiPlaceholder" | "vietnamVnidPlaceholder", string>> | undefined;
     googlePayButtonParams?: Omit<Partial<{
         allowedAuthMethods: ["PAN_ONLY", "CRYPTOGRAM_3DS"] | ["PAN_ONLY"] | ["CRYPTOGRAM_3DS"];
-        enabled: false;
+        enabled: boolean;
         containerId: string;
         color: string;
         type: string;
     }> | undefined, "containerId"> | undefined;
     applePayButtonParams?: Omit<Partial<{
-        enabled: false;
+        enabled: boolean;
         integrationType?: "css" | "js" | undefined;
         containerId: string;
         color: string;
@@ -80,6 +80,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
         enabled?: boolean | undefined;
         height?: number | undefined;
     } | undefined, "containerId"> | undefined;
+    pixQrButtonParams?: Omit<{
+        containerId?: string | undefined;
+        enabled?: boolean | undefined;
+        height?: number | undefined;
+    } | undefined, "containerId"> | undefined;
     googlePayContainerRef?: HTMLDivElement | undefined;
     applePayContainerRef?: HTMLDivElement | undefined;
     paypalContainerRef?: HTMLDivElement | undefined;
@@ -87,6 +92,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     bizumContainerRef?: HTMLDivElement | undefined;
     blikContainerRef?: HTMLDivElement | undefined;
     mbwayContainerRef?: HTMLDivElement | undefined;
+    pixQrContainerRef?: HTMLDivElement | undefined;
     onReadyPaymentInstance?: ((paymentInstance: ClientSdkInstance) => void) | undefined;
     onPaymentDetails?: ((e: PaymentDetailsMessage) => void) | undefined;
     onMounted?: ((e: MountedMessage) => void) | undefined;
@@ -140,7 +146,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     width?: string | undefined;
     styles?: Record<string, unknown> | undefined;
     formParams?: Partial<{
-        enabled: false;
+        enabled: boolean;
         autoFocus: boolean;
         submitButtonText: string;
         isCardHolderVisible: boolean;
@@ -168,13 +174,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     } & Record<"zipСodeLabel" | "argentinaDniLabel" | "bangladeshNicLabel" | "boliviaCiLabel" | "brazilCpfLabel" | "cameroonCniLabel" | "chileCiLabel" | "chinaIdLabel" | "colombiaCcLabel" | "costaRicaCiLabel" | "dominicanaIdLabel" | "ecuadorCiLabel" | "elSalvadorIdLabel" | "egyptIdLabel" | "ghanaCardLabel" | "guatemalaCuiLabel" | "indiaPanLabel" | "indonesiaNikLabel" | "japanIdLabel" | "kenyaIdLabel" | "malaysiaNricLabel" | "mexicoCurpLabel" | "moroccoCnieLabel" | "nigeriaNinLabel" | "panamaIdLabel" | "paraguayCiLabel" | "peruDniLabel" | "philipinesPsnLabel" | "senegalCniLabel" | "southAfricaIdLabel" | "tanzaniaIdLabel" | "thailandIdLabel" | "turkeyTcKimlikNoLabel" | "ugandaNicLabel" | "uriguayCiLabel" | "vietnamVnidLabel", string> & Record<"zipСodePlaceholder" | "argentinaDniPlaceholder" | "bangladeshNicPlaceholder" | "boliviaCiPlaceholder" | "brazilCpfPlaceholder" | "cameroonCniPlaceholder" | "chileCiPlaceholder" | "chinaIdPlaceholder" | "colombiaCcPlaceholder" | "costaRicaCiPlaceholder" | "dominicanaIdPlaceholder" | "ecuadorCiPlaceholder" | "elSalvadorIdPlaceholder" | "egyptIdPlaceholder" | "ghanaCardPlaceholder" | "guatemalaCuiPlaceholder" | "indiaPanPlaceholder" | "indonesiaNikPlaceholder" | "japanIdPlaceholder" | "kenyaIdPlaceholder" | "malaysiaNricPlaceholder" | "mexicoCurpPlaceholder" | "moroccoCniePlaceholder" | "nigeriaNinPlaceholder" | "panamaIdPlaceholder" | "paraguayCiPlaceholder" | "peruDniPlaceholder" | "philipinesPsnPlaceholder" | "senegalCniPlaceholder" | "southAfricaIdPlaceholder" | "tanzaniaIdPlaceholder" | "thailandIdPlaceholder" | "turkeyTcKimlikNoPlaceholder" | "ugandaNicPlaceholder" | "uriguayCiPlaceholder" | "vietnamVnidPlaceholder", string>> | undefined;
     googlePayButtonParams?: Omit<Partial<{
         allowedAuthMethods: ["PAN_ONLY", "CRYPTOGRAM_3DS"] | ["PAN_ONLY"] | ["CRYPTOGRAM_3DS"];
-        enabled: false;
+        enabled: boolean;
         containerId: string;
         color: string;
         type: string;
     }> | undefined, "containerId"> | undefined;
     applePayButtonParams?: Omit<Partial<{
-        enabled: false;
+        enabled: boolean;
         integrationType?: "css" | "js" | undefined;
         containerId: string;
         color: string;
@@ -209,6 +215,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
         enabled?: boolean | undefined;
         height?: number | undefined;
     } | undefined, "containerId"> | undefined;
+    pixQrButtonParams?: Omit<{
+        containerId?: string | undefined;
+        enabled?: boolean | undefined;
+        height?: number | undefined;
+    } | undefined, "containerId"> | undefined;
     googlePayContainerRef?: HTMLDivElement | undefined;
     applePayContainerRef?: HTMLDivElement | undefined;
     paypalContainerRef?: HTMLDivElement | undefined;
@@ -216,6 +227,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     bizumContainerRef?: HTMLDivElement | undefined;
     blikContainerRef?: HTMLDivElement | undefined;
     mbwayContainerRef?: HTMLDivElement | undefined;
+    pixQrContainerRef?: HTMLDivElement | undefined;
     onReadyPaymentInstance?: ((paymentInstance: ClientSdkInstance) => void) | undefined;
     onPaymentDetails?: ((e: PaymentDetailsMessage) => void) | undefined;
     onMounted?: ((e: MountedMessage) => void) | undefined;

package/dist/constants/index.d.ts

@@ -6,4 +6,5 @@ declare const PIX_BUTTON_CONTAINER_ID: string;
 declare const BIZUM_BUTTON_CONTAINER_ID: string;
 declare const BLIK_BUTTON_CONTAINER_ID: string;
 declare const MBWAY_BUTTON_CONTAINER_ID: string;
-export { IFRAME_CONTAINER_ID, GOOGLE_PAY_BUTTON_CONTAINER_ID, APPLE_PAY_BUTTON_CONTAINER_ID, PAYPAL_BUTTON_CONTAINER_ID, PIX_BUTTON_CONTAINER_ID, BIZUM_BUTTON_CONTAINER_ID, BLIK_BUTTON_CONTAINER_ID, MBWAY_BUTTON_CONTAINER_ID };
+declare const PIX_QR_BUTTON_CONTAINER_ID: string;
+export { IFRAME_CONTAINER_ID, GOOGLE_PAY_BUTTON_CONTAINER_ID, APPLE_PAY_BUTTON_CONTAINER_ID, PAYPAL_BUTTON_CONTAINER_ID, PIX_BUTTON_CONTAINER_ID, BIZUM_BUTTON_CONTAINER_ID, BLIK_BUTTON_CONTAINER_ID, MBWAY_BUTTON_CONTAINER_ID, PIX_QR_BUTTON_CONTAINER_ID };

package/dist/index.css

@@ -1 +1 @@
-.payment-form-container[data-v-757b2e2e] iframe,.payment-form-container[data-v-77b30339] iframe{border:none}
+.payment-form-container[data-v-d55f0b28] iframe,.payment-form-container[data-v-77b30339] iframe{border:none}

package/dist/index.es.js

@@ -7,6 +7,7 @@ const PIX_BUTTON_CONTAINER_ID = `pix-button-container_#${Math.random() * 1e4}`;
 const BIZUM_BUTTON_CONTAINER_ID = `bizum-button-container_#${Math.random() * 1e4}`;
 const BLIK_BUTTON_CONTAINER_ID = `blik-button-container_#${Math.random() * 1e4}`;
 const MBWAY_BUTTON_CONTAINER_ID = `mbway-button-container_#${Math.random() * 1e4}`;
+const PIX_QR_BUTTON_CONTAINER_ID = `pix-qr-button-container_#${Math.random() * 1e4}`;
 var MessageType;
 (function(MessageType2) {
   MessageType2["Mounted"] = "mounted";
@@ -86,6 +87,7 @@ var PayableEntity;
   PayableEntity2["Resign"] = "resign";
   PayableEntity2["Paypal"] = "paypal";
   PayableEntity2["Pix"] = "pix";
+  PayableEntity2["PixQr"] = "pix-qr";
   PayableEntity2["Bizum"] = "bizum";
   PayableEntity2["Blik"] = "blik";
   PayableEntity2["Mbway"] = "mbway";
@@ -246,6 +248,10 @@ const payButtonIds = {
   mbwayButtonParams: {
     title: "MBWay",
     id: MBWAY_BUTTON_CONTAINER_ID
+  },
+  pixQrButtonParams: {
+    title: "Pix QR",
+    id: PIX_QR_BUTTON_CONTAINER_ID
   }
 };
 function getPayButtonParams(config, key, container) {
@@ -281,7 +287,8 @@ const initPaymentForm = async (props) => {
     pixContainerRef,
     bizumContainerRef,
     blikContainerRef,
-    mbwayContainerRef
+    mbwayContainerRef,
+    pixQrContainerRef
   } = props;
   if (!merchantData) {
     throw new Error("Attribute 'merchantData' is required");
@@ -355,6 +362,14 @@ const initPaymentForm = async (props) => {
   if (mbwayButtonParams) {
     initConfig.mbwayButtonParams = mbwayButtonParams;
   }
+  const pixQrButtonParams = getPayButtonParams(
+    props,
+    "pixQrButtonParams",
+    pixQrContainerRef
+  );
+  if (pixQrButtonParams) {
+    initConfig.pixQrButtonParams = pixQrButtonParams;
+  }
   return clientSdk.init(initConfig);
 };
 const onSubscribe = (sdkInstanceValue, callbacks) => {
@@ -431,6 +446,7 @@ const _sfc_main$1 = defineComponent({
     bizumButtonParams: {},
     blikButtonParams: {},
     mbwayButtonParams: {},
+    pixQrButtonParams: {},
     googlePayContainerRef: {},
     applePayContainerRef: {},
     paypalContainerRef: {},
@@ -438,6 +454,7 @@ const _sfc_main$1 = defineComponent({
     bizumContainerRef: {},
     blikContainerRef: {},
     mbwayContainerRef: {},
+    pixQrContainerRef: {},
     onReadyPaymentInstance: {},
     onPaymentDetails: { type: Function, default: () => {
     } },
@@ -482,13 +499,15 @@ const _sfc_main$1 = defineComponent({
       bizumButtonParams: props.bizumButtonParams,
       blikButtonParams: props.blikButtonParams,
       mbwayButtonParams: props.mbwayButtonParams,
+      pixQrButtonParams: props.pixQrButtonParams,
       googlePayContainerRef: props.googlePayContainerRef,
       applePayContainerRef: props.applePayContainerRef,
       paypalContainerRef: props.paypalContainerRef,
       pixContainerRef: props.pixContainerRef,
       bizumContainerRef: props.bizumContainerRef,
       blikContainerRef: props.blikContainerRef,
-      mbwayContainerRef: props.mbwayContainerRef
+      mbwayContainerRef: props.mbwayContainerRef,
+      pixQrContainerRef: props.pixQrContainerRef
     };
     const callbacks = {
       onMounted: (e) => props.onMounted && props.onMounted(e),
@@ -533,7 +552,7 @@ const _sfc_main$1 = defineComponent({
     };
   }
 });
-var Payment = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-757b2e2e"]]);
+var Payment = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d55f0b28"]]);
 const initResignForm = async (config) => {
   if (!config.resignRequest) {
     throw new Error("Attribute 'resignRequest' is required");

package/dist/interfaces/PaymentProps.d.ts

@@ -12,6 +12,7 @@ interface PaymentProps extends Partial<ClientSdkEventsProvider> {
     bizumButtonParams?: Omit<InitConfig['bizumButtonParams'], 'containerId'>;
     blikButtonParams?: Omit<InitConfig['blikButtonParams'], 'containerId'>;
     mbwayButtonParams?: Omit<InitConfig['mbwayButtonParams'], 'containerId'>;
+    pixQrButtonParams?: Omit<InitConfig['pixQrButtonParams'], 'containerId'>;
     googlePayContainerRef?: HTMLDivElement;
     applePayContainerRef?: HTMLDivElement;
     paypalContainerRef?: HTMLDivElement;
@@ -19,6 +20,7 @@ interface PaymentProps extends Partial<ClientSdkEventsProvider> {
     bizumContainerRef?: HTMLDivElement;
     blikContainerRef?: HTMLDivElement;
     mbwayContainerRef?: HTMLDivElement;
+    pixQrContainerRef?: HTMLDivElement;
     onReadyPaymentInstance?: (paymentInstance: ClientSdkInstance) => void;
 }
 export default PaymentProps;

package/dist/utils/getPayButtonParams.d.ts

@@ -1,3 +1,3 @@
 import { InitConfig } from '@solidgate/client-sdk-loader';
-declare function getPayButtonParams<T extends 'googlePayButtonParams' | 'applePayButtonParams' | 'paypalButtonParams' | 'pixButtonParams' | 'bizumButtonParams' | 'blikButtonParams' | 'mbwayButtonParams'>(config: InitConfig, key: T, container: HTMLElement | undefined): NonNullable<InitConfig[T]> | undefined;
+declare function getPayButtonParams<T extends 'googlePayButtonParams' | 'applePayButtonParams' | 'paypalButtonParams' | 'pixButtonParams' | 'bizumButtonParams' | 'blikButtonParams' | 'mbwayButtonParams' | 'pixQrButtonParams'>(config: InitConfig, key: T, container: HTMLElement | undefined): NonNullable<InitConfig[T]> | undefined;
 export default getPayButtonParams;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidgate/vue-sdk",
-  "version": "1.26.0",
+  "version": "1.28.0",
   "repository": "https://github.com/solidgate-tech/vue-sdk",
   "files": [
     "dist"
@@ -28,7 +28,7 @@
     "vue": "^3.2.25"
   },
   "dependencies": {
-    "@solidgate/client-sdk-loader": "^1.26.0"
+    "@solidgate/client-sdk-loader": "^1.28.0"
   },
   "devDependencies": {
     "@babel/types": "^7.24.5",
@@ -51,4 +51,4 @@
     "vue": "^3.2.25",
     "vue-tsc": "^1.5.1"
   }
-}
+}