@pinerohit11/testwidget 0.1.56 → 0.1.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -18,6 +18,9 @@ var __spreadValues = (a, b) => {
18
18
  };
19
19
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
20
 
21
+ // src/app/index.ts
22
+ import "bootstrap/dist/js/bootstrap.bundle.min.js";
23
+
21
24
  // src/app/components/RequestPayment/RequestPayment.tsx
22
25
  import React4, { useState, useEffect } from "react";
23
26
 
@@ -26,7 +29,7 @@ import React2 from "react";
26
29
 
27
30
  // src/app/components/Loader/LoaderStyle.tsx
28
31
  import React from "react";
29
- var LoaderStyle = (props) => {
32
+ var LoaderStyle = () => {
30
33
  return /* @__PURE__ */ React.createElement("style", null, `
31
34
  .loader {
32
35
  position: fixed;
@@ -155,7 +158,7 @@ import { Button, Form, Modal } from "react-bootstrap";
155
158
 
156
159
  // src/app/components/RequestPayment/RequestPaymentstyles.tsx
157
160
  import React3 from "react";
158
- var RequestPaymentstyles = (props) => {
161
+ var RequestPaymentstyles = () => {
159
162
  return /* @__PURE__ */ React3.createElement("style", null, `
160
163
  .paymentBtn {
161
164
  background-color: black;
@@ -999,12 +1002,15 @@ var ErrorText = {
999
1002
  onlylettersallowed: "Only letters are allowed",
1000
1003
  phonenumberlength: "Phone number should be 10 digits",
1001
1004
  phonenumberrequired: "Please enter a phone number",
1002
- phonenumbervalid: "Please enter a valid 10-digit phone number",
1005
+ // phonenumbervalid:'Please enter a valid 10-digit phone number',
1006
+ phonenumbervalid: "Please enter a valid phone number (max 10 digits)",
1007
+ phonenumbervalidnumberonly: "Please enter a valid phone number (numbers only)",
1003
1008
  orderidenter: "Please enter an order ID",
1004
1009
  networkresponseerror: "Network response was not ok",
1005
1010
  anerroroccured: "An error occurred. Please try again.",
1006
1011
  montherror: "Please write month only 1 to 12",
1007
- fieldrequired: "This field is required"
1012
+ fieldrequired: "This field is required",
1013
+ fractalpayclientidrequired: "Fractalpay client key is missing or empty."
1008
1014
  };
1009
1015
 
1010
1016
  // src/app/components/RequestPayment/RequestPayment.tsx
@@ -1023,7 +1029,6 @@ function RequestPayment(props) {
1023
1029
  });
1024
1030
  const [showConfirmationModal, setShowConfirmationModal] = useState(false);
1025
1031
  const phoneNumberRegex = (value) => /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/.test(value);
1026
- const amoutRegex = /[+-]?([0-9]*[.])?[0-9]+/;
1027
1032
  const positiveAmountRegex = /^[+]?\d+(\.\d+)?$/;
1028
1033
  const isValidEmail = (value) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
1029
1034
  const isAlpha = (value) => /^[A-Za-z\s]*$/.test(value);
@@ -1045,7 +1050,7 @@ function RequestPayment(props) {
1045
1050
  });
1046
1051
  };
1047
1052
  const handleSubmit = (event) => {
1048
- let message = {
1053
+ const message = {
1049
1054
  type: "preview.compiledcheck",
1050
1055
  other: __spreadProps(__spreadValues({}, event), { status: true })
1051
1056
  };
@@ -1098,7 +1103,6 @@ function RequestPayment(props) {
1098
1103
  setLoading(false);
1099
1104
  }
1100
1105
  };
1101
- const validateAmount = (amount) => amoutRegex.test(amount);
1102
1106
  const PositiveAmount = (amount) => positiveAmountRegex.test(amount);
1103
1107
  const handleChange = (e) => {
1104
1108
  const { value } = e.target;
@@ -1153,7 +1157,7 @@ function RequestPayment(props) {
1153
1157
  }
1154
1158
  };
1155
1159
  const validateForm = () => {
1156
- let newErrors = {};
1160
+ const newErrors = {};
1157
1161
  if (!requestDetails.name) newErrors.name = ErrorText.namerequired;
1158
1162
  if (!requestDetails.amount) newErrors.amount = ErrorText.amountrequired;
1159
1163
  if (!requestDetails.phone_number && !(requestDetails == null ? void 0 : requestDetails.email)) newErrors.phone_number = ErrorText.phoneoremailrequired;
@@ -1336,7 +1340,6 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
1336
1340
  const [errorMessageorderid, setErrorMessageorderid] = useState2("");
1337
1341
  const [submitClicked, setSubmitClicked] = useState2(false);
1338
1342
  const handleClose = () => setShow(false);
1339
- const handleShow = () => setShow(true);
1340
1343
  const sendRequestPayment = () => {
1341
1344
  if (!phoneNumber) {
1342
1345
  setErrorMessagephone(ErrorText.phonenumberrequired);
@@ -1368,7 +1371,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
1368
1371
  setErrorMessageorderid("");
1369
1372
  setSubmitClicked(true);
1370
1373
  setIsLoading(true);
1371
- let formData = {
1374
+ const formData = {
1372
1375
  fractalpayPublicKey: fractalpayClientKey,
1373
1376
  amount,
1374
1377
  phone_number: phoneNumber,
@@ -1539,7 +1542,6 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
1539
1542
  const [isLoading, setIsLoading] = useState3(false);
1540
1543
  const [show, setShow] = useState3(false);
1541
1544
  const handleClose = () => setShow(false);
1542
- const handleShow = () => setShow(true);
1543
1545
  const sendRequestPayment = () => {
1544
1546
  setIsLoading(true);
1545
1547
  const formData = {
@@ -1614,11 +1616,10 @@ function RequestPaymentonClick(props) {
1614
1616
  const [isLoading, setIsLoading] = useState4(false);
1615
1617
  const [show, setShow] = useState4(false);
1616
1618
  const handleClose = () => setShow(false);
1617
- const handleShow = () => setShow(true);
1618
1619
  const { fractalpayClientKey, amount, phone_number, orderID, onSuccess, onError } = props;
1619
1620
  const sendRequestPayment = () => {
1620
1621
  setIsLoading(true);
1621
- let formData = {
1622
+ const formData = {
1622
1623
  fractalpayPublicKey: fractalpayClientKey,
1623
1624
  amount,
1624
1625
  phone_number,
@@ -1706,7 +1707,6 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
1706
1707
  const [errorMessage, setErrorMessage] = useState5("");
1707
1708
  const [submitClicked, setSubmitClicked] = useState5(false);
1708
1709
  const handleClose = () => setShow(false);
1709
- const handleShow = () => setShow(true);
1710
1710
  const sendRequestPayment = () => {
1711
1711
  if (!phoneNumber) {
1712
1712
  setErrorMessage(ErrorText.phonenumberrequired);
@@ -1721,7 +1721,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
1721
1721
  setErrorMessage("");
1722
1722
  setSubmitClicked(true);
1723
1723
  setIsLoading(true);
1724
- let formData = {
1724
+ const formData = {
1725
1725
  fractalpayPublicKey: fractalpayClientKey,
1726
1726
  amount,
1727
1727
  phone_number: phoneNumber,
@@ -2772,7 +2772,7 @@ function Payment() {
2772
2772
  });
2773
2773
  const [isValid, setIsValid] = useState6(false);
2774
2774
  const [isValidMonth, setIsValidMonth] = useState6(false);
2775
- const [data, setData] = useState6(null);
2775
+ console.log(isValid);
2776
2776
  const handlePaymentClick = async () => {
2777
2777
  try {
2778
2778
  const response = await fetch(`${baseUrl}generate-session`, {
@@ -2785,14 +2785,14 @@ function Payment() {
2785
2785
  if (!response.ok) {
2786
2786
  throw new Error("Network response was not ok");
2787
2787
  }
2788
- const data2 = await response.json();
2789
- if (data2 && data2.result === true) {
2788
+ const data = await response.json();
2789
+ if (data && data.result === true) {
2790
2790
  setState((prev) => {
2791
2791
  var _a2, _b;
2792
2792
  return __spreadProps(__spreadValues({}, prev), {
2793
2793
  show: true,
2794
- publicKey: (_a2 = data2 == null ? void 0 : data2.data) == null ? void 0 : _a2.publicKeyPem,
2795
- sessionKey: (_b = data2 == null ? void 0 : data2.data) == null ? void 0 : _b.session_key
2794
+ publicKey: (_a2 = data == null ? void 0 : data.data) == null ? void 0 : _a2.publicKeyPem,
2795
+ sessionKey: (_b = data == null ? void 0 : data.data) == null ? void 0 : _b.session_key
2796
2796
  });
2797
2797
  });
2798
2798
  }
@@ -2862,7 +2862,7 @@ function Payment() {
2862
2862
  };
2863
2863
  const handleMonthChange = (e) => {
2864
2864
  setIsValid(false);
2865
- let value = e.target.value;
2865
+ const value = e.target.value;
2866
2866
  if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 1 && parseInt(value, 10) <= 12)) {
2867
2867
  setState((prev) => __spreadProps(__spreadValues({}, prev), {
2868
2868
  month: value
@@ -2875,7 +2875,7 @@ function Payment() {
2875
2875
  const handleYearChange = (e) => {
2876
2876
  setIsValid(false);
2877
2877
  setIsValidMonth(false);
2878
- let value = e.target.value;
2878
+ const value = e.target.value;
2879
2879
  if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 0 && parseInt(value, 10) <= 99)) {
2880
2880
  setState((prev) => __spreadProps(__spreadValues({}, prev), {
2881
2881
  year: value
@@ -2885,7 +2885,7 @@ function Payment() {
2885
2885
  const handleCVVChange = (e) => {
2886
2886
  setIsValid(false);
2887
2887
  setIsValidMonth(false);
2888
- let value = e.target.value;
2888
+ const value = e.target.value;
2889
2889
  if (/^\d{0,4}$/.test(value)) {
2890
2890
  setState((prev) => __spreadProps(__spreadValues({}, prev), {
2891
2891
  cvv: value
@@ -2895,7 +2895,7 @@ function Payment() {
2895
2895
  const handleZIP = (e) => {
2896
2896
  setIsValid(false);
2897
2897
  setIsValidMonth(false);
2898
- let value = e.target.value;
2898
+ const value = e.target.value;
2899
2899
  if (/^\d{0,7}$/.test(value)) {
2900
2900
  setState((prev) => __spreadProps(__spreadValues({}, prev), {
2901
2901
  zip: value
@@ -2909,7 +2909,8 @@ function Payment() {
2909
2909
  value = value.replace(/[^0-9.]/g, "");
2910
2910
  let parts = value.split(".");
2911
2911
  if (parts.length > 2) {
2912
- parts = [parts.shift(), parts.join(".")];
2912
+ const p1 = parts.shift();
2913
+ parts = [p1, parts.join(".")];
2913
2914
  value = parts.join("");
2914
2915
  }
2915
2916
  if (parts.length === 2 && parts[1].length > 2) {
@@ -2927,15 +2928,6 @@ function Payment() {
2927
2928
  }));
2928
2929
  }
2929
2930
  };
2930
- function amountFormat(amt) {
2931
- if (amt) {
2932
- return `${parseFloat(amt).toLocaleString("en-US", {
2933
- minimumFractionDigits: 2,
2934
- maximumFractionDigits: 2
2935
- })}`;
2936
- }
2937
- return "";
2938
- }
2939
2931
  return /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(Paymentstyles, null), /* @__PURE__ */ React10.createElement("div", { className: "" }, /* @__PURE__ */ React10.createElement(
2940
2932
  "button",
2941
2933
  {
@@ -3382,7 +3374,6 @@ function CompletedTransactions(props) {
3382
3374
  selectsEnd: true,
3383
3375
  startDate,
3384
3376
  endDate,
3385
- minDate: startDate,
3386
3377
  placeholderText: "End Date"
3387
3378
  }
3388
3379
  )), /* @__PURE__ */ React12.createElement("button", { className: "export-btn1", onClick: handleExport }, "Export")), /* @__PURE__ */ React12.createElement(
@@ -3403,420 +3394,22 @@ function CompletedTransactions(props) {
3403
3394
  ))));
3404
3395
  }
3405
3396
 
3406
- // src/app/components/Payment/TockenizPay.tsx
3407
- import React13, { useState as useState9 } from "react";
3408
- import { Modal as Modal7 } from "react-bootstrap";
3409
- import { toast as toast5, ToastContainer as ToastContainer3 } from "react-toastify";
3410
- import forge2 from "node-forge";
3411
- import creditCardType from "credit-card-type";
3412
- function TockenizPay() {
3413
- const [state, setState] = useState9({
3414
- show: false,
3415
- publicKey: "",
3416
- sessionKey: "",
3417
- cardNumber: "",
3418
- year: "",
3419
- month: "",
3420
- cvv: "",
3421
- zip: "",
3422
- amount: ""
3423
- });
3424
- const [cardTypeDetail, setCardTypeDetail] = useState9(null);
3425
- const [isValid, setIsValid] = useState9(false);
3426
- const [isValidMonth, setIsValidMonth] = useState9(false);
3427
- const [data, setData] = useState9(null);
3428
- const handlePaymentClick = async () => {
3429
- try {
3430
- const response = await fetch(`${baseUrl}/generate-session`, {
3431
- method: "POST",
3432
- headers: {
3433
- "Content-Type": "application/json"
3434
- },
3435
- body: JSON.stringify({})
3436
- });
3437
- if (!response.ok) {
3438
- throw new Error("Network response was not ok");
3439
- }
3440
- const data2 = await response.json();
3441
- if (data2 && data2.result === true) {
3442
- setState((prev) => {
3443
- var _a, _b;
3444
- return __spreadProps(__spreadValues({}, prev), {
3445
- show: true,
3446
- publicKey: (_a = data2 == null ? void 0 : data2.data) == null ? void 0 : _a.publicKeyPem,
3447
- sessionKey: (_b = data2 == null ? void 0 : data2.data) == null ? void 0 : _b.session_key
3448
- });
3449
- });
3450
- }
3451
- } catch (error) {
3452
- console.log(error);
3453
- }
3454
- };
3455
- const handleSubmitPay = async () => {
3456
- var _a, _b, _c;
3457
- let track2_data = `${(_a = state == null ? void 0 : state.cardNumber) == null ? void 0 : _a.replaceAll(" ", "")}=${state.year}${((_b = state == null ? void 0 : state.month) == null ? void 0 : _b.length) > 1 ? state == null ? void 0 : state.month : "0" + (state == null ? void 0 : state.month)} ${state.cvv}`;
3458
- const publicKey = forge2.pki.publicKeyFromPem(state.publicKey);
3459
- const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
3460
- md: forge2.md.sha1.create(),
3461
- mgf1: {
3462
- md: forge2.md.sha1.create()
3463
- }
3464
- });
3465
- const encryptedBase64 = forge2.util.encode64(encrypted);
3466
- console.log(encryptedBase64);
3467
- const requestBody = {
3468
- enc_track2_data: encryptedBase64,
3469
- session_key: state.sessionKey,
3470
- algorithm: "RSAES_OAEP_SHA_1"
3471
- };
3472
- try {
3473
- const response = await fetch(
3474
- "https://m1ao5pku8b.execute-api.us-east-2.amazonaws.com/prod/tokenizer/tokenize",
3475
- {
3476
- method: "POST",
3477
- headers: {
3478
- "x-app-session-key": state == null ? void 0 : state.sessionKey,
3479
- "Content-Type": "application/json"
3480
- },
3481
- body: JSON.stringify(requestBody)
3482
- }
3483
- );
3484
- if (!response.ok) {
3485
- const errorData = await response.json();
3486
- throw new Error(((_c = errorData == null ? void 0 : errorData.data) == null ? void 0 : _c.message) || "Request failed");
3487
- }
3488
- const responseData = await response.json();
3489
- toast5.success("Payment Successful");
3490
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3491
- show: false,
3492
- publicKey: "",
3493
- sessionKey: "",
3494
- cardNumber: "",
3495
- year: "",
3496
- month: "",
3497
- cvv: "",
3498
- zip: "",
3499
- amount: ""
3500
- }));
3501
- console.log("response", responseData);
3502
- } catch (error) {
3503
- toast5.error((error == null ? void 0 : error.message) || "An error occurred");
3504
- console.error("Error:", error);
3505
- }
3506
- };
3507
- const formatCreditCardNumber = (cardNumber, cardType) => {
3508
- const cleanNumber = cardNumber.replace(/\D+/g, "");
3509
- let formattedValue;
3510
- switch (cardType) {
3511
- case "visa":
3512
- case "mastercard":
3513
- case "Discover":
3514
- case "JCB":
3515
- formattedValue = cleanNumber.replace(/(.{4})/g, "$1 ").trim();
3516
- break;
3517
- case "american-express":
3518
- formattedValue = cleanNumber.replace(/(\d{4})(\d{6})(\d{5})/, "$1 $2 $3");
3519
- break;
3520
- case "diners-club":
3521
- formattedValue = cleanNumber.replace(/(\d{4})(\d{6})(\d{4})/, "$1 $2 $3");
3522
- break;
3523
- case "maestro":
3524
- formattedValue = cleanNumber.length <= 19 ? cleanNumber.replace(/(.{4})/g, "$1 ").trim() : cleanNumber;
3525
- break;
3526
- default:
3527
- formattedValue = cleanNumber;
3528
- }
3529
- return formattedValue;
3530
- };
3531
- const handleCardNumberChange = (e) => {
3532
- e.preventDefault();
3533
- e.stopPropagation();
3534
- const { value } = e.target;
3535
- let cardtyp = creditCardType(value)[0];
3536
- const formattedValue = formatCreditCardNumber(value, cardtyp == null ? void 0 : cardtyp.type);
3537
- setCardTypeDetail(creditCardType(value)[0]);
3538
- console.log(formattedValue);
3539
- if (value.match(/[a-zA-Z]/)) {
3540
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3541
- cardNumber: formattedValue,
3542
- error: "Invalid input. Please enter only numbers."
3543
- }));
3544
- } else {
3545
- handleCardNumLength("");
3546
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3547
- cardNumber: formattedValue,
3548
- error: null
3549
- }));
3550
- }
3551
- };
3552
- function handleCardNumLength(cardType) {
3553
- const cardLengths = {
3554
- "Visa": 16,
3555
- "MasterCard": 16,
3556
- "AmericanExpress": 15,
3557
- "Discover": 16,
3558
- "DinersClub": 14,
3559
- "JCB": 16
3560
- };
3561
- return cardLengths[cardType] || "Unknown card type";
3562
- }
3563
- const handleMonthChange = (e) => {
3564
- setIsValid(false);
3565
- let value = e.target.value;
3566
- if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 1 && parseInt(value, 10) <= 12)) {
3567
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3568
- month: value
3569
- }));
3570
- setIsValidMonth(false);
3571
- } else {
3572
- setIsValidMonth(true);
3573
- }
3574
- };
3575
- const handleYearChange = (e) => {
3576
- setIsValid(false);
3577
- setIsValidMonth(false);
3578
- let value = e.target.value;
3579
- if (/^\d{0,2}$/.test(value) && (value === "" || parseInt(value, 10) >= 0 && parseInt(value, 10) <= 99)) {
3580
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3581
- year: value
3582
- }));
3583
- }
3584
- };
3585
- const handleCVVChange = (e) => {
3586
- setIsValid(false);
3587
- setIsValidMonth(false);
3588
- let value = e.target.value;
3589
- if (/^\d{0,4}$/.test(value)) {
3590
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3591
- cvv: value
3592
- }));
3593
- }
3594
- };
3595
- const handleZIP = (e) => {
3596
- setIsValid(false);
3597
- setIsValidMonth(false);
3598
- let value = e.target.value;
3599
- if (/^\d{0,7}$/.test(value)) {
3600
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3601
- zip: value
3602
- }));
3603
- }
3604
- };
3605
- const handleAmount = (e) => {
3606
- setIsValid(false);
3607
- setIsValidMonth(false);
3608
- let value = e.target.value;
3609
- value = value.replace(/[^0-9.]/g, "");
3610
- let parts = value.split(".");
3611
- if (parts.length > 2) {
3612
- parts = [parts.shift(), parts.join(".")];
3613
- value = parts.join("");
3614
- }
3615
- if (parts.length === 2 && parts[1].length > 2) {
3616
- value = `${parts[0]}.${parts[1].slice(0, 2)}`;
3617
- }
3618
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3619
- amount: value
3620
- }));
3621
- };
3622
- const handleAmountBlur = () => {
3623
- const value = state.amount;
3624
- if (value && !value.includes(".")) {
3625
- setState((prev) => __spreadProps(__spreadValues({}, prev), {
3626
- amount: `${value}.00`
3627
- }));
3628
- }
3629
- };
3630
- function amountFormat(amt) {
3631
- if (amt) {
3632
- return `${parseFloat(amt).toLocaleString("en-US", {
3633
- minimumFractionDigits: 2,
3634
- maximumFractionDigits: 2
3635
- })}`;
3636
- }
3637
- return "";
3638
- }
3639
- return /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement(ToastContainer3, null), /* @__PURE__ */ React13.createElement(
3640
- "button",
3641
- {
3642
- className: "export-btn mt-4",
3643
- style: { width: "100px" },
3644
- onClick: () => handlePaymentClick()
3645
- },
3646
- "TokenizePay"
3647
- ), /* @__PURE__ */ React13.createElement(
3648
- Modal7,
3649
- {
3650
- show: state.show,
3651
- onHide: () => setState((prev) => __spreadProps(__spreadValues({}, prev), {
3652
- show: false
3653
- })),
3654
- centered: true
3655
- },
3656
- /* @__PURE__ */ React13.createElement(Modal7.Header, { closeButton: true }),
3657
- /* @__PURE__ */ React13.createElement(Modal7.Body, null, /* @__PURE__ */ React13.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ React13.createElement("div", { className: "row" }, /* @__PURE__ */ React13.createElement("div", { className: "" }, /* @__PURE__ */ React13.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ React13.createElement("div", { className: "header" }, /* @__PURE__ */ React13.createElement("h1", null, "Pay")), /* @__PURE__ */ React13.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", null, "Name on card"), /* @__PURE__ */ React13.createElement(
3658
- "input",
3659
- {
3660
- id: "NameOnCard",
3661
- className: "form-control required",
3662
- type: "text",
3663
- maxLength: 100,
3664
- placeholder: "Name"
3665
- }
3666
- ), /* @__PURE__ */ React13.createElement(
3667
- "span",
3668
- {
3669
- id: "NameOnCard-error",
3670
- style: { color: "red", display: "none" }
3671
- }
3672
- )), /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement(
3673
- "input",
3674
- {
3675
- "data-token": "card_number",
3676
- className: "null card-image form-control required",
3677
- type: "text",
3678
- maxLength: 19,
3679
- value: state.cardNumber,
3680
- placeholder: "0000 0000 0000 0000",
3681
- onChange: handleCardNumberChange
3682
- }
3683
- ), state.error && /* @__PURE__ */ React13.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ React13.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React13.createElement(
3684
- "input",
3685
- {
3686
- "data-token": "exp_month",
3687
- className: "form-control required",
3688
- type: "text",
3689
- placeholder: "MM",
3690
- value: state.month,
3691
- maxLength: 2,
3692
- onChange: (e) => handleMonthChange(e)
3693
- }
3694
- ), isValidMonth && /* @__PURE__ */ React13.createElement(
3695
- "span",
3696
- {
3697
- id: "card_number-error",
3698
- style: { color: "red", fontSize: "15px" }
3699
- },
3700
- "Please write month only 1 to 12"
3701
- )), /* @__PURE__ */ React13.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React13.createElement(
3702
- "input",
3703
- {
3704
- "data-token": "exp_year",
3705
- className: "form-control required",
3706
- type: "text",
3707
- placeholder: "YY",
3708
- maxLength: 2,
3709
- value: state.year,
3710
- onChange: (e) => handleYearChange(e)
3711
- }
3712
- ), state.yearError && /* @__PURE__ */ React13.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ React13.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ React13.createElement("div", { className: "input-container" }, /* @__PURE__ */ React13.createElement(
3713
- "input",
3714
- {
3715
- "data-token": "cvv",
3716
- className: "form-control required",
3717
- type: "text",
3718
- maxLength: 4,
3719
- value: state.cvv,
3720
- placeholder: "CVV",
3721
- onChange: (e) => handleCVVChange(e)
3722
- }
3723
- ), /* @__PURE__ */ React13.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ React13.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ React13.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ React13.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ React13.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ React13.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ React13.createElement("label", null, "Postal code"), /* @__PURE__ */ React13.createElement("div", { className: "input-container" }, /* @__PURE__ */ React13.createElement(
3724
- "input",
3725
- {
3726
- id: "ZIPCode",
3727
- className: "form-control required",
3728
- name: "zip",
3729
- type: "text",
3730
- maxLength: 7,
3731
- placeholder: "000000",
3732
- value: state.zip,
3733
- onChange: (e) => handleZIP(e)
3734
- }
3735
- ), /* @__PURE__ */ React13.createElement(
3736
- "a",
3737
- {
3738
- tabIndex: 0,
3739
- role: "button",
3740
- "data-toggle": "popover",
3741
- "data-trigger": "focus",
3742
- "data-placement": "left",
3743
- "data-content": "Enter the ZIP/Postal code for your credit card billing address."
3744
- },
3745
- /* @__PURE__ */ React13.createElement("i", { className: "fa fa-question-circle" })
3746
- ), /* @__PURE__ */ React13.createElement(
3747
- "span",
3748
- {
3749
- id: "ZIPCode-error",
3750
- style: { color: "red", display: "none" }
3751
- },
3752
- "This field is required"
3753
- ))), /* @__PURE__ */ React13.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("label", null, "Payment amount"), /* @__PURE__ */ React13.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ React13.createElement(
3754
- "input",
3755
- {
3756
- id: "Amount",
3757
- className: "form-control required",
3758
- name: "amount",
3759
- type: "text",
3760
- placeholder: "",
3761
- value: state.amount,
3762
- onChange: (e) => handleAmount(e),
3763
- onBlur: handleAmountBlur
3764
- }
3765
- ))), /* @__PURE__ */ React13.createElement("div", { className: "card-row" }, /* @__PURE__ */ React13.createElement("span", { className: "visa" }), /* @__PURE__ */ React13.createElement("span", { className: "mastercard" }), /* @__PURE__ */ React13.createElement("span", { className: "amex" }), /* @__PURE__ */ React13.createElement("span", { className: "discover" }))), /* @__PURE__ */ React13.createElement(
3766
- "button",
3767
- {
3768
- type: "button",
3769
- id: "submitButton",
3770
- onClick: () => handleSubmitPay(),
3771
- className: "btn btn-block btn-success submit-button"
3772
- },
3773
- "Submit"
3774
- )), /* @__PURE__ */ React13.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ React13.createElement(
3775
- "svg",
3776
- {
3777
- xmlns: "http://www.w3.org/2000/svg",
3778
- width: "20",
3779
- height: "20",
3780
- viewBox: "0 0 26 26"
3781
- },
3782
- /* @__PURE__ */ React13.createElement(
3783
- "path",
3784
- {
3785
- fill: "currentColor",
3786
- 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"
3787
- }
3788
- )
3789
- ), "Secure payments powered by Fractal", /* @__PURE__ */ React13.createElement(
3790
- "img",
3791
- {
3792
- src: "https://ui.fractalpay.com/favicon.ico",
3793
- alt: "Fractal logo",
3794
- className: "powered-logo"
3795
- }
3796
- )))))))
3797
- ));
3798
- }
3799
-
3800
3397
  // src/app/components/Payment/GetPaymentDynamic.tsx
