@pinerohit11/testwidget 0.1.33 → 0.1.35

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.js CHANGED
@@ -1,1187 +1,15 @@
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));
1
+ // src/app/components/RequestPayment/RequestPayment.tsx
2
+ import { useState } from "react";
3
+ import axios from "axios";
20
4
 
21
- // src/app/index.ts
22
- import "bootstrap/dist/css/bootstrap.min.css";
5
+ // src/app/components/Loader/Loader.tsx
6
+ import React3 from "react";
23
7
 
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
- import "bootstrap/dist/css/bootstrap.min.css";
29
- function PaywithFractal({ name, amount, orderId, fractalPayClientKey }) {
30
- const baseUrl = "http://192.168.1.52:8082/";
31
- const masterBaseUrl = "http://192.168.1.52:8081/";
32
- console.log(name, "name", window == null ? void 0 : window.DatacapWebToken);
33
- const [dcToken, setDcToken] = useState("");
34
- const [error, setError] = useState({});
35
- const [toggleQr, setToggleQr] = useState(false);
36
- const [formData, setFormData] = useState({
37
- name: "John Doe",
38
- card_number: "4761 7310 0000 0043",
39
- exp_month: "12",
40
- exp_year: "2024",
41
- cvv: "201",
42
- zip: ""
43
- });
44
- const [loading, setLoading] = useState(false);
45
- const [show, setShow] = useState(false);
46
- const handleSubmit = async (e) => {
47
- var _a, _b, _c, _d, _e, _f, _g;
48
- e.preventDefault();
49
- const data = {
50
- description: "widget payment",
51
- amount: amount || "1.00",
52
- phone_number: "1234567908",
53
- zip: formData.zip,
54
- orderId: orderId || "",
55
- fractalpayPublicKey: fractalPayClientKey
56
- };
57
- if (Object.keys(error).length < 1) {
58
- try {
59
- setLoading(true);
60
- const res = await axios.post(`${baseUrl}create-widget-order`, data, {
61
- headers: {
62
- "Content-Type": "application/json"
63
- }
64
- });
65
- if (res.data && ((_a = res.data) == null ? void 0 : _a.result)) {
66
- console.log("token", (_b = res.data) == null ? void 0 : _b.data);
67
- setDcToken((_d = (_c = res.data) == null ? void 0 : _c.data) == null ? void 0 : _d.dctoken);
68
- const tokenCallback = async (response) => {
69
- var _a2, _b2, _c2;
70
- console.log("response for token call back", response);
71
- if (response.Error) {
72
- alert("if");
73
- console.log("Error: ", response);
74
- setLoading(false);
75
- } else {
76
- const headers = {
77
- "Content-Type": "application/x-www-form-urlencoded"
78
- };
79
- const quickData = __spreadValues({
80
- name: formData.name,
81
- postal_code: formData.zip
82
- }, response);
83
- try {
84
- const resp = await axios.post(`${masterBaseUrl}quick-pay/${(_b2 = (_a2 = res.data) == null ? void 0 : _a2.data) == null ? void 0 : _b2.posSalesIdEncode}`, quickData, {
85
- headers
86
- });
87
- setLoading(false);
88
- console.log("quick response", resp);
89
- if (((_c2 = resp == null ? void 0 : resp.data) == null ? void 0 : _c2.result) && (resp == null ? void 0 : resp.status) === 200) {
90
- console.log("Payment success!", resp == null ? void 0 : resp.data);
91
- setFormData({
92
- name: "John Doe",
93
- card_number: "4761 7310 0000 0043",
94
- exp_month: "12",
95
- exp_year: "2024",
96
- cvv: "201",
97
- zip: ""
98
- });
99
- } else {
100
- console.log("Payment failed!", resp == null ? void 0 : resp.data);
101
- }
102
- } catch (error2) {
103
- console.log("Error: ", error2);
104
- setLoading(false);
105
- }
106
- }
107
- };
108
- window == null ? void 0 : window.DatacapWebToken.requestToken((_f = (_e = res.data) == null ? void 0 : _e.data) == null ? void 0 : _f.dctoken, "PaymentForm", tokenCallback);
109
- } else {
110
- setLoading(false);
111
- console.log("res", (_g = res.data) == null ? void 0 : _g.data);
112
- }
113
- } catch (error2) {
114
- setLoading(false);
115
- console.log(error2);
116
- }
117
- }
118
- };
119
- const handleCardFormat = (numericValue) => {
120
- const cleaned = ("" + numericValue).replace(/\D/g, "");
121
- const match = cleaned.match(/^(\d{4})(\d{4})(\d{4})(\d{4})$/);
122
- if (match) {
123
- return `${match[1]} ${match[2]} ${match[3]} ${match[4]}`;
124
- }
125
- return numericValue;
126
- };
127
- const handleCardNumberChange = (value) => {
128
- setError((prev) => __spreadProps(__spreadValues({}, prev), { card_number: "" }));
129
- if (value && value.match(/[a-zA-Z]/)) {
130
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
131
- card_number: "Invalid input. Please enter only numbers."
132
- }));
133
- } else if (value.length > 12 && !(window == null ? void 0 : window.DatacapWebToken.validateCardNumber(value == null ? void 0 : value.replaceAll(" ", "")))) {
134
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
135
- card_number: "Invalid Card Number"
136
- }));
137
- } else if (!value.length) {
138
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
139
- card_number: "Card Number required"
140
- }));
141
- } else {
142
- setError({});
143
- }
144
- };
145
- const handleMonthChange = (value) => {
146
- setError((prev) => __spreadProps(__spreadValues({}, prev), { exp_month: "" }));
147
- if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 1 && parseInt(value, 10) <= 12)) {
148
- setError({});
149
- } else if (!value.length) {
150
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
151
- exp_month: "Month is required"
152
- }));
153
- } else {
154
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
155
- exp_month: "Value should be between 1 and 12"
156
- }));
157
- }
158
- };
159
- const handleYearChange = (value) => {
160
- setError((prev) => __spreadProps(__spreadValues({}, prev), { exp_year: "" }));
161
- if (window == null ? void 0 : window.DatacapWebToken.validateExpirationDate(formData.exp_month, value)) {
162
- setError({});
163
- } else if (!value.length) {
164
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
165
- exp_year: "Year is required"
166
- }));
167
- } else {
168
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
169
- exp_year: "Invalid Expiration Date."
170
- }));
171
- }
172
- };
173
- const handleCVVChange = (value) => {
174
- setError((prev) => __spreadProps(__spreadValues({}, prev), { cvv: "" }));
175
- if (window == null ? void 0 : window.DatacapWebToken.validateCVV(value)) {
176
- setError({});
177
- } else if (!value.length) {
178
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
179
- cvv: "CVV is required"
180
- }));
181
- } else {
182
- setError((prev) => __spreadProps(__spreadValues({}, prev), {
183
- cvv: "Invalid CVV."
184
- }));
185
- }
186
- };
187
- const handleChange = (e) => {
188
- const token = e.target.getAttribute("data-token") || "";
189
- const value = e.target.value;
190
- setFormData((prev) => __spreadProps(__spreadValues({}, prev), { [token]: value }));
191
- if (token === "card_number") {
192
- handleCardNumberChange(value);
193
- }
194
- if (token === "exp_month") {
195
- handleMonthChange(value);
196
- }
197
- if (token === "exp_year") {
198
- handleYearChange(value);
199
- }
200
- if (token === "cvv") {
201
- handleCVVChange(value);
202
- }
203
- };
204
- useEffect(() => {
205
- const scriptId = "my-script";
206
- const existingScript = document.getElementById(scriptId);
207
- if (!existingScript) {
208
- const script = document.createElement("script");
209
- script.src = "https://token-cert.dcap.com/v1/client";
210
- script.id = scriptId;
211
- script.async = true;
212
- script.onload = () => {
213
- if (typeof window !== "undefined" && window.DatacapWebToken) {
214
- console.log("DatacapWebToken", window.DatacapWebToken);
215
- } else {
216
- console.log("DatacapWebToken is not loaded yet.");
217
- }
218
- };
219
- document.head.appendChild(script);
220
- }
221
- return () => {
222
- const script = document.getElementById(scriptId);
223
- if (script) {
224
- document.head.removeChild(script);
225
- }
226
- };
227
- }, []);
228
- useEffect(() => {
229
- const link = document.createElement("link");
230
- link.rel = "stylesheet";
231
- link.href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css";
232
- document.head.appendChild(link);
233
- return () => {
234
- document.head.removeChild(link);
235
- };
236
- }, []);
237
- const handleClose = () => {
238
- setShow(false);
239
- };
240
- const handleOpen = () => {
241
- console.log("open");
242
- setShow(true);
243
- };
244
- console.log(show, "open");
245
- return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("style", null, `
246
-
8
+ // src/app/components/Loader/LoaderStyle.tsx
9
+ import React2 from "react";
10
+
11
+ // src/app/components/RequestPayment/RequestPayment.tsx
12
+ import { Button, Form, Modal } from "react-bootstrap";
247
13
 
248
- body {
249
- background: #d5d5d5;
250
- font-family: 'Poppins', sans-serif;
251
- }
252
-
253
- input::placeholder {
254
- font-weight: 500;
255
- opacity: 0.5;
256
- color: #35254D !important;
257
- }
258
-
259
- .bg-light {
260
- background: #d5d5d5 !important;
261
- height: 100vh;
262
- }
263
-
264
- .payment-popup {
265
- /* padding: 35px 40px; */
266
- padding: 0px;
267
- background: #fff;
268
- border-radius: 20px;
269
- position: relative;
270
- /* width: 400px; */
271
- margin: 0 auto;
272
- }
273
-
274
- @media(max-width:460px) {
275
- .payment-popup {
276
- padding: 35px 25px;
277
- width: 98%;
278
- }
279
- }
280
-
281
- .close-pop {
282
- position: absolute;
283
- right: 8px;
284
- top: 8px;
285
- border: 0;
286
- padding: 0;
287
- background: none !important;
288
- }
289
-
290
- .amex {
291
- /* background-image: url("./amex.svg"); */
292
- }
293
-
294
- .visa {
295
- /* background-image: url("./visa.svg"); */
296
- }
297
-
298
- .mastercard {
299
- /* background-image: url("./mastercard.svg"); */
300
- }
301
-
302
- .discover {
303
- /* background-image: url("./discover.svg"); */
304
- }
305
-
306
- .expiry-date-group {
307
- float: left;
308
- width: 30%
309
- }
310
-
311
- .expiry-date-group input {
312
- width: calc(100% + 1px);
313
- border-top-right-radius: 0;
314
- border-bottom-right-radius: 0;
315
- }
316
-
317
- .expiry-date-group input:focus {
318
- position: relative;
319
- z-index: 10;
320
- }
321
-
322
- .security-code-group {
323
- float: right;
324
- width: 40%;
325
- position: relative;
326
- }
327
-
328
- .security-code-group input {
329
- border-top-left-radius: 0;
330
- border-bottom-left-radius: 0;
331
- }
332
-
333
- .zip-code-group {
334
- clear: both;
335
- }
336
-
337
-
338
- #submitButton {
339
- outline: 0 !important;
340
- height: 46px;
341
- font-size: 16px;
342
- background-color: #161616 !important;
343
- border: none;
344
- display: block;
345
- width: 100%;
346
- border-radius: 180px;
347
- }
348
-
349
- #PayButton {
350
- outline: 0 !important;
351
- height: 46px;
352
- font-size: 16px;
353
- background-color: #161616 !important;
354
- border: none;
355
- display: block;
356
- width: 100%;
357
- border-radius: 180px;
358
- }
359
-
360
- #PayButton:hover {
361
- background-color: #61C699 !important;
362
- }
363
-
364
- #PayButton:active {
365
- background-color: #61C699 !important;
366
- }
367
-
368
- #PayButton:disabled {
369
- background: rgb(172, 44, 170) !important;
370
- color: #FFF !important;
371
- }
372
-
373
- .form-control {
374
- color: #35254D;
375
- }
376
-
377
- .container {
378
- margin-top: 10px;
379
- }
380
-
381
- #Checkout {
382
- z-index: 100001;
383
- width: 100%;
384
- height: 100%;
385
- min-height: 100%;
386
- background: 0 0 #ffffff;
387
- border-radius: 24px;
388
- border: 1px solid #E0DFE2;
389
- margin-left: auto;
390
- margin-right: auto;
391
- display: block;
392
- }
393
-
394
- #Checkout .header {
395
- display: flex;
396
- /* Enables Flexbox */
397
- justify-content: center;
398
- /* Centers content horizontally */
399
- align-items: center;
400
- /* Centers content vertically */
401
- text-align: center;
402
- padding: 8px;
403
- border-bottom: 1px solid #DEDEDE;
404
- margin: 0 10px 20px 10px;
405
- }
406
-
407
- #Checkout .header button {
408
- border: 0;
409
- background: none;
410
- padding: 0;
411
- }
412
-
413
- #Checkout h1 {
414
- margin: 0;
415
- flex: 1;
416
- padding: 10px;
417
- /* Allows the title to grow and fill the space for centering */
418
- font-size: 23px;
419
- font-weight: 500;
420
- color: #35254D;
421
- /* align-items: start; */
422
- display: flex;
423
- }
424
-
425
- #Checkout>form {
426
- margin: 0 25px 10px 25px;
427
- }
428
-
429
- label {
430
- color: rgba(53, 37, 77, 0.6);
431
- margin-bottom: 2px;
432
- text-transform: uppercase;
433
- font-family: "IBM Plex Mono", monospace;
434
- font-weight: 500;
435
- font-size: 12px;
436
- }
437
-
438
- .input-container {
439
- position: relative;
440
- }
441
-
442
- .input-container input {
443
- padding-right: 25px;
444
- }
445
-
446
- #zipcode {
447
- text-transform: capitalize !important;
448
- }
449
-
450
- #zipcode {
451
- width: 18px;
452
- position: absolute;
453
- right: 8px;
454
- top: 9px;
455
- }
456
-
457
- #zipcode .zip-tip {
458
- display: none;
459
- background-color: rgb(0, 0, 0, 0.4);
460
- padding: 5px 8px;
461
- border-radius: 6px;
462
- position: absolute;
463
- right: 26px;
464
- top: -9px;
465
- font-size: 12.5px;
466
- text-transform: capitalize !important;
467
- color: #fff;
468
- width: 240px;
469
- line-height: 16px;
470
- }
471
-
472
- #zipcode .zip-tip:before {
473
- width: 0;
474
- height: 0;
475
- border-top: 7px solid transparent;
476
- border-bottom: 7px solid transparent;
477
- border-left: 7px solid #000;
478
- opacity: 0.4;
479
- position: absolute;
480
- right: -7px;
481
- top: 50%;
482
- transform: translateY(-50%);
483
- content: '';
484
- }
485
-
486
-
487
-
488
- #zipcode:hover .zip-tip {
489
- display: block;
490
- }
491
-
492
-
493
- .input-container>i,
494
- a[role="button"] {
495
- color: #d3d3d3;
496
- width: 25px;
497
- height: 30px;
498
- line-height: 30px;
499
- font-size: 16px;
500
- position: absolute;
501
- top: 5px;
502
- right: 6px;
503
- cursor: pointer;
504
- text-align: center;
505
- }
506
-
507
- .input-container>i:hover,
508
- a[role="button"]:hover {
509
- color: #777;
510
- }
511
-
512
- .amount-placeholder {
513
- white-space: nowrap;
514
- font-size: 44px;
515
- /* height: 35px; */
516
- font-weight: 600;
517
- line-height: 40px;
518
- }
519
-
520
- .amount-placeholder>button {
521
- float: right;
522
- width: 60px;
523
- }
524
-
525
- .amount-placeholder>span {
526
- line-height: 34px;
527
- }
528
-
529
- .top-amnt {
530
- display: flex;
531
- margin-bottom: 10px;
532
- align-items: center;
533
- justify-content: space-between;
534
- }
535
-
536
- .amtleft {
537
- text-align: center;
538
- }
539
-
540
- .amtleft span {
541
- color: #35254D;
542
- margin: 0 -5px;
543
- }
544
-
545
- .card-row {
546
- text-align: right;
547
- margin: 8px 0 0 0;
548
- max-width: 85px;
549
- line-height: 20px;
550
- }
551
-
552
- .yer {
553
- border-radius: 0;
554
- }
555
-
556
- .card-row span {
557
- width: 33px;
558
- height: 21px;
559
- margin: 0 2px;
560
- background-repeat: no-repeat;
561
- display: inline-block;
562
- background-size: contain;
563
- }
564
-
565
- .card-image {
566
- background-repeat: no-repeat;
567
- padding-right: 50px;
568
- background-position: right 2px center;
569
- background-size: auto 90%
570
- }
571
-
572
- /* .cvc-preview-container {
573
- overflow: hidden;
574
- } */
575
-
576
- .cvc-preview-container {
577
- /* overflow: hidden; */
578
- position: absolute;
579
- z-index: 9999;
580
- right: -71px;
581
- top: -54px;
582
- width: 165px;
583
- border-radius: 5px;
584
- padding: 5px;
585
- background-color: rgb(0, 0, 0, 0.3);
586
- display: none;
587
- }
588
-
589
- .cvc-preview-container:before {
590
- position: absolute;
591
- left: 50%;
592
- transform: translate(-50%);
593
- bottom: -5px;
594
- width: 0;
595
- height: 0;
596
- border-left: 5px solid transparent;
597
- border-right: 5px solid transparent;
598
- border-top: 5px solid #000;
599
- opacity: 0.3;
600
- content: '';
601
- }
602
-
603
- .security-code-group #cvc:hover .cvc-preview-container {
604
- display: block;
605
- }
606
-
607
- .cvc-preview-container.two-card div {
608
- width: 50%;
609
- height: 45px;
610
- }
611
-
612
- .cvc-preview-container.two-card div.amex-cvc-preview {
613
- float: right;
614
- }
615
-
616
- .cvc-preview-container.two-card div.visa-mc-dis-cvc-preview {
617
- float: left;
618
- }
619
-
620
- /* .cvc-preview-container div {
621
- height: 160px;
622
- } */
623
-
624
- .amex-cvc-preview {
625
- background: url("data:image/png;base64,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") center center/contain no-repeat;
626
- }
627
-
628
- .visa-mc-dis-cvc-preview {
629
- background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOYAAACOCAMAAAASE4S+AAAAAXNSR0IArs4c6QAAAadQTFRFAAAAzbFj+NyAyLNg+N2DzbRk+96CzrVj+96AzrNj+92By7Rl+92AzbRl/eCDzrRl/t+DzrVl/t+CzbVm/t+C3MFt3MFv/N2B/N6CzrRm/uCDzrRm/uCC7M93/N6CAAAAAQEBAgIBBAQCBQUDBwcECQgFDAsGDg0HEA4IEQ8JFRMLFxUMIBwQIR0RJSETKyYWLikYLyoYMCsZMSsZNC4bNzEcOTIdQDkhQTkhQzsiRT0jRj4kSkEmTEMnWE4tWU8uWk8uXFEvXVIwXlMwX1QxaV02bWA4bmE5cWQ6eGo+eWs+fW5Afm9Bi3pHjHtIkH9KmIZOmYdPnIlQnYpRo5BUppJVqJRWqpZXq5dYrJdYrZhZuaNfvaZhvqdiwKljwapjxK1lybFnyrJoy7NozrVm1Ltq171u2L5v2b9s2b9t2sBt3cNy3zEx3zIx38Rz4MVz4cZ04kI552NI6GVJ6Mx36s5368957dF674xb79J78NN78dV78tV789Z99Nd99dh+9rZv9th+9tl+99l/+duA+sx5+sx6+t2B+92B/N6B/d+C/uCD////AikOogAAAB90Uk5TACQkJSU9PT4+Q0NERJqav7/AwNjY4uLi4u7u8/P6+u6knPAAAAJkSURBVHja7d3pTxNBGMfxQbwAW06Pcj0tntQT8b7v+0JFxaserQcuKlQUFbFUaqvjH+1uG0lMfEETie4z39+bJ/tik/1kjt3MbDLGBFkWbeu0CtPZFq03v7KwxSpO04KKcmm7VZ32xeW2VK70nUF7tlj1afJnH+tA6k3UBWbUrHKBudJ0u8DsNtaJwIQJEyZMmDBhwoQJEyZMmPPCFCcCEyZMmDBhwoQJEyZMmDBhwoQJEyZMmDBhwoQJ010m+5swYcKECRMmTJgwYcKECRMmTJgwYcIMFfPHP8/vz5PLjnpzzmg2F07mxIhXVUYmwsjMVan0nbkQMrOeN1aY+zAsjHleNoRMf1x+rWa6KfjjM4RMvxdWN63+4QaYMGHC/EvM6b0HgpI6tvtoyq9vz+4/clcf89sJ2eiXIZGEyJD9sEl6RAa1MVPbpczsk8vT52SHHZCDUxelXxtzW/x4wPx+6cxn+0A2208PX9pB2aONef7xk3JrBjkth4Jysnf9fX1T0Czzmqx+6pcvcel/pJd5RRLXg1p6d0vWvdHKHJCeG2XljLVb5aZS5r2E3A6uTiUu2Km1klLK3CXxZDK5xd6RNYd3St+MTuaryr94G6y92iuy77X+b9rSi/d8usOEyZIXC5gsR7O5MN9bRexvwoQJEyZMmDBhwoQJEyZMmDBhwoT5vzNLLihLJu8CM2+6XGB2meUuMFeYyEf9ysmIqcsUtSuLmQZjGp8pdxafNxtjamIZ1f12MhOrDQ6uXhRLD4/nVb4/S/nx4XRsSeUY8prGtOI0186eKl8Xae3QSOxojTSUgT8BEvkXyqDHONgAAAAASUVORK5CYII=") center center/contain no-repeat;
630
- }
631
-
632
- .submit-button-lock {
633
- height: 15px;
634
- margin-top: -2px;
635
- margin-right: 7px;
636
- vertical-align: middle;
637
- background: url("data:image/png;base64,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NQxdFfpzGC4sNKwm7Hm4VXh+eHcELWJFREPEu0iPyNLIR4uNFksWd0bJR8VF1UdNRXtFl0VLl1gsWbPkRoxajCCmPRYfGxV7JHZyqffS3UuH4+ziCuPuLjNclrPs2nK15anLz66QX8FZcSoeGx8d3xD/iRPCqeVMrvRfuXflBNeTu4f7kufGK+eN8V34ZfyRBJeEsoTRRJfEXYljSa5JFUnjAk9BteB1sl/ygeSplJCUoykzqdGpzWmEtPi000IlYYqwK10zPSe9L8M0ozBDuspp1e5VE6JA0ZFMKHNZZruYjv5M9UiMJJslg1kLs2qy3mdHZZ/KUcwR5vTkmuRuyx3J88n7fjVmNXd1Z752/ob8wTXuaw6thdauXNu5Tnddwbrh9b7rj20gbUjZ8MtGy41lG99uit7UUaBRsL5gaLPv5sZCuUJR4b0tzlsObMVsFWzt3WazrWrblyJe0fViy+KK4k8l3JLr31l9V/ndzPaE7b2l9qX7d+B2CHfc3em681iZYlle2dCu4F2t5czyovK3u1fsvlZhW3FgD2mPZI+0MqiyvUqvakfVp+qk6oEaj5rmvep7t+2d2sfb17/fbX/TAY0DxQc+HhQcvH/I91BrrUFtxWHc4azDz+ui6rq/Z39ff0TtSPGRz0eFR6XHwo911TvU1zeoN5Q2wo2SxrHjccdv/eD1Q3sTq+lQM6O5+AQ4ITnx4sf4H++eDDzZeYp9qukn/Z/2ttBailqh1tzWibakNml7THvf6YDTnR3OHS0/m/989Iz2mZqzymdLz5HOFZybOZ93fvJCxoXxi4kXhzpXdD66tOTSna6wrt7LgZevXvG5cqnbvfv8VZerZ645XTt9nX297Yb9jdYeu56WX+x+aem172296XCz/ZbjrY6+BX3n+l37L972un3ljv+dGwOLBvruLr57/17cPel93v3RB6kPXj/Mejj9aP1j7OOiJwpPKp6qP6391fjXZqm99Oyg12DPs4hnj4a4Qy//lfmvT8MFz6nPK0a0RupHrUfPjPmM3Xqx9MXwy4yX0+OFvyn+tveV0auffnf7vWdiycTwa9HrmT9K3qi+OfrW9m3nZOjk03dp76anit6rvj/2gf2h+2P0x5Hp7E/4T5WfjT93fAn88ngmbWbm3/eE8/syOll+AAAAYFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////98JRy6AAAAH3RSTlMAAgYMEyIzOUpTVFViY3N2gJmcnaipq7fX3ebx+Pn8eTEuDQAAAI9JREFUKM/N0UkOglAQRdFHDyK90n64+9+lAyQgookjuaNKTlJJpaQlO2n6sW8SW/uCjrku2EloWDLhi3gDa4O3pTtA5Tt+BXDbiDsBmSQpAyZ3pRhoLUmS1QLxSilQPOcCSFfKgfxgPgfZ9ch7Y21LCcdd5wVH5SckEzkXc0ylpPJnMpETmX/d9eUpH1/5AKrsQVrz7YPBAAAAAElFTkSuQmCC") center center/contain no-repeat;
638
- width: 14px;
639
- display: inline-block;
640
- }
641
-
642
- .align-middle {
643
- vertical-align: middle;
644
- }
645
-
646
- input {
647
- box-shadow: none !important;
648
- }
649
-
650
- .powerd-by-part {
651
- display: flex;
652
- font-size: 12px;
653
- text-align: center;
654
- align-items: center;
655
- justify-content: center;
656
- margin: 8px 0 20px 0;
657
- }
658
-
659
- .powered-logo {
660
- width: 18px;
661
- height: 18px;
662
- float: right;
663
- padding: 2px;
664
- background: #000000;
665
- border-radius: 4px;
666
- margin-left: 5px;
667
- }
668
-
669
- .comp-name {
670
- display: block;
671
- margin-bottom: 8px;
672
- }
673
-
674
- .client-logo {
675
- max-width: 140px;
676
- display: block;
677
- margin: auto;
678
- padding: 5px;
679
- }
680
-
681
- #qrCode {
682
- text-align: center;
683
- }
684
-
685
- #qrIcon {
686
- cursor: pointer;
687
- border: 1px solid rgb(252, 252, 252);
688
- padding: 10px;
689
- border-radius: 5px;
690
- background: #ffffff;
691
- }
692
-
693
- #target {
694
- display: none;
695
- text-align: center;
696
- transition: all 5s;
697
- padding: 5px;
698
- transition: max-height 0.5s, overflow 0.5s 0.5s;
699
- }
700
-
701
- /* input:focus {
702
- border-color: #acc6db !important;
703
- background-color: #acc6db !important;
704
- } */
705
-
706
-
707
-
708
-
709
-
710
-
711
-
712
- .payment-success {
713
- border-radius: 24px;
714
- padding: 160px 24px;
715
- text-align: center;
716
- background: linear-gradient(white, white) padding-box,
717
- linear-gradient(to bottom, #B0E2CC, #DBFCEE) border-box;
718
- border-radius: 24px;
719
- border: 1px solid transparent;
720
-
721
- }
722
-
723
- .payment-icon {
724
- width: 60px;
725
- height: 60px;
726
- border-radius: 180px;
727
- border: #61C699 1px solid;
728
- margin: 0 auto 15px auto;
729
- display: flex;
730
- align-items: center;
731
- justify-content: center;
732
- }
733
-
734
- .payment-success h2 {
735
- font-size: 24px;
736
- color: #35254D;
737
- line-height: 25px;
738
- }
739
-
740
- .payment-success p {
741
- font-size: 14px;
742
- color: #9A92A6;
743
- line-height: 15px;
744
- }
745
-
746
-
747
- .bg-light {
748
- background: #fff !important;
749
- }
750
-
751
- /* body {
752
- overflow: hidden !important;
753
- background: #fff !important;
754
- } */
755
-
756
- .app-pagination .page-item .page-link {
757
- color: #2e2f2f;
758
- }
759
-
760
- .app-pagination .page-item.active .page-link {
761
- background-color: #a9aeb3;
762
- border-color: #ddd;
763
- color: #2e2f2f;
764
- }
765
-
766
- .app-pagination .page-item.disabled .page-link {
767
- color: #2e2f2f;
768
- }
769
-
770
- .app-pagination .page-item .page-link:hover {
771
- text-decoration: none;
772
- color: #2e2f2f;
773
- }
774
-
775
- .loader {
776
- position: fixed;
777
- /* Fixed position to cover the viewport */
778
- top: 0;
779
- left: 0;
780
- width: 100%;
781
- height: 100%;
782
- display: flex;
783
- justify-content: center;
784
- align-items: center;
785
- /* background: rgba(255, 255, 0, 0.01); Adjust the blur effect */
786
- background-color: rgba(255, 255, 255, 0.521);
787
- /* Semi-transparent black background */
788
-
789
- backdrop-filter: blur(.5px);
790
- /* Blur effect */
791
- z-index: 9999;
792
- /* Ensure it's on top of other elements */
793
- }
794
-
795
- .lds-ellipsis {
796
- display: inline-block;
797
- position: relative;
798
- width: 80px;
799
- height: 80px;
800
- }
801
-
802
- .lds-ellipsis div {
803
- position: absolute;
804
- top: 33px;
805
- width: 13px;
806
- height: 13px;
807
- border-radius: 50%;
808
- background: #000;
809
- animation-timing-function: cubic-bezier(0, 1, 1, 0);
810
- }
811
-
812
- .lds-ellipsis div:nth-child(1) {
813
- left: 8px;
814
- animation: lds-ellipsis1 0.6s infinite;
815
- }
816
-
817
- .lds-ellipsis div:nth-child(2) {
818
- left: 8px;
819
- animation: lds-ellipsis2 0.6s infinite;
820
- }
821
-
822
- .lds-ellipsis div:nth-child(3) {
823
- left: 32px;
824
- animation: lds-ellipsis2 0.6s infinite;
825
- }
826
-
827
- .lds-ellipsis div:nth-child(4) {
828
- left: 56px;
829
- animation: lds-ellipsis3 0.6s infinite;
830
- }
831
-
832
- @keyframes lds-ellipsis1 {
833
- 0% {
834
- transform: scale(0);
835
- }
836
-
837
- 100% {
838
- transform: scale(1);
839
- }
840
- }
841
-
842
- @keyframes lds-ellipsis2 {
843
- 0% {
844
- transform: translate(0, 0);
845
- }
846
-
847
- 100% {
848
- transform: translate(24px, 0);
849
- }
850
- }
851
-
852
- @keyframes lds-ellipsis3 {
853
- 0% {
854
- transform: scale(1);
855
- }
856
-
857
- 100% {
858
- transform: scale(0);
859
- }
860
- }
861
-
862
- .requestPayment {
863
- max-width: 420px;
864
- }
865
-
866
- .paymentBtn {
867
- background-color: black;
868
- border: none;
869
- color: white;
870
- padding: 15px 32px;
871
- text-align: center;
872
- text-decoration: none;
873
- display: inline-block;
874
- font-size: 16px;
875
- margin: 4px 2px;
876
- border-radius: 180px;
877
- }
878
-
879
- .PayButton {
880
- outline: 0 !important;
881
- height: 46px;
882
- background-color: #161616 !important;
883
- width: 100%;
884
- color: #fff;
885
- margin: 10px 0;
886
- }
887
-
888
-
889
-
890
-
891
-
892
- .requpay-main{
893
- max-width: 400px;
894
- width: 100%;
895
- height: auto;
896
- padding: 20px;
897
- border-radius: 20px !important;
898
- position: relative;
899
- margin: 30px auto;
900
- }
901
- .requpay-main h3{
902
- font-size: 20px;
903
- padding-left: 10px;
904
- }
905
- .requpay-in{
906
- width: 100%;
907
- background: 0 0 #ffffff;
908
- border-radius: 24px;
909
- border: 1px solid #e0dfe2;
910
- padding: 20px;
911
- }
912
-
913
- .requpay-in .mb-1{
914
- margin-bottom: 10px;
915
- }
916
-
917
- .requpay-in .pay-amount {
918
- position: relative;
919
- }
920
- .requpay-in .pay-amount input{padding-left: 20px;}
921
- .requpay-in .pay-amount .dlr-sign {
922
- position: absolute;
923
- left: 10px;
924
- top: 7px;
925
- }
926
- .requpay-in .PayButton {
927
- border-radius: 4px;
928
- border:0;
929
- height: 43px;
930
- }
931
- `), /* @__PURE__ */ React.createElement("div", { className: "w-100 text-center" }, /* @__PURE__ */ React.createElement(Button, { onClick: handleOpen }, "Show")), /* @__PURE__ */ React.createElement(
932
- Modal,
933
- {
934
- show,
935
- onHide: handleClose,
936
- backdrop: "static",
937
- keyboard: false,
938
- size: "lg"
939
- },
940
- /* @__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(
941
- "button",
942
- {
943
- className: "close-pop",
944
- onClick: () => {
945
- setShow(false);
946
- }
947
- },
948
- /* @__PURE__ */ React.createElement(
949
- "svg",
950
- {
951
- xmlns: "http://www.w3.org/2000/svg",
952
- width: 37,
953
- height: 37,
954
- viewBox: "0 0 21 21"
955
- },
956
- /* @__PURE__ */ React.createElement(
957
- "path",
958
- {
959
- fill: "none",
960
- stroke: "currentColor",
961
- strokeLinecap: "round",
962
- strokeLinejoin: "round",
963
- d: "m7.5 7.5l6 6m0-6l-6 6"
964
- }
965
- )
966
- )
967
- ), /* @__PURE__ */ React.createElement("div", { className: "row" }, /* @__PURE__ */ React.createElement("div", { className: "comp-name" }, /* @__PURE__ */ React.createElement(
968
- "img",
969
- {
970
- src: "https://invoicestaging.skysystemz.com/assets/products/65c49a2740ff1.png",
971
- alt: "",
972
- className: "client-logo"
973
- }
974
- )), /* @__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(
975
- "i",
976
- {
977
- className: "fa fa-qrcode fa-2x",
978
- id: "qrIcon",
979
- title: "Show QR Code",
980
- onClick: () => setToggleQr(!toggleQr)
981
- }
982
- )), /* @__PURE__ */ React.createElement("div", { id: "qrCode", style: {
983
- display: toggleQr ? "block" : "none"
984
- } }, /* @__PURE__ */ React.createElement(
985
- "img",
986
- {
987
- src: "data:image/png;base64,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",
988
- alt: "QRCode",
989
- srcSet: ""
990
- }
991
- )), /* @__PURE__ */ React.createElement(
992
- "form",
993
- {
994
- id: "PaymentForm",
995
- className: "payment-form",
996
- onSubmit: handleSubmit
997
- },
998
- /* @__PURE__ */ React.createElement(
999
- "input",
1000
- {
1001
- type: "hidden",
1002
- id: "dctoken",
1003
- defaultValue: dcToken,
1004
- name: "dctoken"
1005
- }
1006
- ),
1007
- /* @__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" }))),
1008
- /* @__PURE__ */ React.createElement("div", { className: "form-group" }, /* @__PURE__ */ React.createElement("label", { htmlFor: "NameOnCard" }, "Name on card"), /* @__PURE__ */ React.createElement(
1009
- "input",
1010
- {
1011
- "data-token": "name",
1012
- id: "NameOnCard",
1013
- className: "form-control required",
1014
- type: "text",
1015
- maxLength: 100,
1016
- placeholder: "name",
1017
- value: formData == null ? void 0 : formData.name,
1018
- onChange: handleChange
1019
- }
1020
- ), /* @__PURE__ */ React.createElement(
1021
- "span",
1022
- {
1023
- id: "NameOnCard-error",
1024
- style: { color: "red" }
1025
- }
1026
- )),
1027
- /* @__PURE__ */ React.createElement("div", { className: "form-group" }, /* @__PURE__ */ React.createElement(
1028
- "input",
1029
- {
1030
- "data-token": "card_number",
1031
- className: "null card-image form-control required",
1032
- type: "text",
1033
- maxLength: 19,
1034
- placeholder: "0000 0000 0000 0000",
1035
- value: handleCardFormat(formData == null ? void 0 : formData.card_number),
1036
- onChange: handleChange
1037
- }
1038
- ), error.card_number && /* @__PURE__ */ React.createElement(
1039
- "span",
1040
- {
1041
- id: "card_number-error",
1042
- style: { color: "red" }
1043
- },
1044
- error.card_number
1045
- )),
1046
- /* @__PURE__ */ React.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React.createElement(
1047
- "input",
1048
- {
1049
- "data-token": "exp_month",
1050
- className: "form-control required",
1051
- type: "text",
1052
- placeholder: "MM",
1053
- maxLength: 2,
1054
- value: formData == null ? void 0 : formData.exp_month,
1055
- onChange: handleChange
1056
- }
1057
- ), error.exp_month && /* @__PURE__ */ React.createElement(
1058
- "span",
1059
- {
1060
- id: "exp_month-error",
1061
- style: { color: "red" }
1062
- },
1063
- error.exp_month
1064
- )),
1065
- /* @__PURE__ */ React.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React.createElement(
1066
- "input",
1067
- {
1068
- "data-token": "exp_year",
1069
- className: "form-control required",
1070
- type: "text",
1071
- placeholder: "YYYY",
1072
- maxLength: 4,
1073
- value: formData == null ? void 0 : formData.exp_year,
1074
- onChange: handleChange
1075
- }
1076
- ), error.exp_year && /* @__PURE__ */ React.createElement(
1077
- "span",
1078
- {
1079
- id: "exp_year-error",
1080
- style: { color: "red" }
1081
- },
1082
- error.exp_year
1083
- )),
1084
- /* @__PURE__ */ React.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ React.createElement("div", { className: "input-container" }, /* @__PURE__ */ React.createElement(
1085
- "input",
1086
- {
1087
- "data-token": "cvv",
1088
- className: "form-control required",
1089
- type: "text",
1090
- maxLength: 4,
1091
- placeholder: "CVC",
1092
- value: formData == null ? void 0 : formData.cvv,
1093
- onChange: handleChange
1094
- }
1095
- ), /* @__PURE__ */ React.createElement("i", { id: "cvc", className: "fa fa-question-circle" })), error.cvv && /* @__PURE__ */ React.createElement(
1096
- "span",
1097
- {
1098
- id: "cvv-error",
1099
- style: { color: "red" }
1100
- },
1101
- error.cvv
1102
- ), /* @__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" }))),
1103
- /* @__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(
1104
- "input",
1105
- {
1106
- id: "ZIPCode",
1107
- "data-token": "zip",
1108
- className: "form-control required",
1109
- type: "text",
1110
- maxLength: 7,
1111
- placeholder: "000000",
1112
- value: formData == null ? void 0 : formData.zip,
1113
- onChange: handleChange
1114
- }
1115
- ), /* @__PURE__ */ React.createElement(
1116
- "a",
1117
- {
1118
- tabIndex: 0,
1119
- role: "button",
1120
- "data-toggle": "popover",
1121
- "data-trigger": "focus",
1122
- "data-placement": "left",
1123
- "data-content": "Enter the ZIP/Postal code for your credit card billing address."
1124
- },
1125
- /* @__PURE__ */ React.createElement("i", { className: "fa fa-question-circle" })
1126
- ), /* @__PURE__ */ React.createElement(
1127
- "span",
1128
- {
1129
- id: "ZIPCode-error",
1130
- style: { color: "red", display: "none" }
1131
- },
1132
- "This field is required"
1133
- ))),
1134
- /* @__PURE__ */ React.createElement(
1135
- "button",
1136
- {
1137
- id: "PayButton",
1138
- className: "btn btn-block btn-success submit-button",
1139
- type: "submit"
1140
- },
1141
- /* @__PURE__ */ React.createElement("span", { className: "submit-button-lock" }),
1142
- /* @__PURE__ */ React.createElement("span", { className: "align-middle" }, "Pay $", amount || 1)
1143
- )
1144
- ), /* @__PURE__ */ React.createElement("div", { className: "powerd-by-part", style: {
1145
- display: "flex",
1146
- fontSize: "12px",
1147
- textAlign: "center",
1148
- alignItems: "center",
1149
- justifyContent: "center",
1150
- margin: "8px 0 20px 0"
1151
- } }, /* @__PURE__ */ React.createElement(
1152
- "svg",
1153
- {
1154
- xmlns: "http://www.w3.org/2000/svg",
1155
- width: 20,
1156
- height: 20,
1157
- viewBox: "0 0 26 26"
1158
- },
1159
- /* @__PURE__ */ React.createElement(
1160
- "path",
1161
- {
1162
- fill: "currentColor",
1163
- 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"
1164
- }
1165
- )
1166
- ), "Secure payments powered by Fractal", /* @__PURE__ */ React.createElement(
1167
- "img",
1168
- {
1169
- src: "https://ui.fractalpay.com/favicon.ico",
1170
- alt: "Fractal logo",
1171
- className: "powered-logo",
1172
- style: {
1173
- width: "18px",
1174
- height: "18px",
1175
- float: "right",
1176
- padding: "2px",
1177
- background: "#000",
1178
- borderRadius: "4px",
1179
- marginLeft: "5px"
1180
- }
1181
- }
1182
- ))))))))))))
1183
- ));
1184
- }
1185
- export {
1186
- PaywithFractal
1187
- };
14
+ // src/app/components/RequestPayment/RequestPaymentstyles.tsx
15
+ import React4 from "react";