@pinerohit11/testwidget 0.1.20 → 0.1.22
Sign up to get free protection for your applications and to get access to all the features.
- package/.next/app-build-manifest.json +1 -0
- package/.next/build-manifest.json +13 -2
- package/.next/cache/webpack/client-development/0.pack.gz +0 -0
- package/.next/cache/webpack/client-development/1.pack.gz +0 -0
- package/.next/cache/webpack/client-development/10.pack.gz +0 -0
- package/.next/cache/webpack/client-development/11.pack.gz +0 -0
- package/.next/cache/webpack/client-development/12.pack.gz +0 -0
- package/.next/cache/webpack/client-development/13.pack.gz +0 -0
- package/.next/cache/webpack/client-development/14.pack.gz +0 -0
- package/.next/cache/webpack/client-development/15.pack.gz +0 -0
- package/.next/cache/webpack/client-development/16.pack.gz +0 -0
- package/.next/cache/webpack/client-development/17.pack.gz +0 -0
- package/.next/cache/webpack/client-development/18.pack.gz +0 -0
- package/.next/cache/webpack/client-development/19.pack.gz +0 -0
- package/.next/cache/webpack/client-development/2.pack.gz +0 -0
- package/.next/cache/webpack/client-development/3.pack.gz +0 -0
- package/.next/cache/webpack/client-development/4.pack.gz +0 -0
- package/.next/cache/webpack/client-development/5.pack.gz +0 -0
- package/.next/cache/webpack/client-development/6.pack.gz +0 -0
- package/.next/cache/webpack/client-development/7.pack.gz +0 -0
- package/.next/cache/webpack/client-development/index.pack.gz +0 -0
- package/.next/cache/webpack/client-development/index.pack.gz.old +0 -0
- package/.next/cache/webpack/client-development-fallback/0.pack.gz +0 -0
- package/.next/cache/webpack/client-development-fallback/1.pack.gz +0 -0
- package/.next/cache/webpack/client-development-fallback/index.pack.gz +0 -0
- package/.next/cache/webpack/client-development-fallback/index.pack.gz.old +0 -0
- package/.next/cache/webpack/server-development/0.pack.gz +0 -0
- package/.next/cache/webpack/server-development/1.pack.gz +0 -0
- package/.next/cache/webpack/server-development/10.pack.gz +0 -0
- package/.next/cache/webpack/server-development/11.pack.gz +0 -0
- package/.next/cache/webpack/server-development/12.pack.gz +0 -0
- package/.next/cache/webpack/server-development/13.pack.gz +0 -0
- package/.next/cache/webpack/server-development/2.pack.gz +0 -0
- package/.next/cache/webpack/server-development/3.pack.gz +0 -0
- package/.next/cache/webpack/server-development/4.pack.gz +0 -0
- package/.next/cache/webpack/server-development/5.pack.gz +0 -0
- package/.next/cache/webpack/server-development/6.pack.gz +0 -0
- package/.next/cache/webpack/server-development/7.pack.gz +0 -0
- package/.next/cache/webpack/server-development/8.pack.gz +0 -0
- package/.next/cache/webpack/server-development/9.pack.gz +0 -0
- package/.next/cache/webpack/server-development/index.pack.gz +0 -0
- package/.next/cache/webpack/server-development/index.pack.gz.old +0 -0
- package/.next/fallback-build-manifest.json +28 -0
- package/.next/server/_error.js +76 -0
- package/.next/server/app/_not-found/page.js +2 -2
- package/.next/server/app/_not-found/page_client-reference-manifest.js +1 -1
- package/.next/server/app/page.js +15 -15
- package/.next/server/app/page_client-reference-manifest.js +1 -1
- package/.next/server/middleware-build-manifest.js +13 -2
- package/.next/server/pages/_app.js +46 -0
- package/.next/server/pages/_document.js +66 -0
- package/.next/server/pages/_error.js +76 -0
- package/.next/server/pages-manifest.json +5 -1
- package/.next/server/vendor-chunks/@swc.js +20 -0
- package/.next/server/vendor-chunks/bootstrap.js +2 -2
- package/.next/server/vendor-chunks/next.js +417 -0
- package/.next/server/webpack-runtime.js +1 -1
- package/.next/static/chunks/_error.js +28 -0
- package/.next/static/chunks/app/layout.js +8 -30
- package/.next/static/chunks/app/page.js +23 -1
- package/.next/static/chunks/fallback/amp.js +885 -0
- package/.next/static/chunks/fallback/main.js +2057 -0
- package/.next/static/chunks/fallback/pages/_app.js +28 -0
- package/.next/static/chunks/fallback/pages/_error.js +28 -0
- package/.next/static/chunks/fallback/react-refresh.js +62 -0
- package/.next/static/chunks/fallback/webpack.js +1210 -0
- package/.next/static/chunks/main.js +2057 -0
- package/.next/static/chunks/pages/_app.js +28 -0
- package/.next/static/chunks/pages/_error.js +28 -0
- package/.next/static/chunks/react-refresh.js +62 -0
- package/.next/static/chunks/webpack.js +1 -1
- package/.next/static/css/app/layout.css +0 -699
- package/.next/static/css/app/page.css +9 -9
- package/.next/static/development/_buildManifest.js +1 -1
- package/.next/static/webpack/09b6bf9d551718e6.webpack.hot-update.json +1 -0
- package/.next/static/webpack/255312d1130cf6ec.webpack.hot-update.json +1 -0
- package/.next/static/webpack/32e5c09644d13662.webpack.hot-update.json +1 -0
- package/.next/static/webpack/33df40926ef177b8.webpack.hot-update.json +1 -0
- package/.next/static/webpack/3fffc4287d1af227.webpack.hot-update.json +1 -0
- package/.next/static/webpack/5a1cff97146b50bb.webpack.hot-update.json +1 -0
- package/.next/static/webpack/605a7773ba1d798b.webpack.hot-update.json +1 -0
- package/.next/static/webpack/7e9ea68e1248f8c4.webpack.hot-update.json +1 -0
- package/.next/static/webpack/954c98691962cd98.webpack.hot-update.json +1 -0
- package/.next/static/webpack/973f3512b11e3d54.webpack.hot-update.json +1 -0
- package/.next/static/webpack/98ceb1d86c3608da.webpack.hot-update.json +1 -0
- package/.next/static/webpack/a09fb847fbd6c830.webpack.hot-update.json +1 -0
- package/.next/static/webpack/a6280d0500ceb91c.webpack.hot-update.json +1 -0
- package/.next/static/webpack/app/layout.255312d1130cf6ec.hot-update.js +31 -0
- package/.next/static/webpack/app/layout.32e5c09644d13662.hot-update.js +32 -0
- package/.next/static/webpack/app/layout.33df40926ef177b8.hot-update.js +21 -0
- package/.next/static/webpack/app/layout.3fffc4287d1af227.hot-update.js +31 -0
- package/.next/static/webpack/app/layout.5a1cff97146b50bb.hot-update.js +21 -0
- package/.next/static/webpack/app/layout.7e9ea68e1248f8c4.hot-update.js +31 -0
- package/.next/static/webpack/app/layout.954c98691962cd98.hot-update.js +21 -0
- package/.next/static/webpack/app/layout.a09fb847fbd6c830.hot-update.js +31 -0
- package/.next/static/webpack/app/layout.a6280d0500ceb91c.hot-update.js +22 -0
- package/.next/static/webpack/app/layout.c6e67d2545c174a8.hot-update.js +21 -0
- package/.next/static/webpack/app/layout.dcebba06ee4c3470.hot-update.js +31 -0
- package/.next/static/webpack/app/layout.f678ffea2e9fb9a3.hot-update.js +32 -0
- package/.next/static/webpack/app/page.09b6bf9d551718e6.hot-update.js +32 -0
- package/.next/static/webpack/app/page.605a7773ba1d798b.hot-update.js +32 -0
- package/.next/static/webpack/app/page.954c98691962cd98.hot-update.js +22 -0
- package/.next/static/webpack/app-pages-internals.98ceb1d86c3608da.hot-update.js +186 -0
- package/.next/static/webpack/app-pages-internals.dcebba06ee4c3470.hot-update.js +21 -0
- package/.next/static/webpack/c6e67d2545c174a8.webpack.hot-update.json +1 -0
- package/.next/static/webpack/dcebba06ee4c3470.webpack.hot-update.json +1 -0
- package/.next/static/webpack/f678ffea2e9fb9a3.webpack.hot-update.json +1 -0
- package/.next/static/webpack/webpack.09b6bf9d551718e6.hot-update.js +18 -0
- package/.next/static/webpack/webpack.255312d1130cf6ec.hot-update.js +18 -0
- package/.next/static/webpack/webpack.32e5c09644d13662.hot-update.js +18 -0
- package/.next/static/webpack/webpack.33df40926ef177b8.hot-update.js +18 -0
- package/.next/static/webpack/webpack.3fffc4287d1af227.hot-update.js +18 -0
- package/.next/static/webpack/webpack.5a1cff97146b50bb.hot-update.js +18 -0
- package/.next/static/webpack/webpack.605a7773ba1d798b.hot-update.js +18 -0
- package/.next/static/webpack/webpack.7e9ea68e1248f8c4.hot-update.js +18 -0
- package/.next/static/webpack/webpack.954c98691962cd98.hot-update.js +18 -0
- package/.next/static/webpack/webpack.973f3512b11e3d54.hot-update.js +18 -0
- package/.next/static/webpack/webpack.98ceb1d86c3608da.hot-update.js +18 -0
- package/.next/static/webpack/webpack.a09fb847fbd6c830.hot-update.js +18 -0
- package/.next/static/webpack/webpack.a6280d0500ceb91c.hot-update.js +18 -0
- package/.next/static/webpack/webpack.c6e67d2545c174a8.hot-update.js +18 -0
- package/.next/static/webpack/webpack.dcebba06ee4c3470.hot-update.js +18 -0
- package/.next/static/webpack/webpack.f678ffea2e9fb9a3.hot-update.js +18 -0
- package/.next/trace +51 -0
- package/dist/index.cjs +1 -523
- package/dist/index.css +1 -544
- package/dist/index.js +1 -491
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -1,491 +1 @@
|
|
1
|
-
var __defProp = Object.defineProperty;
|
2
|
-
var __defProps = Object.defineProperties;
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
8
|
-
var __spreadValues = (a, b) => {
|
9
|
-
for (var prop in b || (b = {}))
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
12
|
-
if (__getOwnPropSymbols)
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
14
|
-
if (__propIsEnum.call(b, prop))
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
16
|
-
}
|
17
|
-
return a;
|
18
|
-
};
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
20
|
-
|
21
|
-
// src/app/index.ts
|
22
|
-
import "bootstrap/dist/css/bootstrap.min.css";
|
23
|
-
|
24
|
-
// src/app/components/Greet.tsx
|
25
|
-
import axios from "axios";
|
26
|
-
import React, { useEffect, useState } from "react";
|
27
|
-
import { Button, Modal } from "react-bootstrap";
|
28
|
-
function PaywithFractal({ name, amount, orderId, fractalPayClientKey }) {
|
29
|
-
const baseUrl = "http://192.168.1.52:8082/";
|
30
|
-
const masterBaseUrl = "http://192.168.1.52:8081/";
|
31
|
-
console.log(name, "name", window == null ? void 0 : window.DatacapWebToken);
|
32
|
-
const [dcToken, setDcToken] = useState("");
|
33
|
-
const [error, setError] = useState({});
|
34
|
-
const [toggleQr, setToggleQr] = useState(false);
|
35
|
-
const [formData, setFormData] = useState({
|
36
|
-
name: "John Doe",
|
37
|
-
card_number: "4761 7310 0000 0043",
|
38
|
-
exp_month: "12",
|
39
|
-
exp_year: "2024",
|
40
|
-
cvv: "201",
|
41
|
-
zip: ""
|
42
|
-
});
|
43
|
-
const [loading, setLoading] = useState(false);
|
44
|
-
const [show, setShow] = useState(false);
|
45
|
-
const handleSubmit = async (e) => {
|
46
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
47
|
-
e.preventDefault();
|
48
|
-
const data = {
|
49
|
-
description: "widget payment",
|
50
|
-
amount: amount || "1.00",
|
51
|
-
phone_number: "1234567908",
|
52
|
-
zip: formData.zip,
|
53
|
-
orderId: orderId || "",
|
54
|
-
fractalpayPublicKey: fractalPayClientKey
|
55
|
-
};
|
56
|
-
if (Object.keys(error).length < 1) {
|
57
|
-
try {
|
58
|
-
setLoading(true);
|
59
|
-
const res = await axios.post(`${baseUrl}create-widget-order`, data, {
|
60
|
-
headers: {
|
61
|
-
"Content-Type": "application/json"
|
62
|
-
}
|
63
|
-
});
|
64
|
-
if (res.data && ((_a = res.data) == null ? void 0 : _a.result)) {
|
65
|
-
console.log("token", (_b = res.data) == null ? void 0 : _b.data);
|
66
|
-
setDcToken((_d = (_c = res.data) == null ? void 0 : _c.data) == null ? void 0 : _d.dctoken);
|
67
|
-
const tokenCallback = async (response) => {
|
68
|
-
var _a2, _b2, _c2;
|
69
|
-
console.log("response for token call back", response);
|
70
|
-
if (response.Error) {
|
71
|
-
alert("if");
|
72
|
-
console.log("Error: ", response);
|
73
|
-
setLoading(false);
|
74
|
-
} else {
|
75
|
-
const headers = {
|
76
|
-
"Content-Type": "application/x-www-form-urlencoded"
|
77
|
-
};
|
78
|
-
const quickData = __spreadValues({
|
79
|
-
name: formData.name,
|
80
|
-
postal_code: formData.zip
|
81
|
-
}, response);
|
82
|
-
try {
|
83
|
-
const resp = await axios.post(`${masterBaseUrl}quick-pay/${(_b2 = (_a2 = res.data) == null ? void 0 : _a2.data) == null ? void 0 : _b2.posSalesIdEncode}`, quickData, {
|
84
|
-
headers
|
85
|
-
});
|
86
|
-
setLoading(false);
|
87
|
-
console.log("quick response", resp);
|
88
|
-
if (((_c2 = resp == null ? void 0 : resp.data) == null ? void 0 : _c2.result) && (resp == null ? void 0 : resp.status) === 200) {
|
89
|
-
console.log("Payment success!", resp == null ? void 0 : resp.data);
|
90
|
-
setFormData({
|
91
|
-
name: "John Doe",
|
92
|
-
card_number: "4761 7310 0000 0043",
|
93
|
-
exp_month: "12",
|
94
|
-
exp_year: "2024",
|
95
|
-
cvv: "201",
|
96
|
-
zip: ""
|
97
|
-
});
|
98
|
-
} else {
|
99
|
-
console.log("Payment failed!", resp == null ? void 0 : resp.data);
|
100
|
-
}
|
101
|
-
} catch (error2) {
|
102
|
-
console.log("Error: ", error2);
|
103
|
-
setLoading(false);
|
104
|
-
}
|
105
|
-
}
|
106
|
-
};
|
107
|
-
window == null ? void 0 : window.DatacapWebToken.requestToken((_f = (_e = res.data) == null ? void 0 : _e.data) == null ? void 0 : _f.dctoken, "PaymentForm", tokenCallback);
|
108
|
-
} else {
|
109
|
-
setLoading(false);
|
110
|
-
console.log("res", (_g = res.data) == null ? void 0 : _g.data);
|
111
|
-
}
|
112
|
-
} catch (error2) {
|
113
|
-
setLoading(false);
|
114
|
-
console.log(error2);
|
115
|
-
}
|
116
|
-
}
|
117
|
-
};
|
118
|
-
const handleCardFormat = (numericValue) => {
|
119
|
-
const cleaned = ("" + numericValue).replace(/\D/g, "");
|
120
|
-
const match = cleaned.match(/^(\d{4})(\d{4})(\d{4})(\d{4})$/);
|
121
|
-
if (match) {
|
122
|
-
return `${match[1]} ${match[2]} ${match[3]} ${match[4]}`;
|
123
|
-
}
|
124
|
-
return numericValue;
|
125
|
-
};
|
126
|
-
const handleCardNumberChange = (value) => {
|
127
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), { card_number: "" }));
|
128
|
-
if (value && value.match(/[a-zA-Z]/)) {
|
129
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
130
|
-
card_number: "Invalid input. Please enter only numbers."
|
131
|
-
}));
|
132
|
-
} else if (value.length > 12 && !(window == null ? void 0 : window.DatacapWebToken.validateCardNumber(value == null ? void 0 : value.replaceAll(" ", "")))) {
|
133
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
134
|
-
card_number: "Invalid Card Number"
|
135
|
-
}));
|
136
|
-
} else if (!value.length) {
|
137
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
138
|
-
card_number: "Card Number required"
|
139
|
-
}));
|
140
|
-
} else {
|
141
|
-
setError({});
|
142
|
-
}
|
143
|
-
};
|
144
|
-
const handleMonthChange = (value) => {
|
145
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), { exp_month: "" }));
|
146
|
-
if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 1 && parseInt(value, 10) <= 12)) {
|
147
|
-
setError({});
|
148
|
-
} else if (!value.length) {
|
149
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
150
|
-
exp_month: "Month is required"
|
151
|
-
}));
|
152
|
-
} else {
|
153
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
154
|
-
exp_month: "Value should be between 1 and 12"
|
155
|
-
}));
|
156
|
-
}
|
157
|
-
};
|
158
|
-
const handleYearChange = (value) => {
|
159
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), { exp_year: "" }));
|
160
|
-
if (window == null ? void 0 : window.DatacapWebToken.validateExpirationDate(formData.exp_month, value)) {
|
161
|
-
setError({});
|
162
|
-
} else if (!value.length) {
|
163
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
164
|
-
exp_year: "Year is required"
|
165
|
-
}));
|
166
|
-
} else {
|
167
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
168
|
-
exp_year: "Invalid Expiration Date."
|
169
|
-
}));
|
170
|
-
}
|
171
|
-
};
|
172
|
-
const handleCVVChange = (value) => {
|
173
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), { cvv: "" }));
|
174
|
-
if (window == null ? void 0 : window.DatacapWebToken.validateCVV(value)) {
|
175
|
-
setError({});
|
176
|
-
} else if (!value.length) {
|
177
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
178
|
-
cvv: "CVV is required"
|
179
|
-
}));
|
180
|
-
} else {
|
181
|
-
setError((prev) => __spreadProps(__spreadValues({}, prev), {
|
182
|
-
cvv: "Invalid CVV."
|
183
|
-
}));
|
184
|
-
}
|
185
|
-
};
|
186
|
-
const handleChange = (e) => {
|
187
|
-
const token = e.target.getAttribute("data-token") || "";
|
188
|
-
const value = e.target.value;
|
189
|
-
setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [token]: value }));
|
190
|
-
if (token === "card_number") {
|
191
|
-
handleCardNumberChange(value);
|
192
|
-
}
|
193
|
-
if (token === "exp_month") {
|
194
|
-
handleMonthChange(value);
|
195
|
-
}
|
196
|
-
if (token === "exp_year") {
|
197
|
-
handleYearChange(value);
|
198
|
-
}
|
199
|
-
if (token === "cvv") {
|
200
|
-
handleCVVChange(value);
|
201
|
-
}
|
202
|
-
};
|
203
|
-
useEffect(() => {
|
204
|
-
const scriptId = "my-script";
|
205
|
-
const existingScript = document.getElementById(scriptId);
|
206
|
-
if (!existingScript) {
|
207
|
-
const script = document.createElement("script");
|
208
|
-
script.src = "https://token-cert.dcap.com/v1/client";
|
209
|
-
script.id = scriptId;
|
210
|
-
script.async = true;
|
211
|
-
script.onload = () => {
|
212
|
-
if (typeof window !== "undefined" && window.DatacapWebToken) {
|
213
|
-
console.log("DatacapWebToken", window.DatacapWebToken);
|
214
|
-
} else {
|
215
|
-
console.log("DatacapWebToken is not loaded yet.");
|
216
|
-
}
|
217
|
-
};
|
218
|
-
document.head.appendChild(script);
|
219
|
-
}
|
220
|
-
return () => {
|
221
|
-
const script = document.getElementById(scriptId);
|
222
|
-
if (script) {
|
223
|
-
document.head.removeChild(script);
|
224
|
-
}
|
225
|
-
};
|
226
|
-
}, []);
|
227
|
-
const handleClose = () => {
|
228
|
-
setShow(false);
|
229
|
-
};
|
230
|
-
const handleOpen = () => {
|
231
|
-
console.log("open");
|
232
|
-
setShow(true);
|
233
|
-
};
|
234
|
-
console.log(show, "open");
|
235
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { style: { width: "100%", textAlign: "center" } }, /* @__PURE__ */ React.createElement(Button, { onClick: handleOpen }, "Show")), /* @__PURE__ */ React.createElement(
|
236
|
-
Modal,
|
237
|
-
{
|
238
|
-
show,
|
239
|
-
onHide: handleClose,
|
240
|
-
backdrop: "static",
|
241
|
-
keyboard: false,
|
242
|
-
size: "lg"
|
243
|
-
},
|
244
|
-
/* @__PURE__ */ React.createElement(Modal.Body, null, /* @__PURE__ */ React.createElement("div", { className: "bg-black" }, /* @__PURE__ */ React.createElement("div", { className: "container bg-black" }, /* @__PURE__ */ React.createElement("div", { className: "row bg-light no-gutters" }, /* @__PURE__ */ React.createElement("div", { className: "col-sm-12" }, /* @__PURE__ */ React.createElement("div", { className: "bd-example bd-example-tabs right-tabs mttabs m-3 " }, /* @__PURE__ */ React.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ React.createElement(
|
245
|
-
"button",
|
246
|
-
{
|
247
|
-
className: "close-pop",
|
248
|
-
onClick: () => {
|
249
|
-
setShow(false);
|
250
|
-
}
|
251
|
-
},
|
252
|
-
/* @__PURE__ */ React.createElement(
|
253
|
-
"svg",
|
254
|
-
{
|
255
|
-
xmlns: "http://www.w3.org/2000/svg",
|
256
|
-
width: 37,
|
257
|
-
height: 37,
|
258
|
-
viewBox: "0 0 21 21"
|
259
|
-
},
|
260
|
-
/* @__PURE__ */ React.createElement(
|
261
|
-
"path",
|
262
|
-
{
|
263
|
-
fill: "none",
|
264
|
-
stroke: "currentColor",
|
265
|
-
strokeLinecap: "round",
|
266
|
-
strokeLinejoin: "round",
|
267
|
-
d: "m7.5 7.5l6 6m0-6l-6 6"
|
268
|
-
}
|
269
|
-
)
|
270
|
-
)
|
271
|
-
), /* @__PURE__ */ React.createElement("div", { className: "row" }, /* @__PURE__ */ React.createElement("div", { className: "comp-name" }, /* @__PURE__ */ React.createElement(
|
272
|
-
"img",
|
273
|
-
{
|
274
|
-
src: "https://invoicestaging.skysystemz.com/assets/products/65c49a2740ff1.png",
|
275
|
-
alt: "",
|
276
|
-
className: "client-logo"
|
277
|
-
}
|
278
|
-
)), /* @__PURE__ */ React.createElement("div", { className: "" }, /* @__PURE__ */ React.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ React.createElement("div", { className: "header" }, /* @__PURE__ */ React.createElement("h1", null, "Pay"), /* @__PURE__ */ React.createElement(
|
279
|
-
"i",
|
280
|
-
{
|
281
|
-
className: "fa fa-qrcode fa-2x",
|
282
|
-
id: "qrIcon",
|
283
|
-
title: "Show QR Code",
|
284
|
-
onClick: () => setToggleQr(!toggleQr)
|
285
|
-
}
|
286
|
-
)), /* @__PURE__ */ React.createElement("div", { id: "qrCode", style: {
|
287
|
-
display: toggleQr ? "block" : "none"
|
288
|
-
} }, /* @__PURE__ */ React.createElement(
|
289
|
-
"img",
|
290
|
-
{
|
291
|
-
src: "data:image/png;base64,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",
|
292
|
-
alt: "QRCode",
|
293
|
-
srcSet: ""
|
294
|
-
}
|
295
|
-
)), /* @__PURE__ */ React.createElement(
|
296
|
-
"form",
|
297
|
-
{
|
298
|
-
id: "PaymentForm",
|
299
|
-
className: "payment-form",
|
300
|
-
onSubmit: handleSubmit
|
301
|
-
},
|
302
|
-
/* @__PURE__ */ React.createElement(
|
303
|
-
"input",
|
304
|
-
{
|
305
|
-
type: "hidden",
|
306
|
-
id: "dctoken",
|
307
|
-
defaultValue: dcToken,
|
308
|
-
name: "dctoken"
|
309
|
-
}
|
310
|
-
),
|
311
|
-
/* @__PURE__ */ React.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ React.createElement("div", { className: "amtleft" }, /* @__PURE__ */ React.createElement("label", { htmlFor: "Amount" }, "Payment amount"), /* @__PURE__ */ React.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ React.createElement("span", null, "$"), /* @__PURE__ */ React.createElement("span", null, " ", amount || 1, " "))), /* @__PURE__ */ React.createElement("div", { className: "card-row" }, /* @__PURE__ */ React.createElement("span", { className: "visa" }), /* @__PURE__ */ React.createElement("span", { className: "mastercard" }), /* @__PURE__ */ React.createElement("span", { className: "amex" }), /* @__PURE__ */ React.createElement("span", { className: "discover" }))),
|
312
|
-
/* @__PURE__ */ React.createElement("div", { className: "form-group" }, /* @__PURE__ */ React.createElement("label", { htmlFor: "NameOnCard" }, "Name on card"), /* @__PURE__ */ React.createElement(
|
313
|
-
"input",
|
314
|
-
{
|
315
|
-
"data-token": "name",
|
316
|
-
id: "NameOnCard",
|
317
|
-
className: "form-control required",
|
318
|
-
type: "text",
|
319
|
-
maxLength: 100,
|
320
|
-
placeholder: "name",
|
321
|
-
value: formData == null ? void 0 : formData.name,
|
322
|
-
onChange: handleChange
|
323
|
-
}
|
324
|
-
), /* @__PURE__ */ React.createElement(
|
325
|
-
"span",
|
326
|
-
{
|
327
|
-
id: "NameOnCard-error",
|
328
|
-
style: { color: "red" }
|
329
|
-
}
|
330
|
-
)),
|
331
|
-
/* @__PURE__ */ React.createElement("div", { className: "form-group" }, /* @__PURE__ */ React.createElement(
|
332
|
-
"input",
|
333
|
-
{
|
334
|
-
"data-token": "card_number",
|
335
|
-
className: "null card-image form-control required",
|
336
|
-
type: "text",
|
337
|
-
maxLength: 19,
|
338
|
-
placeholder: "0000 0000 0000 0000",
|
339
|
-
value: handleCardFormat(formData == null ? void 0 : formData.card_number),
|
340
|
-
onChange: handleChange
|
341
|
-
}
|
342
|
-
), error.card_number && /* @__PURE__ */ React.createElement(
|
343
|
-
"span",
|
344
|
-
{
|
345
|
-
id: "card_number-error",
|
346
|
-
style: { color: "red" }
|
347
|
-
},
|
348
|
-
error.card_number
|
349
|
-
)),
|
350
|
-
/* @__PURE__ */ React.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React.createElement(
|
351
|
-
"input",
|
352
|
-
{
|
353
|
-
"data-token": "exp_month",
|
354
|
-
className: "form-control required",
|
355
|
-
type: "text",
|
356
|
-
placeholder: "MM",
|
357
|
-
maxLength: 2,
|
358
|
-
value: formData == null ? void 0 : formData.exp_month,
|
359
|
-
onChange: handleChange
|
360
|
-
}
|
361
|
-
), error.exp_month && /* @__PURE__ */ React.createElement(
|
362
|
-
"span",
|
363
|
-
{
|
364
|
-
id: "exp_month-error",
|
365
|
-
style: { color: "red" }
|
366
|
-
},
|
367
|
-
error.exp_month
|
368
|
-
)),
|
369
|
-
/* @__PURE__ */ React.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React.createElement(
|
370
|
-
"input",
|
371
|
-
{
|
372
|
-
"data-token": "exp_year",
|
373
|
-
className: "form-control required",
|
374
|
-
type: "text",
|
375
|
-
placeholder: "YYYY",
|
376
|
-
maxLength: 4,
|
377
|
-
value: formData == null ? void 0 : formData.exp_year,
|
378
|
-
onChange: handleChange
|
379
|
-
}
|
380
|
-
), error.exp_year && /* @__PURE__ */ React.createElement(
|
381
|
-
"span",
|
382
|
-
{
|
383
|
-
id: "exp_year-error",
|
384
|
-
style: { color: "red" }
|
385
|
-
},
|
386
|
-
error.exp_year
|
387
|
-
)),
|
388
|
-
/* @__PURE__ */ React.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ React.createElement("div", { className: "input-container" }, /* @__PURE__ */ React.createElement(
|
389
|
-
"input",
|
390
|
-
{
|
391
|
-
"data-token": "cvv",
|
392
|
-
className: "form-control required",
|
393
|
-
type: "text",
|
394
|
-
maxLength: 4,
|
395
|
-
placeholder: "CVC",
|
396
|
-
value: formData == null ? void 0 : formData.cvv,
|
397
|
-
onChange: handleChange
|
398
|
-
}
|
399
|
-
), /* @__PURE__ */ React.createElement("i", { id: "cvc", className: "fa fa-question-circle" })), error.cvv && /* @__PURE__ */ React.createElement(
|
400
|
-
"span",
|
401
|
-
{
|
402
|
-
id: "cvv-error",
|
403
|
-
style: { color: "red" }
|
404
|
-
},
|
405
|
-
error.cvv
|
406
|
-
), /* @__PURE__ */ React.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ React.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ React.createElement("div", { className: "visa-mc-dis-cvc-preview" }))),
|
407
|
-
/* @__PURE__ */ React.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ React.createElement("label", { htmlFor: "ZIPCode" }, "Postal code"), /* @__PURE__ */ React.createElement("div", { className: "input-container" }, /* @__PURE__ */ React.createElement(
|
408
|
-
"input",
|
409
|
-
{
|
410
|
-
id: "ZIPCode",
|
411
|
-
"data-token": "zip",
|
412
|
-
className: "form-control required",
|
413
|
-
type: "text",
|
414
|
-
maxLength: 7,
|
415
|
-
placeholder: "000000",
|
416
|
-
value: formData == null ? void 0 : formData.zip,
|
417
|
-
onChange: handleChange
|
418
|
-
}
|
419
|
-
), /* @__PURE__ */ React.createElement(
|
420
|
-
"a",
|
421
|
-
{
|
422
|
-
tabIndex: 0,
|
423
|
-
role: "button",
|
424
|
-
"data-toggle": "popover",
|
425
|
-
"data-trigger": "focus",
|
426
|
-
"data-placement": "left",
|
427
|
-
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
428
|
-
},
|
429
|
-
/* @__PURE__ */ React.createElement("i", { className: "fa fa-question-circle" })
|
430
|
-
), /* @__PURE__ */ React.createElement(
|
431
|
-
"span",
|
432
|
-
{
|
433
|
-
id: "ZIPCode-error",
|
434
|
-
style: { color: "red", display: "none" }
|
435
|
-
},
|
436
|
-
"This field is required"
|
437
|
-
))),
|
438
|
-
/* @__PURE__ */ React.createElement(
|
439
|
-
"button",
|
440
|
-
{
|
441
|
-
id: "PayButton",
|
442
|
-
className: "btn btn-block btn-success submit-button",
|
443
|
-
type: "submit"
|
444
|
-
},
|
445
|
-
/* @__PURE__ */ React.createElement("span", { className: "submit-button-lock" }),
|
446
|
-
/* @__PURE__ */ React.createElement("span", { className: "align-middle" }, "Pay $", amount || 1)
|
447
|
-
)
|
448
|
-
), /* @__PURE__ */ React.createElement("div", { className: "powerd-by-part", style: {
|
449
|
-
display: "flex",
|
450
|
-
fontSize: "12px",
|
451
|
-
textAlign: "center",
|
452
|
-
alignItems: "center",
|
453
|
-
justifyContent: "center",
|
454
|
-
margin: "8px 0 20px 0"
|
455
|
-
} }, /* @__PURE__ */ React.createElement(
|
456
|
-
"svg",
|
457
|
-
{
|
458
|
-
xmlns: "http://www.w3.org/2000/svg",
|
459
|
-
width: 20,
|
460
|
-
height: 20,
|
461
|
-
viewBox: "0 0 26 26"
|
462
|
-
},
|
463
|
-
/* @__PURE__ */ React.createElement(
|
464
|
-
"path",
|
465
|
-
{
|
466
|
-
fill: "currentColor",
|
467
|
-
d: "M23.633 5.028a1.074 1.074 0 0 0-.777-.366c-2.295-.06-5.199-2.514-7.119-3.477C14.551.592 13.768.201 13.18.098a1.225 1.225 0 0 0-.36.001c-.588.103-1.371.494-2.556 1.087c-1.92.962-4.824 3.416-7.119 3.476a1.08 1.08 0 0 0-.778.366a1.167 1.167 0 0 0-.291.834c.493 10.023 4.088 16.226 10.396 19.831c.164.093.346.141.527.141s.363-.048.528-.141c6.308-3.605 9.902-9.808 10.396-19.831a1.161 1.161 0 0 0-.29-.834zM18.617 8.97l-5.323 7.855c-.191.282-.491.469-.788.469c-.298 0-.629-.163-.838-.372l-3.752-3.753a.656.656 0 0 1 0-.926l.927-.929a.658.658 0 0 1 .926 0l2.44 2.44l4.239-6.257a.657.657 0 0 1 .91-.173l1.085.736a.657.657 0 0 1 .174.91z"
|
468
|
-
}
|
469
|
-
)
|
470
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */ React.createElement(
|
471
|
-
"img",
|
472
|
-
{
|
473
|
-
src: "https://ui.fractalpay.com/favicon.ico",
|
474
|
-
alt: "Fractal logo",
|
475
|
-
className: "powered-logo",
|
476
|
-
style: {
|
477
|
-
width: "18px",
|
478
|
-
height: "18px",
|
479
|
-
float: "right",
|
480
|
-
padding: "2px",
|
481
|
-
background: "#000",
|
482
|
-
borderRadius: "4px",
|
483
|
-
marginLeft: "5px"
|
484
|
-
}
|
485
|
-
}
|
486
|
-
))))))))))))
|
487
|
-
));
|
488
|
-
}
|
489
|
-
export {
|
490
|
-
PaywithFractal
|
491
|
-
};
|
1
|
+
var _=Object.defineProperty,$=Object.defineProperties;var ee=Object.getOwnPropertyDescriptors;var w=Object.getOwnPropertySymbols;var ae=Object.prototype.hasOwnProperty,oe=Object.prototype.propertyIsEnumerable;var A=(c,n,s)=>n in c?_(c,n,{enumerable:!0,configurable:!0,writable:!0,value:s}):c[n]=s,l=(c,n)=>{for(var s in n||(n={}))ae.call(n,s)&&A(c,s,n[s]);if(w)for(var s of w(n))oe.call(n,s)&&A(c,s,n[s]);return c},d=(c,n)=>$(c,ee(n));import P from"axios";import e,{useEffect as re,useState as g}from"react";import{Button as ne,Modal as Z}from"react-bootstrap";import"bootstrap/dist/css/bootstrap.min.css";function ge({name:c,amount:n,orderId:s,fractalPayClientKey:E}){let M="http://192.168.1.52:8082/",C="http://192.168.1.52:8081/";console.log(c,"name",window==null?void 0:window.DatacapWebToken);let[X,N]=g(""),[m,r]=g({}),[f,Q]=g(!1),[i,k]=g({name:"John Doe",card_number:"4761 7310 0000 0043",exp_month:"12",exp_year:"2024",cvv:"201",zip:""}),[le,h]=g(!1),[v,q]=g(!1),G=async o=>{var t,y,U,V,K,T,J;o.preventDefault();let a={description:"widget payment",amount:n||"1.00",phone_number:"1234567908",zip:i.zip,orderId:s||"",fractalpayPublicKey:E};if(Object.keys(m).length<1)try{h(!0);let x=await P.post(`${M}create-widget-order`,a,{headers:{"Content-Type":"application/json"}});if(x.data&&((t=x.data)!=null&&t.result)){console.log("token",(y=x.data)==null?void 0:y.data),N((V=(U=x.data)==null?void 0:U.data)==null?void 0:V.dctoken);let B=async b=>{var W,S,F;if(console.log("response for token call back",b),b.Error)alert("if"),console.log("Error: ",b),h(!1);else{let L={"Content-Type":"application/x-www-form-urlencoded"},H=l({name:i.name,postal_code:i.zip},b);try{let p=await P.post(`${C}quick-pay/${(S=(W=x.data)==null?void 0:W.data)==null?void 0:S.posSalesIdEncode}`,H,{headers:L});h(!1),console.log("quick response",p),(F=p==null?void 0:p.data)!=null&&F.result&&(p==null?void 0:p.status)===200?(console.log("Payment success!",p==null?void 0:p.data),k({name:"John Doe",card_number:"4761 7310 0000 0043",exp_month:"12",exp_year:"2024",cvv:"201",zip:""})):console.log("Payment failed!",p==null?void 0:p.data)}catch(p){console.log("Error: ",p),h(!1)}}};window==null||window.DatacapWebToken.requestToken((T=(K=x.data)==null?void 0:K.data)==null?void 0:T.dctoken,"PaymentForm",B)}else h(!1),console.log("res",(J=x.data)==null?void 0:J.data)}catch(x){h(!1),console.log(x)}},Y=o=>{let t=(""+o).replace(/\D/g,"").match(/^(\d{4})(\d{4})(\d{4})(\d{4})$/);return t?`${t[1]} ${t[2]} ${t[3]} ${t[4]}`:o},j=o=>{r(a=>d(l({},a),{card_number:""})),o&&o.match(/[a-zA-Z]/)?r(a=>d(l({},a),{card_number:"Invalid input. Please enter only numbers."})):o.length>12&&!(window!=null&&window.DatacapWebToken.validateCardNumber(o==null?void 0:o.replaceAll(" ","")))?r(a=>d(l({},a),{card_number:"Invalid Card Number"})):o.length?r({}):r(a=>d(l({},a),{card_number:"Card Number required"}))},z=o=>{r(a=>d(l({},a),{exp_month:""})),/^\d{0,2}$/.test(o)&&(o===""||parseInt(o,10)>=1&&parseInt(o,10)<=12)?r({}):o.length?r(a=>d(l({},a),{exp_month:"Value should be between 1 and 12"})):r(a=>d(l({},a),{exp_month:"Month is required"}))},R=o=>{r(a=>d(l({},a),{exp_year:""})),window!=null&&window.DatacapWebToken.validateExpirationDate(i.exp_month,o)?r({}):o.length?r(a=>d(l({},a),{exp_year:"Invalid Expiration Date."})):r(a=>d(l({},a),{exp_year:"Year is required"}))},D=o=>{r(a=>d(l({},a),{cvv:""})),window!=null&&window.DatacapWebToken.validateCVV(o)?r({}):o.length?r(a=>d(l({},a),{cvv:"Invalid CVV."})):r(a=>d(l({},a),{cvv:"CVV is required"}))},u=o=>{let a=o.target.getAttribute("data-token")||"",t=o.target.value;k(y=>d(l({},y),{[a]:t})),a==="card_number"&&j(t),a==="exp_month"&&z(t),a==="exp_year"&&R(t),a==="cvv"&&D(t)};re(()=>{let o="my-script";if(!document.getElementById(o)){let t=document.createElement("script");t.src="https://token-cert.dcap.com/v1/client",t.id=o,t.async=!0,t.onload=()=>{typeof window!="undefined"&&window.DatacapWebToken?console.log("DatacapWebToken",window.DatacapWebToken):console.log("DatacapWebToken is not loaded yet.")},document.head.appendChild(t)}return()=>{let t=document.getElementById(o);t&&document.head.removeChild(t)}},[]);let I=()=>{q(!1)},O=()=>{console.log("open"),q(!0)};return console.log(v,"open"),e.createElement(e.Fragment,null,e.createElement("div",{style:{width:"100%",textAlign:"center"}},e.createElement(ne,{onClick:O},"Show")),e.createElement(Z,{show:v,onHide:I,backdrop:"static",keyboard:!1,size:"lg"},e.createElement(Z.Body,null,e.createElement("div",{className:"bg-black"},e.createElement("div",{className:"container bg-black"},e.createElement("div",{className:"row bg-light no-gutters"},e.createElement("div",{className:"col-sm-12"},e.createElement("div",{className:"bd-example bd-example-tabs right-tabs mttabs m-3 "},e.createElement("div",{className:"payment-popup"},e.createElement("button",{className:"close-pop",onClick:()=>{q(!1)}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:37,height:37,viewBox:"0 0 21 21"},e.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",d:"m7.5 7.5l6 6m0-6l-6 6"}))),e.createElement("div",{className:"row"},e.createElement("div",{className:"comp-name"},e.createElement("img",{src:"https://invoicestaging.skysystemz.com/assets/products/65c49a2740ff1.png",alt:"",className:"client-logo"})),e.createElement("div",{className:""},e.createElement("div",{id:"Checkout",className:"inline"},e.createElement("div",{className:"header"},e.createElement("h1",null,"Pay"),e.createElement("i",{className:"fa fa-qrcode fa-2x",id:"qrIcon",title:"Show QR Code",onClick:()=>Q(!f)})),e.createElement("div",{id:"qrCode",style:{display:f?"block":"none"}},e.createElement("img",{src:"data:image/png;base64,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",alt:"QRCode",srcSet:""})),e.createElement("form",{id:"PaymentForm",className:"payment-form",onSubmit:G},e.createElement("input",{type:"hidden",id:"dctoken",defaultValue:X,name:"dctoken"}),e.createElement("div",{className:"form-group top-amnt"},e.createElement("div",{className:"amtleft"},e.createElement("label",{htmlFor:"Amount"},"Payment amount"),e.createElement("div",{className:"amount-placeholder"},e.createElement("span",null,"$"),e.createElement("span",null," ",n||1," "))),e.createElement("div",{className:"card-row"},e.createElement("span",{className:"visa"}),e.createElement("span",{className:"mastercard"}),e.createElement("span",{className:"amex"}),e.createElement("span",{className:"discover"}))),e.createElement("div",{className:"form-group"},e.createElement("label",{htmlFor:"NameOnCard"},"Name on card"),e.createElement("input",{"data-token":"name",id:"NameOnCard",className:"form-control required",type:"text",maxLength:100,placeholder:"name",value:i==null?void 0:i.name,onChange:u}),e.createElement("span",{id:"NameOnCard-error",style:{color:"red"}})),e.createElement("div",{className:"form-group"},e.createElement("input",{"data-token":"card_number",className:"null card-image form-control required",type:"text",maxLength:19,placeholder:"0000 0000 0000 0000",value:Y(i==null?void 0:i.card_number),onChange:u}),m.card_number&&e.createElement("span",{id:"card_number-error",style:{color:"red"}},m.card_number)),e.createElement("div",{className:"expiry-date-group form-group"},e.createElement("input",{"data-token":"exp_month",className:"form-control required",type:"text",placeholder:"MM",maxLength:2,value:i==null?void 0:i.exp_month,onChange:u}),m.exp_month&&e.createElement("span",{id:"exp_month-error",style:{color:"red"}},m.exp_month)),e.createElement("div",{className:"expiry-date-group form-group"},e.createElement("input",{"data-token":"exp_year",className:"form-control required",type:"text",placeholder:"YYYY",maxLength:4,value:i==null?void 0:i.exp_year,onChange:u}),m.exp_year&&e.createElement("span",{id:"exp_year-error",style:{color:"red"}},m.exp_year)),e.createElement("div",{className:"security-code-group form-group"},e.createElement("div",{className:"input-container"},e.createElement("input",{"data-token":"cvv",className:"form-control required",type:"text",maxLength:4,placeholder:"CVC",value:i==null?void 0:i.cvv,onChange:u}),e.createElement("i",{id:"cvc",className:"fa fa-question-circle"})),m.cvv&&e.createElement("span",{id:"cvv-error",style:{color:"red"}},m.cvv),e.createElement("div",{className:"cvc-preview-container two-card hide"},e.createElement("div",{className:"amex-cvc-preview"}),e.createElement("div",{className:"visa-mc-dis-cvc-preview"}))),e.createElement("div",{className:"zip-code-group form-group"},e.createElement("label",{htmlFor:"ZIPCode"},"Postal code"),e.createElement("div",{className:"input-container"},e.createElement("input",{id:"ZIPCode","data-token":"zip",className:"form-control required",type:"text",maxLength:7,placeholder:"000000",value:i==null?void 0:i.zip,onChange:u}),e.createElement("a",{tabIndex:0,role:"button","data-toggle":"popover","data-trigger":"focus","data-placement":"left","data-content":"Enter the ZIP/Postal code for your credit card billing address."},e.createElement("i",{className:"fa fa-question-circle"})),e.createElement("span",{id:"ZIPCode-error",style:{color:"red",display:"none"}},"This field is required"))),e.createElement("button",{id:"PayButton",className:"btn btn-block btn-success submit-button",type:"submit"},e.createElement("span",{className:"submit-button-lock"}),e.createElement("span",{className:"align-middle"},"Pay $",n||1))),e.createElement("div",{className:"powerd-by-part",style:{display:"flex",fontSize:"12px",textAlign:"center",alignItems:"center",justifyContent:"center",margin:"8px 0 20px 0"}},e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:20,height:20,viewBox:"0 0 26 26"},e.createElement("path",{fill:"currentColor",d:"M23.633 5.028a1.074 1.074 0 0 0-.777-.366c-2.295-.06-5.199-2.514-7.119-3.477C14.551.592 13.768.201 13.18.098a1.225 1.225 0 0 0-.36.001c-.588.103-1.371.494-2.556 1.087c-1.92.962-4.824 3.416-7.119 3.476a1.08 1.08 0 0 0-.778.366a1.167 1.167 0 0 0-.291.834c.493 10.023 4.088 16.226 10.396 19.831c.164.093.346.141.527.141s.363-.048.528-.141c6.308-3.605 9.902-9.808 10.396-19.831a1.161 1.161 0 0 0-.29-.834zM18.617 8.97l-5.323 7.855c-.191.282-.491.469-.788.469c-.298 0-.629-.163-.838-.372l-3.752-3.753a.656.656 0 0 1 0-.926l.927-.929a.658.658 0 0 1 .926 0l2.44 2.44l4.239-6.257a.657.657 0 0 1 .91-.173l1.085.736a.657.657 0 0 1 .174.91z"})),"Secure payments powered by Fractal",e.createElement("img",{src:"https://ui.fractalpay.com/favicon.ico",alt:"Fractal logo",className:"powered-logo",style:{width:"18px",height:"18px",float:"right",padding:"2px",background:"#000",borderRadius:"4px",marginLeft:"5px"}}))))))))))))))}export{ge as PaywithFractal};
|