@achyutlabsau/vue-payment-gateway 0.12.1 → 0.13.0

package/README.md

@@ -1,168 +1,168 @@
-# Vue Payment Gateway
-
-A Vue.js payment gateway library to handle payments with ease.
-
-## Installation
-
-To install the library, run the following command:
-
-```bash
-npm install @achyutlabsau/vue-payment-gateway
-```
-
-## Plugin Initialization
-
-To use the payment gateway, you need to initialize the plugin in your Vue app. Here’s an example of how to set it up:
-
-```javascript
-import VuePaymentGateway from "@achyutlabsau/vue-payment-gateway";
-
-app.use(VuePaymentGateway, {
-  currencyCode: "AUD",
-  productName: "Pratham Respos", // Name of your product
-  productVersion: "3.3.0", // Version of your product
-  productVendorName: "Achyutlabs", // Name of the product vendor
-  posId: "unique-pos-id", // Unique identifier for the POS system
-  posRegisterId: "pos-register-id", // Unique identifier for the POS register
-  posRegisterName: "register-name", // Name of the POS register
-  posBusinessName: "business name", // Name of the business using the POS system
-  tyroApiKey: "tyro-api-key", // API key for Tyro integration
-  valpayApiKey: "valpay-api-key", // API key for Valpay (Adyen) integration
-  environment: "development", // Set environment to 'development' or 'production'
-});
-```
-
-> **Note:** Replace the placeholder values with the actual details of your POS system, product, and Tyro API key.
-
-## Using the Payment Gateway
-
-This library supports multiple payment providers, such as Tyro, SmartPay, and Linkly. Here’s how to use them in your application.
-
-### Using Tyro
-
-To use the Tyro payment gateway, import and initialize it as shown below:
-
-```javascript
-import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";
-
-const tyro = useTyro();
-
-// Example usage
-await tyro.processPayment(amount, options);
-```
-
-### Using SmartPay
-
-To use the SmartPay payment gateway, import and initialize it as shown below:
-
-```javascript
-import { useSmartPay } from "@achyutlabsau/vue-payment-gateway/smartpay";
-
-const smartPay = useSmartPay();
-
-// Example usage
-await smartPay.processPayment(amount, options);
-```
-
-### Using Linkly
-
-To use the Linkly payment gateway, import and initialize it as shown below:
-
-```javascript
-import { useLinkly } from "@achyutlabsau/vue-payment-gateway/linkly";
-
-const linkly = useLinkly();
-
-// Example usage
-await linkly.processPayment(amount, options);
-```
-
-### Using Valpay (Adyen)
-
-To use the Valpay (Adyen Terminal API) payment gateway, import and initialize it as shown below:
-
-```javascript
-import { useValpay } from "@achyutlabsau/vue-payment-gateway/valpay";
-
-const valpay = useValpay();
-
-// Get connected terminals
-const { success, terminals } = await valpay.getConnectedTerminals();
-
-// Process a payment
-const result = await valpay.processPayment(
-  10050, // Amount in minor units (100.50)
-  "AUD", // Currency code
-  "V400m-324688179", // Terminal ID (POIID)
-  "transaction-12345", // Transaction ID
-  "POSSystemID12345", // Sale ID
-);
-
-// Cancel an ongoing payment
-const cancelResult = await valpay.cancelPayment("MerchantAbort");
-```
-
-## Payment Method API
-
-Each payment provider (Tyro, SmartPay, Linkly) provides methods to process payments. Here are some of the most commonly used methods:
-
-### `processPayment(amount: number, options?: object)`
-
-Processes a payment for the specified amount.
-
-**Parameters:**
-
-- `amount`: The amount to be charged.
-- `options`: (Optional) Additional options for the payment.
-
-### `cancelPayment()`
-
-Cancels an ongoing payment.
-
-### `getStatus()`
-
-Gets the status of the current payment transaction.
-
-> **Note:** The methods may differ slightly between Tyro, SmartPay, and Linkly. Refer to the official documentation of each payment provider for more details.
-
-## Environment Configuration
-
-The environment can be set to either `development` or `production`. Make sure to use `development` during testing and switch to `production` in a live environment to ensure security and proper tracking.
-
-```javascript
-app.use(VuePaymentGateway, {
-  ...
-  environment: "production", // Set to 'production' in a live environment
-});
-```
-
-## Example Usage
-
-Here’s a complete example of how you might use the payment gateway to process a payment with Tyro:
-
-```javascript
-import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";
-
-const tyro = useTyro();
-
-async function handlePayment() {
-  try {
-    const paymentResult = await tyro.processPayment(100, { currency: "USD" });
-    console.log("Payment successful:", paymentResult);
-  } catch (error) {
-    console.error("Payment failed:", error);
-  }
-}
-```
-
-## Troubleshooting
-
-- **Environment Issues**: Make sure `environment` is set correctly (`development` or `production`).
-- **Invalid API Key**: Ensure the Tyro API key is valid and correctly set in the configuration.
-- **Payment Processing Issues**: Check if the payment provider's service is online and available.
-
-## Additional Resources
-
-For more details and usage examples, refer to the official documentation or support channels provided by [Achyutlabs](https://achyutlabs.com/).
-
-With this guide, you should be able to set up and use the Vue Payment Gateway efficiently to handle payments with Tyro, SmartPay, and Linkly integrations.
+# Vue Payment Gateway
+
+A Vue.js payment gateway library to handle payments with ease.
+
+## Installation
+
+To install the library, run the following command:
+
+```bash
+npm install @achyutlabsau/vue-payment-gateway
+```
+
+## Plugin Initialization
+
+To use the payment gateway, you need to initialize the plugin in your Vue app. Here’s an example of how to set it up:
+
+```javascript
+import VuePaymentGateway from "@achyutlabsau/vue-payment-gateway";
+
+app.use(VuePaymentGateway, {
+  currencyCode: "AUD",
+  productName: "Pratham Respos", // Name of your product
+  productVersion: "3.3.0", // Version of your product
+  productVendorName: "Achyutlabs", // Name of the product vendor
+  posId: "unique-pos-id", // Unique identifier for the POS system
+  posRegisterId: "pos-register-id", // Unique identifier for the POS register
+  posRegisterName: "register-name", // Name of the POS register
+  posBusinessName: "business name", // Name of the business using the POS system
+  tyroApiKey: "tyro-api-key", // API key for Tyro integration
+  valpayApiKey: "valpay-api-key", // API key for Valpay (Adyen) integration
+  environment: "development", // Set environment to 'development' or 'production'
+});
+```
+
+> **Note:** Replace the placeholder values with the actual details of your POS system, product, and Tyro API key.
+
+## Using the Payment Gateway
+
+This library supports multiple payment providers, such as Tyro, SmartPay, and Linkly. Here’s how to use them in your application.
+
+### Using Tyro
+
+To use the Tyro payment gateway, import and initialize it as shown below:
+
+```javascript
+import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";
+
+const tyro = useTyro();
+
+// Example usage
+await tyro.processPayment(amount, options);
+```
+
+### Using SmartPay
+
+To use the SmartPay payment gateway, import and initialize it as shown below:
+
+```javascript
+import { useSmartPay } from "@achyutlabsau/vue-payment-gateway/smartpay";
+
+const smartPay = useSmartPay();
+
+// Example usage
+await smartPay.processPayment(amount, options);
+```
+
+### Using Linkly
+
+To use the Linkly payment gateway, import and initialize it as shown below:
+
+```javascript
+import { useLinkly } from "@achyutlabsau/vue-payment-gateway/linkly";
+
+const linkly = useLinkly();
+
+// Example usage
+await linkly.processPayment(amount, options);
+```
+
+### Using Valpay (Adyen)
+
+To use the Valpay (Adyen Terminal API) payment gateway, import and initialize it as shown below:
+
+```javascript
+import { useValpay } from "@achyutlabsau/vue-payment-gateway/valpay";
+
+const valpay = useValpay();
+
+// Get connected terminals
+const { success, terminals } = await valpay.getConnectedTerminals();
+
+// Process a payment
+const result = await valpay.processPayment(
+  10050, // Amount in minor units (100.50)
+  "AUD", // Currency code
+  "V400m-324688179", // Terminal ID (POIID)
+  "transaction-12345", // Transaction ID
+  "POSSystemID12345", // Sale ID
+);
+
+// Cancel an ongoing payment
+const cancelResult = await valpay.cancelPayment("MerchantAbort");
+```
+
+## Payment Method API
+
+Each payment provider (Tyro, SmartPay, Linkly) provides methods to process payments. Here are some of the most commonly used methods:
+
+### `processPayment(amount: number, options?: object)`
+
+Processes a payment for the specified amount.
+
+**Parameters:**
+
+- `amount`: The amount to be charged.
+- `options`: (Optional) Additional options for the payment.
+
+### `cancelPayment()`
+
+Cancels an ongoing payment.
+
+### `getStatus()`
+
+Gets the status of the current payment transaction.
+
+> **Note:** The methods may differ slightly between Tyro, SmartPay, and Linkly. Refer to the official documentation of each payment provider for more details.
+
+## Environment Configuration
+
+The environment can be set to either `development` or `production`. Make sure to use `development` during testing and switch to `production` in a live environment to ensure security and proper tracking.
+
+```javascript
+app.use(VuePaymentGateway, {
+  ...
+  environment: "production", // Set to 'production' in a live environment
+});
+```
+
+## Example Usage
+
+Here’s a complete example of how you might use the payment gateway to process a payment with Tyro:
+
+```javascript
+import { useTyro } from "@achyutlabsau/vue-payment-gateway/tyro";
+
+const tyro = useTyro();
+
+async function handlePayment() {
+  try {
+    const paymentResult = await tyro.processPayment(100, { currency: "USD" });
+    console.log("Payment successful:", paymentResult);
+  } catch (error) {
+    console.error("Payment failed:", error);
+  }
+}
+```
+
+## Troubleshooting
+
+- **Environment Issues**: Make sure `environment` is set correctly (`development` or `production`).
+- **Invalid API Key**: Ensure the Tyro API key is valid and correctly set in the configuration.
+- **Payment Processing Issues**: Check if the payment provider's service is online and available.
+
+## Additional Resources
+
+For more details and usage examples, refer to the official documentation or support channels provided by [Achyutlabs](https://achyutlabs.com/).
+
+With this guide, you should be able to set up and use the Vue Payment Gateway efficiently to handle payments with Tyro, SmartPay, and Linkly integrations.

package/dist/PBtn-CB98SoO5.js

@@ -0,0 +1,19 @@
+import { createBlock as e, defineComponent as t, openBlock as n, unref as r } from "vue";
+import { QBtn as i } from "quasar";
+//#endregion
+//#region src/components/PBtn.vue
+var a = /* @__PURE__ */ t({
+	__name: "PBtn",
+	setup(t) {
+		return (t, a) => (n(), e(r(i), {
+			label: "Cancel",
+			color: "primary",
+			size: "16px",
+			class: "!py-2.5",
+			unelevated: "",
+			ripple: !1
+		}));
+	}
+});
+//#endregion
+export { a as t };

package/dist/PairInstructions-BxzivULm.js

@@ -0,0 +1,65 @@
+import { t as e } from "./PBtn-CB98SoO5.js";
+import { Fragment as t, createBlock as n, createElementBlock as r, createElementVNode as i, createVNode as a, defineComponent as o, openBlock as s, reactive as c, ref as l, renderList as u, toDisplayString as d, unref as f, withCtx as p } from "vue";
+import { QCard as m, QIcon as h } from "quasar";
+//#region src/plugin/state.ts
+var g = /* @__PURE__ */ function(e) {
+	return e.Tyro = "tyro", e.TillPayment = "till-instore", e.MX51 = "mx51-spi", e.Linkly = "linkly", e.SmartPay = "smartpay", e.ANZ = "anz-instore", e.Valpay = "adyen-instore", e;
+}({}), _ = c({
+	productName: "",
+	productVersion: "",
+	productVendorName: "",
+	posId: "",
+	posRegisterId: "",
+	posRegisterName: "",
+	posBusinessName: "",
+	tyroApiKey: "",
+	tillPaymentApiKey: "",
+	tillPaymentMerchantId: "",
+	mx51DeviceApiKey: "",
+	apiBaseUrl: ""
+}), v = l("AUD"), y = l("production"), b = l(!1), x = (e) => {
+	e.productName && (_.productName = e.productName), e.productVersion && (_.productVersion = e.productVersion), e.productVendorName && (_.productVendorName = e.productVendorName), e.posId && (_.posId = e.posId), e.posRegisterId && (_.posRegisterId = e.posRegisterId), e.posRegisterName && (_.posRegisterName = e.posRegisterName), e.posBusinessName && (_.posBusinessName = e.posBusinessName), e.tyroApiKey && (_.tyroApiKey = e.tyroApiKey), e.tillPaymentApiKey && (_.tillPaymentApiKey = e.tillPaymentApiKey), e.tillPaymentMerchantId && (_.tillPaymentMerchantId = e.tillPaymentMerchantId), e.mx51DeviceApiKey && (_.mx51DeviceApiKey = e.mx51DeviceApiKey), e.apiBaseUrl && (_.apiBaseUrl = e.apiBaseUrl);
+}, S = (e) => v.value = e, C = (e) => y.value = e, w = () => {
+	if (b.value) return !0;
+	throw Error("[Vue Payment Gateway] Plugin is not initialized.");
+}, T = "M2,6H4V18H2V6M5,6H6V18H5V6M7,6H10V18H7V6M11,6H12V18H11V6M14,6H16V18H14V6M17,6H20V18H17V6M21,6H22V18H21V6Z", E = "M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M10 17L5 12L6.41 10.59L10 14.17L17.59 6.58L19 8L10 17Z", D = "M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z", O = "M3 6H21V4H3C1.9 4 1 4.9 1 6V18C1 19.1 1.9 20 3 20H7V18H3V6M13 12H9V13.78C8.39 14.33 8 15.11 8 16C8 16.89 8.39 17.67 9 18.22V20H13V18.22C13.61 17.67 14 16.88 14 16S13.61 14.33 13 13.78V12M11 17.5C10.17 17.5 9.5 16.83 9.5 16S10.17 14.5 11 14.5 12.5 15.17 12.5 16 11.83 17.5 11 17.5M22 8H16C15.5 8 15 8.5 15 9V19C15 19.5 15.5 20 16 20H22C22.5 20 23 19.5 23 19V9C23 8.5 22.5 8 22 8M21 18H17V10H21V18Z", k = "M13,9H11V7H13M13,17H11V11H13M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z", A = "M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z", j = "M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z", M = { class: "mb-8 space-y-4" }, N = { class: "flex items-center justify-center" }, P = { class: "mb-8 space-y-4" }, F = { class: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-gray-100 font-semibold dark:bg-gray-700" }, I = { class: "text-gray-700 dark:text-gray-200" }, L = { class: "mb-6 flex items-start space-x-3 rounded-lg bg-amber-50 p-4 text-base dark:bg-slate-700" }, R = { class: "flex justify-end" }, z = /* @__PURE__ */ o({
+	__name: "PairInstructions",
+	props: { steps: {} },
+	emits: ["next"],
+	setup(o) {
+		return (c, l) => (s(), n(f(m), {
+			class: "rounded-lg p-6",
+			flat: "",
+			bordered: ""
+		}, {
+			default: p(() => [
+				i("div", M, [
+					i("div", N, [a(f(h), {
+						name: f(O),
+						size: "4rem",
+						class: "text-primary"
+					}, null, 8, ["name"])]),
+					l[1] ||= i("h2", { class: "text-center text-2xl !font-medium" }, "Terminal Setup Instructions", -1),
+					l[2] ||= i("p", { class: "text-center text-base text-gray-600 dark:text-gray-200" }, " Please follow these steps to pair your terminal ", -1)
+				]),
+				i("ul", P, [(s(!0), r(t, null, u(o.steps, (e, t) => (s(), r("li", {
+					key: t,
+					class: "flex flex-nowrap items-center space-x-3 text-base"
+				}, [i("span", F, d(t + 1), 1), i("span", I, d(e), 1)]))), 128))]),
+				i("div", L, [a(f(h), {
+					name: f(k),
+					size: "md",
+					class: "mt-0.5 text-amber-500 dark:text-white"
+				}, null, 8, ["name"]), l[3] ||= i("div", { class: "flex-1" }, [i("div", { class: "font-medium text-amber-800 dark:text-white" }, "Important Note"), i("div", { class: "text-amber-700 dark:text-gray-300" }, " Please refer to your terminal guide for the most up-to-date instructions. ")], -1)]),
+				i("div", R, [a(e, {
+					"icon-right": "chevron_right",
+					label: "Next",
+					onClick: l[0] ||= (e) => c.$emit("next")
+				})])
+			]),
+			_: 1
+		}));
+	}
+});
+//#endregion
+export { A as a, w as c, b as d, S as f, _ as h, D as i, v as l, x as m, T as n, j as o, C as p, E as r, g as s, z as t, y as u };

package/dist/TransactionDialog-C-ZrH_o5.js

@@ -0,0 +1,58 @@
+import { t as e } from "./PBtn-CB98SoO5.js";
+import { createBlock as t, createCommentVNode as n, createElementVNode as r, createVNode as i, defineComponent as a, openBlock as o, resolveDirective as s, toDisplayString as c, unref as l, withCtx as u, withDirectives as d } from "vue";
+import { QCard as f, QCardSection as p, QDialog as m, useDialogPluginComponent as h } from "quasar";
+//#region src/components/TransactionDialog.vue?vue&type=script&setup=true&lang.ts
+var g = { class: "text-center text-lg font-semibold text-gray-500 uppercase" }, _ = { class: "text-center text-lg font-semibold text-gray-500 uppercase" }, v = { class: "text-center text-lg font-semibold text-gray-500 uppercase" }, y = /* @__PURE__ */ a({
+	__name: "TransactionDialog",
+	props: {
+		message: {},
+		title: {},
+		cancelTxn: { type: Function }
+	},
+	emits: [...h.emits],
+	setup(a) {
+		let { dialogRef: y, onDialogHide: b } = h();
+		return (h, x) => {
+			let S = s("close-popup");
+			return o(), t(l(m), {
+				ref_key: "dialogRef",
+				ref: y,
+				onHide: l(b),
+				persistent: ""
+			}, {
+				default: u(() => [i(l(f), { class: "q-dialog-plugin px-6 py-3" }, {
+					default: u(() => [a.title === "INPROGRESS" ? (o(), t(l(p), { key: 0 }, {
+						default: u(() => [r("div", g, c(a.message), 1), i(e, {
+							label: "Cancel",
+							onClick: a.cancelTxn,
+							color: "primary",
+							outline: "",
+							class: "!mt-6 !w-full"
+						}, null, 8, ["onClick"])]),
+						_: 1
+					})) : a.title === "SUCCESS" ? (o(), t(l(p), { key: 1 }, {
+						default: u(() => [r("div", _, c(a.message), 1), d(i(e, {
+							label: "OK",
+							color: "primary",
+							outline: "",
+							class: "!mt-6 !w-full"
+						}, null, 512), [[S]])]),
+						_: 1
+					})) : a.title === "FAILED" ? (o(), t(l(p), { key: 2 }, {
+						default: u(() => [r("div", v, c(a.message), 1), d(i(e, {
+							label: "OK",
+							color: "primary",
+							outline: "",
+							class: "!mt-6 !w-full"
+						}, null, 512), [[S]])]),
+						_: 1
+					})) : n("", !0)]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["onHide"]);
+		};
+	}
+});
+//#endregion
+export { y as t };

package/dist/emitter-BNPvJMuc.js

@@ -0,0 +1,5 @@
+import { EventBus as e } from "quasar";
+//#region src/utils/emitter.ts
+var t = new e();
+//#endregion
+export { t };