3801
- import React15, { useEffect as useEffect4, useState as useState10 } from "react";
3802
- import { Modal as Modal8 } from "react-bootstrap";
3398
+ import React14, { useEffect as useEffect4, useState as useState9 } from "react";
3399
+ import { Modal as Modal7 } from "react-bootstrap";
3803
3400
 
3804
3401
  // src/app/components/Loader/MyLoadingAnimation.tsx
3805
- import React14 from "react";
3402
+ import React13 from "react";
3806
3403
  function MyLoadingAnimation() {
3807
- return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(LoaderStyle_default, null), /* @__PURE__ */ React14.createElement("div", { className: "loading-animation" }, /* @__PURE__ */ React14.createElement("div", { className: "spinner" })));
3404
+ return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(LoaderStyle_default, null), /* @__PURE__ */ React13.createElement("div", { className: "loading-animation" }, /* @__PURE__ */ React13.createElement("div", { className: "spinner" })));
3808
3405
  }
3809
3406
 
3810
3407
  // src/app/components/Payment/GetPaymentDynamic.tsx
3811
3408
  function GetPaymentDynamic(props) {
3812
3409
  const { amount, fractalpayClientKey, orderID } = props;
3813
- const [loading, setLoading] = useState10(false);
3814
- const [show, setShow] = useState10(false);
3815
- const [iframeLoaded, setIframeLoaded] = useState10(false);
3816
- const [phoneNumber, setPhoneNumber] = useState10("");
3817
- const [errorMessage, setErrorMessage] = useState10("");
3818
- const [submitClicked, setSubmitClicked] = useState10(false);
3819
- const [isValidNumber, setIsValidNumber] = useState10(true);
3410
+ const [loading, setLoading] = useState9(false);
3411
+ const [show, setShow] = useState9(false);
3412
+ const [iframeLoaded, setIframeLoaded] = useState9(false);
3820
3413
  const handleClose = () => {
3821
3414
  setIframeLoaded(false);
3822
3415
  setTimeout(() => {
@@ -3828,29 +3421,14 @@ function GetPaymentDynamic(props) {
3828
3421
  setShow(true);
3829
3422
  setIframeLoaded(true);
3830
3423
  } else {
3831
- console.error("Fractalpay client key is missing or empty.");
3424
+ console.error(ErrorText.fractalpayclientidrequired);
3832
3425
  }
3833
3426
  };
3834
3427
  useEffect4(() => {
3835
3428
  if (!fractalpayClientKey) {
3836
- console.error("Fractalpay client key is missing or empty.");
3429
+ console.error(ErrorText.fractalpayclientidrequired);
3837
3430
  }
3838
3431
  }, [fractalpayClientKey]);
3839
- const handlePhoneNumberChange = (e) => {
3840
- const number = e.target.value;
3841
- const isValid = /^\d*$/.test(number);
3842
- if (isValid) {
3843
- setPhoneNumber(number);
3844
- setIsValidNumber(number.length <= 10);
3845
- if (number.length > 10) {
3846
- setErrorMessage("Please enter a valid phone number (max 10 digits)");
3847
- } else {
3848
- setErrorMessage("");
3849
- }
3850
- } else {
3851
- setErrorMessage("Please enter a valid phone number (numbers only)");
3852
- }
3853
- };
3854
3432
  const handleLoad = () => {
3855
3433
  setLoading(false);
3856
3434
  };
@@ -3869,7 +3447,7 @@ function GetPaymentDynamic(props) {
3869
3447
  window.removeEventListener("message", messageListener);
3870
3448
  };
3871
3449
  }, []);
3872
- return /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Pay"), /* @__PURE__ */ React15.createElement(Modal8, { show: show && iframeLoaded, id: "modal-pay", className: "modal-lg", onHide: handleClose }, /* @__PURE__ */ React15.createElement(Modal8.Header, { closeButton: true }), /* @__PURE__ */ React15.createElement(Modal8.Body, null, loading && /* @__PURE__ */ React15.createElement(MyLoadingAnimation, null), /* @__PURE__ */ React15.createElement(
3450
+ return /* @__PURE__ */ React14.createElement("div", null, /* @__PURE__ */ React14.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Pay"), /* @__PURE__ */ React14.createElement(Modal7, { show: show && iframeLoaded, id: "modal-pay", className: "modal-lg", onHide: handleClose }, /* @__PURE__ */ React14.createElement(Modal7.Header, { closeButton: true }), /* @__PURE__ */ React14.createElement(Modal7.Body, null, loading && /* @__PURE__ */ React14.createElement(MyLoadingAnimation, null), /* @__PURE__ */ React14.createElement(
3873
3451
  "iframe",
3874
3452
  {
3875
3453
  src: `${baseUrl}widget-form/${amount}?fractalpay_public_key=${fractalpayClientKey}&order_id=${orderID}`,
@@ -3888,6 +3466,5 @@ export {
3888
3466
  RequestPaymentAllInput,
3889
3467
  RequestPaymentDynamic,
3890
3468
  RequestPaymentonClick,
3891
- RqstPaymntInputField,
3892
- TockenizPay
3469
+ RqstPaymntInputField
3893
3470
  };