@fractalpay/fractalpay-next-dev 0.0.233 → 0.0.235

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.
Files changed (3) hide show
  1. package/dist/index.js +690 -365
  2. package/dist/index.js.map +1 -1
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -39,7 +39,7 @@ var require_package = __commonJS({
39
39
  "package.json"(exports, module) {
40
40
  module.exports = {
41
41
  name: "@fractalpay/fractalpay-next-dev",
42
- version: "0.0.233",
42
+ version: "0.0.235",
43
43
  private: false,
44
44
  type: "module",
45
45
  scripts: {
@@ -113,8 +113,25 @@ import { useState, useEffect } from "react";
113
113
  import { jsx } from "react/jsx-runtime";
114
114
  var LoaderStyle = (props) => {
115
115
  return /* @__PURE__ */ jsx("style", { children: `
116
-
117
- .loader {
116
+
117
+ .loader-light {
118
+ position: fixed; /* Fixed position to cover the viewport */
119
+ top: 0;
120
+ left: 0;
121
+ width: 100%;
122
+ height: 100%;
123
+ display: flex;
124
+ justify-content: center;
125
+ align-items: center;
126
+ /* background: rgba(255, 255, 0, 0.01); Adjust the blur effect */
127
+ background-color: rgba(31, 29, 29, 0.52); /* Semi-transparent black background */
128
+
129
+ backdrop-filter: blur(0.5px); /* Blur effect */
130
+ z-index: 999999999999 !important; /* Ensure it's on top of other elements */
131
+ transform: translate(0%, 0%) !important
132
+ }
133
+
134
+ .loader-dark {
118
135
  position: fixed; /* Fixed position to cover the viewport */
119
136
  top: 0;
120
137
  left: 0;
@@ -126,7 +143,7 @@ var LoaderStyle = (props) => {
126
143
  /* background: rgba(255, 255, 0, 0.01); Adjust the blur effect */
127
144
  background-color: rgba(31, 29, 29, 0.52); /* Semi-transparent black background */
128
145
 
129
- backdrop-filter: blur(.5px); /* Blur effect */
146
+ backdrop-filter: blur(6.5px); /* Blur effect */
130
147
  z-index: 999999999999 !important; /* Ensure it's on top of other elements */
131
148
  transform: translate(0%, 0%) !important
132
149
  }
@@ -201,10 +218,11 @@ var LoaderStyle_default = LoaderStyle;
201
218
 
202
219
  // src/app/components/Loader/Loader.tsx
203
220
  import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
204
- var Loader = (props) => {
221
+ var Loader = (_a) => {
222
+ var _b = _a, { intensity = "light" } = _b, props = __objRest(_b, ["intensity"]);
205
223
  return /* @__PURE__ */ jsxs(Fragment, { children: [
206
224
  /* @__PURE__ */ jsx2(LoaderStyle_default, {}),
207
- (props == null ? void 0 : props.loading) && /* @__PURE__ */ jsx2("div", { className: "loader", children: /* @__PURE__ */ jsxs("div", { className: "lds-ellipsis", children: [
225
+ (props == null ? void 0 : props.loading) && /* @__PURE__ */ jsx2("div", { className: `loader-${intensity}`, children: /* @__PURE__ */ jsxs("div", { className: "lds-ellipsis", children: [
208
226
  /* @__PURE__ */ jsx2("div", {}),
209
227
  /* @__PURE__ */ jsx2("div", {}),
210
228
  /* @__PURE__ */ jsx2("div", {}),
@@ -1697,7 +1715,7 @@ function Chargewidgetstyles() {
1697
1715
  .frac-form .save-ach-div{
1698
1716
  display:flex !important;
1699
1717
  gap:5px !important;
1700
- align-items:start;
1718
+ align-items:center
1701
1719
  }
1702
1720
 
1703
1721
  .frac-form .card-cvv-in{
@@ -2906,7 +2924,7 @@ function ErrorCardMszStyle() {
2906
2924
 
2907
2925
  // src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
2908
2926
  import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
2909
- var ErrorCardMessage = ({ onClose, error }) => {
2927
+ var ErrorCardMessage = ({ onClose, error, autoTrigger = false }) => {
2910
2928
  return /* @__PURE__ */ jsxs6(Fragment6, { children: [
2911
2929
  /* @__PURE__ */ jsx12(ErrorCardMszStyle, {}),
2912
2930
  /* @__PURE__ */ jsx12("div", { className: "card-error", children: /* @__PURE__ */ jsx12("div", { className: "payment-error-container", children: /* @__PURE__ */ jsxs6("div", { className: "error-icon", children: [
@@ -2915,7 +2933,7 @@ var ErrorCardMessage = ({ onClose, error }) => {
2915
2933
  /* @__PURE__ */ jsx12("div", { className: "payment-error-text", children: error }),
2916
2934
  /* @__PURE__ */ jsx12("div", { className: "thank-you-text", children: "Try again later " })
2917
2935
  ] }),
2918
- /* @__PURE__ */ jsx12("div", { className: "error-btn-div", children: /* @__PURE__ */ jsx12("button", { onClick: onClose, children: "OK" }) })
2936
+ !autoTrigger && /* @__PURE__ */ jsx12("div", { className: "error-btn-div", children: /* @__PURE__ */ jsx12("button", { onClick: onClose, children: "OK" }) })
2919
2937
  ] }) }) })
2920
2938
  ] });
2921
2939
  };
@@ -2932,14 +2950,26 @@ var socketClient_default = socket;
2932
2950
 
2933
2951
  // src/app/components/Atoms/CardBankRadio/CardBankRadio.tsx
2934
2952
  import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
2935
- var CardBankRadio = (props) => {
2936
- return /* @__PURE__ */ jsx13(Fragment7, { children: /* @__PURE__ */ jsxs7(
2953
+ var CardBankRadio = (_a) => {
2954
+ var _b = _a, { skydesign = false } = _b, props = __objRest(_b, ["skydesign"]);
2955
+ return /* @__PURE__ */ jsx13(Fragment7, { children: /* @__PURE__ */ jsx13(
2937
2956
  "div",
2938
2957
  {
2939
2958
  className: `frac-card-bank-radio ${props.activetab === props.value ? "frac-active" : ""}`,
2940
2959
  onClick: () => props.onChange(props.value),
2941
2960
  role: "radio",
2942
- children: [
2961
+ children: skydesign ? /* @__PURE__ */ jsxs7(Fragment7, { children: [
2962
+ /* @__PURE__ */ jsxs7("div", { className: "frac-card-title-main", children: [
2963
+ /* @__PURE__ */ jsxs7("div", { className: "box-inner-card-text", children: [
2964
+ /* @__PURE__ */ jsx13("img", { src: props.label.toLowerCase() === "card" ? defaultcard : props.label.toLowerCase() === "reader" ? pax : bankNew, className: "frac-payment-type-logo", alt: "" }),
2965
+ /* @__PURE__ */ jsx13("div", { className: "frac-card-label-text", children: props.label })
2966
+ ] }),
2967
+ /* @__PURE__ */ jsx13("div", { className: "frac-card-label", children: /* @__PURE__ */ jsx13("div", { className: "frac-card-label-amount", children: formatUSD(props.amount) }) })
2968
+ ] }),
2969
+ /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13("input", { name: "paymenttype", checked: props.activetab === props.value, type: "hidden", value: props.value, onChange: (e) => {
2970
+ props.onChange(e.target.value);
2971
+ } }) })
2972
+ ] }) : /* @__PURE__ */ jsxs7(Fragment7, { children: [
2943
2973
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-title-main", children: [
2944
2974
  /* @__PURE__ */ jsx13("img", { src: props.label.toLowerCase() === "card" ? defaultcard : props.label.toLowerCase() === "reader" ? pax : bankNew, className: "frac-payment-type-logo", alt: "" }),
2945
2975
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-label", children: [
@@ -2950,7 +2980,7 @@ var CardBankRadio = (props) => {
2950
2980
  /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13("input", { name: "paymenttype", checked: props.activetab === props.value, type: "radio", value: props.value, onChange: (e) => {
2951
2981
  props.onChange(e.target.value);
2952
2982
  } }) })
2953
- ]
2983
+ ] })
2954
2984
  }
2955
2985
  ) });
2956
2986
  };
@@ -3357,7 +3387,8 @@ var DataCapFields = ({
3357
3387
  isOpen,
3358
3388
  tokenKey,
3359
3389
  setLoader,
3360
- isAddCard
3390
+ isAddCard,
3391
+ isEmbedded
3361
3392
  }) => {
3362
3393
  const iframeId = "datacap-iframe";
3363
3394
  const resolverRef = useRef2(null);
@@ -3383,6 +3414,20 @@ var DataCapFields = ({
3383
3414
 
3384
3415
  `;
3385
3416
  }
3417
+ if (isEmbedded) {
3418
+ customCSS += `
3419
+
3420
+ input {
3421
+ background-color: #F6F6F7;
3422
+ box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1;
3423
+ }
3424
+
3425
+ select {
3426
+ background-color: #F6F6F7;
3427
+ box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1);
3428
+ }
3429
+ `;
3430
+ }
3386
3431
  const initialize = async () => {
3387
3432
  setLoader == null ? void 0 : setLoader(true);
3388
3433
  setIframeReady(false);
@@ -3421,6 +3466,7 @@ var DataCapFields = ({
3421
3466
  window.DatacapHostedWebToken.requestToken();
3422
3467
  });
3423
3468
  };
3469
+ console.log(setLoader, "loadingIframe");
3424
3470
  return /* @__PURE__ */ jsx18(
3425
3471
  "iframe",
3426
3472
  {
@@ -4603,8 +4649,13 @@ function GetPaymentPage(props) {
4603
4649
  ] }),
4604
4650
  (props == null ? void 0 : props.customerId) && /* @__PURE__ */ jsxs11("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" }, children: [
4605
4651
  /* @__PURE__ */ jsx19("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
4606
- /* @__PURE__ */ jsx19("label", { htmlFor: "saveACH", children: `By selecting this box, I authorize SkyFi, on behalf of ${(paymentData == null ? void 0 : paymentData.bname) || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
4607
- ] })
4652
+ /* @__PURE__ */ jsx19("label", { htmlFor: "saveACH", children: "Save ACH" })
4653
+ ] }),
4654
+ saveACHinfo && /* @__PURE__ */ jsx19("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" }, children: /* @__PURE__ */ jsxs11("p", { children: [
4655
+ "If checked, I agree for ",
4656
+ /* @__PURE__ */ jsx19("b", { children: "ecommerce" }),
4657
+ " to have my permission to charge this credit card for agreed upon purchases in the future."
4658
+ ] }) })
4608
4659
  ] }),
4609
4660
  /* @__PURE__ */ jsx19("div", { className: "form-group ", children: /* @__PURE__ */ jsx19("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit", children: formatUSD((_v = Number(cashDiscount)) == null ? void 0 : _v.toFixed(2)) }) })
4610
4661
  ] })
@@ -8521,8 +8572,13 @@ function PartialPayment(props) {
8521
8572
  ] }),
8522
8573
  (props == null ? void 0 : props.customerId) && /* @__PURE__ */ jsxs17("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" }, children: [
8523
8574
  /* @__PURE__ */ jsx28("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
8524
- /* @__PURE__ */ jsx28("label", { htmlFor: "saveACH", children: `By selecting this box, I authorize SkyFi, on behalf of ${(paymentData == null ? void 0 : paymentData.bname) || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
8525
- ] })
8575
+ /* @__PURE__ */ jsx28("label", { htmlFor: "saveACH", children: "Save ACH" })
8576
+ ] }),
8577
+ saveACHinfo && /* @__PURE__ */ jsx28("div", { className: "form-group mb-4", style: { fontSize: "12px", color: "#727272" }, children: /* @__PURE__ */ jsxs17("p", { children: [
8578
+ "If checked, I agree for ",
8579
+ /* @__PURE__ */ jsx28("b", { children: "ecommerce" }),
8580
+ " to have my permission to charge this credit card for agreed upon purchases in the future."
8581
+ ] }) })
8526
8582
  ] }),
8527
8583
  /* @__PURE__ */ jsx28("div", { className: "form-group ", children: /* @__PURE__ */ jsx28("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit", children: partialAmount && !partialError ? formatUSD((_z = Number(partialAmount)) == null ? void 0 : _z.toFixed(2)) : formatUSD((_A = Number(cashDiscount)) == null ? void 0 : _A.toFixed(2)) }) })
8528
8584
  ] })
@@ -9474,10 +9530,162 @@ function CheckoutWrapper({ clientSecret, onSuccess, showLoader, setError, sessio
9474
9530
  // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
9475
9531
  import { IoArrowBack as IoArrowBack4 } from "react-icons/io5";
9476
9532
  import { NumericFormat as NumericFormat2 } from "react-number-format";
9477
- import { Fragment as Fragment18, jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
9478
- var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_token, customerId, callback, merchantName = "merchant", isPreAuth, surcharge = "0", submitBtnClass, submitBtnIcon, isRequest, pass_fee, pass_fee_amount, require3ds = false, autoTrigger = false, show, setShow, setHandleCloseRef, isPartial, bankSurcharge, partialRef, loadingPrev = false, orderGuid: ordGuid, remainingAmount: remAmount }) => {
9479
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
9533
+
9534
+ // src/app/components/ErrorCardMessage/ErrorCardOverlaystyle.tsx
9535
+ import { jsx as jsx32 } from "react/jsx-runtime";
9536
+ function ErrorCardOverlayStyle() {
9537
+ return /* @__PURE__ */ jsx32("style", { children: `
9538
+ .card-error-overlay .logo-container {
9539
+ display: flex;
9540
+ justify-content: center;
9541
+ align-items: center;
9542
+ margin-bottom: -50px; /* Adjust this to overlap the content */
9543
+ z-index: 10;
9544
+ }
9545
+
9546
+ .card-error-overlay .client-logo {
9547
+ max-width: 100px;
9548
+ height: auto;
9549
+ object-fit: contain;
9550
+ display: block;
9551
+ }
9552
+
9553
+
9554
+ .card-error-overlay .error-icon-overlay {
9555
+ display: flex;
9556
+ flex-direction: column;
9557
+ align-items: center;
9558
+ gap: 12px;
9559
+ min-height: 116px;
9560
+ z-index: 2;
9561
+ }
9562
+
9563
+ .card-error-overlay .circle {
9564
+ width: 50px;
9565
+ height: 50px;
9566
+ border: 1px solid red;
9567
+ border-radius: 50%;
9568
+ display: flex;
9569
+ justify-content: center;
9570
+ align-items: center;
9571
+ margin-bottom:20px
9572
+ }
9573
+
9574
+ .card-error-overlay .circle .fa-times {
9575
+ font-size: 30px;
9576
+ color: red;
9577
+ }
9578
+
9579
+ .card-error-overlay .error-text-overlay {
9580
+ display: flex;
9581
+ flex-direction: column;
9582
+ justify-content: center;
9583
+ align-items: center;
9584
+ gap: 4px;
9585
+ // width: 227px;
9586
+ }
9587
+
9588
+ .card-error-overlay .payment-error-text-overlay {
9589
+ font-family: 'Inter', sans-serif;
9590
+ font-weight: 500;
9591
+ font-size: 18px;
9592
+ line-height: 21px;
9593
+ text-align: center;
9594
+ letter-spacing: -0.02em;
9595
+ color: #161616;
9596
+ }
9597
+
9598
+ .card-error-overlay .thank-you-text-overlay {
9599
+ font-family: 'Inter', sans-serif;
9600
+ font-weight: 500;
9601
+ font-size: 16px;
9602
+ line-height: 18px;
9603
+ text-align: center;
9604
+ letter-spacing: -0.02em;
9605
+ color: #161616 !important;
9606
+ opacity: 0.5;
9607
+ padding-top:10px
9608
+ }
9609
+
9610
+ .card-error-overlay .error-btn-div-overlay{
9611
+ padding-top:20px;
9612
+ width: 100%;
9613
+
9614
+ }
9615
+ .card-error-overlay .error-btn-div-overlay button{
9616
+ outline: 0;
9617
+ height: 46px;
9618
+ font-size: 16px;
9619
+ background: #727272;
9620
+ border: none;
9621
+ display: block;
9622
+ color: #fff;
9623
+ width: 100%;
9624
+ border-radius: 180px;
9625
+ margin: 10px 0;
9626
+ text-decoration: none;
9627
+ }
9628
+ .card-error-overlay .error-btn-div-overlay button:hover, .card-error-overlay .error-btn-div-overlay button:focus {
9629
+ background: #222;
9630
+ color: #fff;
9631
+ cursor: pointer;
9632
+ }
9633
+ .payment-error-container-overlay {
9634
+ width: fit-content;
9635
+ position: relative;
9636
+ top: 50%;
9637
+ left: 50%;
9638
+ transform: translate(-50%, -50%);
9639
+ background: rgba(255, 255, 255, 0.15);
9640
+ backdrop-filter: blur(12px);
9641
+ -webkit-backdrop-filter: blur(12px);
9642
+ border-radius: 12px;
9643
+ z-index: 11111;
9644
+ max-width: 240px;
9645
+ min-width: 224px;
9646
+ padding: 20px;
9647
+ margin-left: 17px !important;
9648
+ }
9649
+ .card-error-overlay {
9650
+ position: absolute;
9651
+ top: 0;
9652
+ left: 0;
9653
+ width: 100%;
9654
+ height: 100%;
9655
+ background: rgb(87 87 87 / 15%);
9656
+ backdrop-filter: blur(2px);
9657
+ -webkit-backdrop-filter: blur(12px);
9658
+ z-index: 1111;
9659
+ }
9660
+ ` });
9661
+ }
9662
+
9663
+ // src/app/components/ErrorCardMessage/ErrorCardOverlay.tsx
9664
+ import { Fragment as Fragment18, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
9665
+ var ErrorCardOverlay = ({ onClose, error, autoTrigger = false }) => {
9666
+ return /* @__PURE__ */ jsxs19(Fragment18, { children: [
9667
+ /* @__PURE__ */ jsx33(ErrorCardOverlayStyle, {}),
9668
+ /* @__PURE__ */ jsx33("div", { className: "card-error-overlay", children: /* @__PURE__ */ jsx33("div", { className: "payment-error-container-overlay", children: /* @__PURE__ */ jsxs19("div", { className: "error-icon-overlay", children: [
9669
+ /* @__PURE__ */ jsx33("div", { className: "circle", children: /* @__PURE__ */ jsx33("i", { className: "fa fa-times", "aria-hidden": "true" }) }),
9670
+ /* @__PURE__ */ jsxs19("div", { className: "error-text-overlay", children: [
9671
+ /* @__PURE__ */ jsx33("div", { className: "payment-error-text-overlay", children: error }),
9672
+ /* @__PURE__ */ jsx33("div", { className: "thank-you-text-overlay", children: "Try again later " })
9673
+ ] }),
9674
+ !autoTrigger && /* @__PURE__ */ jsx33("div", { className: "error-btn-div-overlay", children: /* @__PURE__ */ jsx33("button", { onClick: onClose, children: "OK" }) })
9675
+ ] }) }) })
9676
+ ] });
9677
+ };
9678
+ var ErrorCardOverlay_default = ErrorCardOverlay;
9679
+
9680
+ // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
9681
+ import { Fragment as Fragment19, jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
9682
+ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_token, customerId, callback, merchantName = "merchant", isPreAuth, surcharge = "0", submitBtnClass, submitBtnIcon, isRequest, pass_fee, pass_fee_amount, require3ds = false, autoTrigger = false, show, setShow, setHandleCloseRef, isPartial, bankSurcharge, partialRef, loadingPrev = false, orderGuid: ordGuid, remainingAmount: remAmount, onSubmit, onLoad = true }) => {
9683
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
9480
9684
  const hasRunRef = useRef10(false);
9685
+ const cardFormRef = useRef10(null);
9686
+ const bankFormRef = useRef10(null);
9687
+ const expiryYearRef = useRef10(null);
9688
+ const expiryMonthRef = useRef10(null);
9481
9689
  const cardListRunRef = useRef10(false);
9482
9690
  const threeDSContainerRef = useRef10(null);
9483
9691
  const [activetab, setActive] = useState10("card");
@@ -9528,6 +9736,10 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9528
9736
  let pax2 = S3Url + "widget/pax.svg";
9529
9737
  let cardicon = S3Url + "widget/cardicon.svg";
9530
9738
  let bankicon = S3Url + "widget/bankicon.svg";
9739
+ let defualtcardborder = S3Url + "widget/defualtcardborder.svg";
9740
+ let unionicon = S3Url + "widget/unionpay.svg";
9741
+ let dinersicon = S3Url + "widget/diners.svg";
9742
+ let jcbicon = S3Url + "widget/jcb.svg";
9531
9743
  const showLoader = () => setLoading(true);
9532
9744
  const hideLoader = () => setLoading(false);
9533
9745
  const CalculateCashDiscount = (amount2, surcharge2) => {
@@ -9741,7 +9953,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9741
9953
  }
9742
9954
  };
9743
9955
  const handleFractalTokenFlow = async () => {
9744
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t, _u, _v, _w;
9956
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v, _w;
9745
9957
  try {
9746
9958
  const requestOptions = {
9747
9959
  method: "POST",
@@ -9812,7 +10024,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9812
10024
  const errorText = typeof rawError === "string" ? rawError : JSON.stringify(rawError);
9813
10025
  const lines = ((_s2 = (_r2 = errorText.split) == null ? void 0 : _r2.call(errorText, "\n")) == null ? void 0 : _s2.filter(Boolean)) || [];
9814
10026
  const lastLine = lines.at(-1) || "";
9815
- const parts = (_t = lastLine.split) == null ? void 0 : _t.call(lastLine, ": ");
10027
+ const parts = (_t2 = lastLine.split) == null ? void 0 : _t2.call(lastLine, ": ");
9816
10028
  readableMessage = (parts == null ? void 0 : parts.length) > 1 ? parts.pop().trim() : lastLine.trim() || readableMessage;
9817
10029
  } catch (e) {
9818
10030
  readableMessage = "Something went wrong!";
@@ -9820,7 +10032,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9820
10032
  setError(readableMessage);
9821
10033
  callback({
9822
10034
  error: readableMessage,
9823
- result: (_v = (_u = error2 == null ? void 0 : error2.response) == null ? void 0 : _u.data) == null ? void 0 : _v.result,
10035
+ result: (_v = (_u2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _u2.data) == null ? void 0 : _v.result,
9824
10036
  statusCode: (_w = error2 == null ? void 0 : error2.response) == null ? void 0 : _w.status
9825
10037
  });
9826
10038
  }
@@ -10236,8 +10448,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10236
10448
  });
10237
10449
  };
10238
10450
  const handlechargeCustomer = async (e) => {
10239
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
10240
- e.currentTarget.blur();
10451
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2;
10452
+ e == null ? void 0 : e.currentTarget.blur();
10241
10453
  if (loading) return;
10242
10454
  let customer_id = customerId;
10243
10455
  let card_id = selectedCard == null ? void 0 : selectedCard.id;
@@ -10284,7 +10496,6 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10284
10496
  statusCode: (_g2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _g2.status
10285
10497
  });
10286
10498
  hideLoader();
10287
- setError(((_i2 = (_h2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _h2.data) == null ? void 0 : _i2.message) || "Something went wrong!");
10288
10499
  }
10289
10500
  } else {
10290
10501
  setError("Please Select A Card/Bank");
@@ -10366,13 +10577,13 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10366
10577
  }
10367
10578
  }, [show, autoTrigger]);
10368
10579
  useEffect15(() => {
10369
- if (!hasRunRef.current && (show || autoTrigger)) {
10580
+ if (!hasRunRef.current && (show || autoTrigger) && onLoad) {
10370
10581
  getPaymentDetails();
10371
10582
  if (isPartial && !partialRef) {
10372
10583
  crateOrderFrac();
10373
10584
  }
10374
10585
  }
10375
- }, [show, autoTrigger, isPartial]);
10586
+ }, [show, autoTrigger, isPartial, onLoad]);
10376
10587
  useEffect15(() => {
10377
10588
  if ((show || autoTrigger) && pass_fee_amount) {
10378
10589
  let cashdisc = Number(amount) - Number(pass_fee_amount);
@@ -10460,17 +10671,92 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10460
10671
  });
10461
10672
  }, []);
10462
10673
  console.log(activeinCard === "list", "activeinCard", activeList);
10463
- return /* @__PURE__ */ jsxs19(Fragment18, { children: [
10464
- initialLoader && /* @__PURE__ */ jsx32(Loader_default, { loading: initialLoader }),
10465
- error && /* @__PURE__ */ jsx32("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx32(ErrorCardMessage_default, { error, onClose: handleClose }) }),
10466
- errorIframe && /* @__PURE__ */ jsx32("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx32(ErrorCardMessage_default, { error: errorIframe, onClose: () => {
10674
+ const stateRef = useRef10({
10675
+ activeinBank,
10676
+ activeinCard,
10677
+ activetab
10678
+ });
10679
+ useEffect15(() => {
10680
+ stateRef.current = {
10681
+ activeinBank,
10682
+ activeinCard,
10683
+ activetab
10684
+ };
10685
+ }, [activeinBank, activeinCard, activetab]);
10686
+ const submit = useCallback(() => {
10687
+ var _a2, _b2;
10688
+ const { activeinBank: activeinBank2, activeinCard: activeinCard2, activetab: activetab2 } = stateRef.current;
10689
+ console.log("Submitt logic", activeinBank2, "activeinBank", activeinCard2, "activeinCard", activetab2, "activetab");
10690
+ if (activetab2 === "card") {
10691
+ if (activeinCard2 === "form") {
10692
+ (_a2 = cardFormRef.current) == null ? void 0 : _a2.requestSubmit();
10693
+ } else if (activeinCard2 === "list") {
10694
+ handlechargeCustomer();
10695
+ }
10696
+ } else if (activetab2 === "ach") {
10697
+ if (activeinBank2 === "form") {
10698
+ (_b2 = bankFormRef.current) == null ? void 0 : _b2.requestSubmit();
10699
+ } else if (activeinBank2 === "list") {
10700
+ handlechargeCustomer();
10701
+ }
10702
+ }
10703
+ }, []);
10704
+ useEffect15(() => {
10705
+ console.log("Registering submit");
10706
+ onSubmit == null ? void 0 : onSubmit(submit);
10707
+ }, [onSubmit, submit]);
10708
+ function detectCardType(cardinput) {
10709
+ if (!cardinput) return null;
10710
+ const number = cardinput.replace(/\D/g, "");
10711
+ const patterns = {
10712
+ visa: /^4/,
10713
+ mastercard: /^(5[1-5]|2[2-7][0-9]{2})/,
10714
+ amex: /^3[47]/,
10715
+ discover: /^(6011|65|64[4-9])/,
10716
+ diners: /^(30[0-5]|36|38)/,
10717
+ jcb: /^(35[2-8][0-9])/,
10718
+ unionpay: /^62/
10719
+ };
10720
+ for (const [type, regex] of Object.entries(patterns)) {
10721
+ if (regex.test(number)) {
10722
+ return type;
10723
+ }
10724
+ }
10725
+ return "unknown";
10726
+ }
10727
+ function getCardImage(cardInput) {
10728
+ const cardType = detectCardType(cardInput);
10729
+ switch (cardType) {
10730
+ case "visa":
10731
+ return /* @__PURE__ */ jsx34("img", { src: visa2, alt: "visa", width: 33 });
10732
+ case "mastercard":
10733
+ return /* @__PURE__ */ jsx34("img", { src: mastercard2, width: 33, alt: "mastercard" });
10734
+ case "amex":
10735
+ return /* @__PURE__ */ jsx34("img", { src: americanexp2, alt: "amex", width: 33 });
10736
+ case "discover":
10737
+ return /* @__PURE__ */ jsx34("img", { src: discover2, width: 33, alt: "discover" });
10738
+ case "diners":
10739
+ return /* @__PURE__ */ jsx34("img", { src: dinersicon, alt: "Diners Club" });
10740
+ case "jcb":
10741
+ return /* @__PURE__ */ jsx34("img", { src: jcbicon, alt: "JCB" });
10742
+ case "unionpay":
10743
+ return /* @__PURE__ */ jsx34("img", { src: unionicon, alt: "UnionPay" });
10744
+ default:
10745
+ return /* @__PURE__ */ jsx34("img", { src: defualtcardborder, alt: "card" });
10746
+ }
10747
+ }
10748
+ console.log(loadingIframe, "loadingIframe 222");
10749
+ return /* @__PURE__ */ jsxs20(Fragment19, { children: [
10750
+ (initialLoader || !onLoad) && /* @__PURE__ */ jsx34(Loader_default, { intensity: "dark", loading: initialLoader || !onLoad }),
10751
+ error && /* @__PURE__ */ jsx34("div", { children: /* @__PURE__ */ jsx34(ErrorCardOverlay_default, { error, onClose: handleClose, autoTrigger }) }),
10752
+ errorIframe && /* @__PURE__ */ jsx34("div", { children: /* @__PURE__ */ jsx34(ErrorCardOverlay_default, { error: errorIframe, onClose: () => {
10467
10753
  setErrorIframe("");
10468
- } }) }),
10469
- !error && !errorIframe && /* @__PURE__ */ jsxs19(Fragment18, { children: [
10470
- (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx32(Loader_default, { loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
10471
- /* @__PURE__ */ jsxs19("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
10472
- /* @__PURE__ */ jsx32("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
10473
- (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx32(
10754
+ }, autoTrigger }) }),
10755
+ /* @__PURE__ */ jsxs20(Fragment19, { children: [
10756
+ (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx34(Loader_default, { intensity: "light", loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
10757
+ /* @__PURE__ */ jsxs20("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
10758
+ /* @__PURE__ */ jsx34("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
10759
+ (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx34(
10474
10760
  ThreeDSChallenge,
10475
10761
  {
10476
10762
  containerRef: threeDSContainerRef,
@@ -10480,40 +10766,40 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10480
10766
  onSuccess: handleSuccess,
10481
10767
  onError: handleError
10482
10768
  }
10483
- ) : /* @__PURE__ */ jsxs19("div", { className: "parent-pay-container", children: [
10484
- /* @__PURE__ */ jsx32("span", { style: { display: autoTrigger ? "none" : "block" }, className: "request-payment-close-popup", onClick: handleClose, children: /* @__PURE__ */ jsxs19("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
10485
- /* @__PURE__ */ jsx32("g", { clipPath: "url(#clip0_12425_52336)", children: /* @__PURE__ */ jsx32("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" }) }),
10486
- /* @__PURE__ */ jsx32("defs", { children: /* @__PURE__ */ jsx32("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx32("rect", { width: "16", height: "16", fill: "white" }) }) })
10769
+ ) : /* @__PURE__ */ jsxs20("div", { className: "parent-pay-container", children: [
10770
+ /* @__PURE__ */ jsx34("span", { style: { display: autoTrigger ? "none" : "block" }, className: "request-payment-close-popup", onClick: handleClose, children: /* @__PURE__ */ jsxs20("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
10771
+ /* @__PURE__ */ jsx34("g", { clipPath: "url(#clip0_12425_52336)", children: /* @__PURE__ */ jsx34("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" }) }),
10772
+ /* @__PURE__ */ jsx34("defs", { children: /* @__PURE__ */ jsx34("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx34("rect", { width: "16", height: "16", fill: "white" }) }) })
10487
10773
  ] }) }),
10488
- /* @__PURE__ */ jsx32("div", { className: "pay-main-logo-res" }),
10489
- /* @__PURE__ */ jsxs19("div", { className: "pay-container", children: [
10490
- /* @__PURE__ */ jsxs19("div", { className: "pay-header pay-conatiner-one", children: [
10491
- /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-first", children: [
10492
- /* @__PURE__ */ jsxs19("div", { className: "pay-logo-container", children: [
10493
- /* @__PURE__ */ jsx32("div", { className: "pay-main-logo" }),
10494
- /* @__PURE__ */ jsx32("h1", { className: "pay-heading", children: "Pay" }),
10495
- (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs19("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
10774
+ /* @__PURE__ */ jsx34("div", { className: "pay-main-logo-res" }),
10775
+ /* @__PURE__ */ jsxs20("div", { className: onSubmit ? "pay-container frac-pay-container " : "pay-container", children: [
10776
+ !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "pay-header pay-conatiner-one", children: [
10777
+ /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-first", children: [
10778
+ /* @__PURE__ */ jsxs20("div", { className: "pay-logo-container", children: [
10779
+ /* @__PURE__ */ jsx34("div", { className: "pay-main-logo" }),
10780
+ /* @__PURE__ */ jsx34("h1", { className: "pay-heading", children: "Pay" }),
10781
+ (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs20("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
10496
10782
  " ",
10497
- /* @__PURE__ */ jsx32(IoArrowBack4, {}),
10783
+ /* @__PURE__ */ jsx34(IoArrowBack4, {}),
10498
10784
  " Back"
10499
10785
  ] })
10500
10786
  ] }),
10501
- /* @__PURE__ */ jsx32("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs19("div", { className: "pay-amount-conatiner", children: [
10502
- /* @__PURE__ */ jsx32("small", { className: "pay-payment-amount", children: "Select payment type" }),
10503
- /* @__PURE__ */ jsxs19("div", { className: "frac-card-bank-radio-main", children: [
10504
- /* @__PURE__ */ jsx32(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10505
- !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx32(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab })
10787
+ /* @__PURE__ */ jsx34("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
10788
+ /* @__PURE__ */ jsx34("small", { className: "pay-payment-amount", children: "Select payment type" }),
10789
+ /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
10790
+ /* @__PURE__ */ jsx34(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10791
+ !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx34(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab })
10506
10792
  ] }),
10507
- pass_fee && activetab === "card" && cashDiscount && Number(amount) - Number(cashDiscount) > 0 ? /* @__PURE__ */ jsxs19("div", { className: "frac-cash-discount-fee", children: [
10508
- /* @__PURE__ */ jsxs19("small", { children: [
10793
+ pass_fee && activetab === "card" && cashDiscount && Number(amount) - Number(cashDiscount) > 0 ? /* @__PURE__ */ jsxs20("div", { className: "frac-cash-discount-fee", children: [
10794
+ /* @__PURE__ */ jsxs20("small", { children: [
10509
10795
  activetab === "card" ? "Cash Discount" : "Cash Discount Savings",
10510
10796
  " "
10511
10797
  ] }),
10512
- /* @__PURE__ */ jsx32("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10798
+ /* @__PURE__ */ jsx34("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10513
10799
  ] }) : null,
10514
- isPartial && /* @__PURE__ */ jsxs19("div", { className: "frac-partial-payment-input", children: [
10515
- /* @__PURE__ */ jsx32("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10516
- /* @__PURE__ */ jsx32(
10800
+ isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
10801
+ /* @__PURE__ */ jsx34("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10802
+ /* @__PURE__ */ jsx34(
10517
10803
  NumericFormat2,
10518
10804
  {
10519
10805
  prefix: "$",
@@ -10537,316 +10823,355 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10537
10823
  }
10538
10824
  }
10539
10825
  ),
10540
- partialError && /* @__PURE__ */ jsx32("span", { className: "error-span", children: partialError })
10826
+ partialError && /* @__PURE__ */ jsx34("span", { className: "error-span", children: partialError })
10541
10827
  ] })
10542
10828
  ] }) })
10543
10829
  ] }),
10544
- /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-last", children: [
10545
- /* @__PURE__ */ jsx32("img", { src: secure2, alt: "" }),
10546
- /* @__PURE__ */ jsx32("img", { src: pov2, alt: "" }),
10830
+ /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-last", children: [
10831
+ /* @__PURE__ */ jsx34("img", { src: secure2, alt: "" }),
10832
+ /* @__PURE__ */ jsx34("img", { src: pov2, alt: "" }),
10547
10833
  "Secure payments powered by Fractal"
10548
10834
  ] })
10549
10835
  ] }),
10550
- /* @__PURE__ */ jsx32("div", { className: "pay-tab pay-conatiner-two", children: /* @__PURE__ */ jsx32("div", { className: "col-md-12", children: /* @__PURE__ */ jsx32("div", { id: "payment-form-div", children: is3DSEnable ? clientSecret && /* @__PURE__ */ jsx32(CheckoutWrapper, { onSuccess, clientSecret, amount, showLoader, hideLoader, callback, session_token, handleClose, setError, isPreAuth }) : /* @__PURE__ */ jsxs19(Fragment18, { children: [
10551
- /* @__PURE__ */ jsxs19("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
10552
- /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10553
- /* @__PURE__ */ jsx32("div", { className: "frac-backarrow", children: (cardList == null ? void 0 : cardList.length) > 0 && activeinCard === "form" && /* @__PURE__ */ jsxs19("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinCard("list"), children: [
10554
- " ",
10555
- /* @__PURE__ */ jsx32(IoArrowBack4, {})
10556
- ] }) }),
10557
- /* @__PURE__ */ jsx32("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
10836
+ /* @__PURE__ */ jsx34("div", { className: "pay-tab pay-conatiner-two", children: /* @__PURE__ */ jsx34("div", { className: "col-md-12", children: /* @__PURE__ */ jsxs20("div", { id: "payment-form-div ", className: onSubmit ? "frac-payment-form-div" : "", children: [
10837
+ onSubmit && /* @__PURE__ */ jsx34("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
10838
+ /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
10839
+ /* @__PURE__ */ jsx34(CardBankRadio, { skydesign: true, label: "Card", amount: (_c = Number(amount)) == null ? void 0 : _c.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10840
+ !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx34(CardBankRadio, { skydesign: true, label: "Bank", amount: (_d = Number(bankAmount)) == null ? void 0 : _d.toFixed(2), value: "ach", onChange: handletabchange, activetab })
10558
10841
  ] }),
10559
- /* @__PURE__ */ jsxs19("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
10560
- /* @__PURE__ */ jsx32("img", { src: visa2, alt: "", width: 33 }),
10561
- /* @__PURE__ */ jsx32("img", { src: mastercard2, width: 33, alt: "" }),
10562
- /* @__PURE__ */ jsx32("img", { src: americanexp2, alt: "", width: 33 }),
10563
- /* @__PURE__ */ jsx32("img", { src: discover2, width: 33, alt: "" })
10564
- ] }),
10565
- activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10566
- /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
10567
- setActiveinCard("form");
10568
- } }),
10569
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", style: { padding: "0" }, children: /* @__PURE__ */ jsx32("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: partialAmount ? formatUSD((_c = Number(partialAmount)) == null ? void 0 : _c.toFixed(2)) : formatUSD((_d = Number(amount)) == null ? void 0 : _d.toFixed(2)) }) })
10570
- ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs19("form", { id: "paymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10571
- if (e.key === "Enter" && loading) {
10572
- e.preventDefault();
10573
- e.stopPropagation();
10574
- }
10575
- }, children: [
10576
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10577
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10578
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10579
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10580
- const value = e.target.value;
10581
- if (/^[a-zA-Z\s]*$/.test(value)) {
10582
- handleCardChange("cardName", value);
10583
- }
10584
- } }),
10585
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10586
- ] }),
10587
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10588
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
10589
- /* @__PURE__ */ jsx32("div", { className: "toggle-num-wrapper", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx32(
10590
- FractalFields_default,
10591
- {
10592
- fractalStyles,
10593
- tokenizerRef,
10594
- isSky: true
10595
- }
10596
- ) })
10597
- ] }),
10598
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10599
- /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10600
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_e = cardData == null ? void 0 : cardData.zipCode) != null ? _e : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
10601
- (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10842
+ pass_fee && activetab === "card" && cashDiscount && Number(amount) - Number(cashDiscount) > 0 ? /* @__PURE__ */ jsxs20("div", { className: "frac-cash-discount-fee", children: [
10843
+ /* @__PURE__ */ jsxs20("small", { children: [
10844
+ activetab === "card" ? "Cash Discount" : "Cash Discount Savings",
10845
+ " "
10846
+ ] }),
10847
+ /* @__PURE__ */ jsx34("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10848
+ ] }) : null,
10849
+ isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
10850
+ /* @__PURE__ */ jsx34("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10851
+ /* @__PURE__ */ jsx34(
10852
+ NumericFormat2,
10853
+ {
10854
+ prefix: "$",
10855
+ className: "form-control-frac",
10856
+ value: partialAmount,
10857
+ onValueChange: (values) => {
10858
+ handlePartialChange(values);
10859
+ },
10860
+ thousandSeparator: true,
10861
+ placeholder: "Enter partial amount",
10862
+ allowNegative: false,
10863
+ allowLeadingZeros: false,
10864
+ decimalScale: 2,
10865
+ fixedDecimalScale: true
10866
+ }
10867
+ ),
10868
+ partialError && /* @__PURE__ */ jsx34("span", { className: "error-span", children: partialError })
10869
+ ] })
10870
+ ] }) }),
10871
+ is3DSEnable ? clientSecret && /* @__PURE__ */ jsx34(CheckoutWrapper, { onSuccess, clientSecret, amount, showLoader, hideLoader, callback, session_token, handleClose, setError, isPreAuth }) : /* @__PURE__ */ jsxs20(Fragment19, { children: [
10872
+ /* @__PURE__ */ jsxs20("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
10873
+ !onSubmit && /* @__PURE__ */ jsxs20(Fragment19, { children: [
10874
+ /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
10875
+ /* @__PURE__ */ jsx34("div", { className: "frac-backarrow", children: (cardList == null ? void 0 : cardList.length) > 0 && activeinCard === "form" && /* @__PURE__ */ jsxs20("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinCard("list"), children: [
10876
+ " ",
10877
+ /* @__PURE__ */ jsx34(IoArrowBack4, {})
10878
+ ] }) }),
10879
+ /* @__PURE__ */ jsx34("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
10602
10880
  ] }),
10603
- customerId && /* @__PURE__ */ jsx32("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
10604
- /* @__PURE__ */ jsx32(
10605
- "input",
10606
- {
10607
- type: "checkbox",
10608
- id: "save_card",
10609
- className: "toggle-checkbox",
10610
- checked: saveCardInfo,
10611
- onChange: (e) => setSaveCardInfo(e.target.checked)
10612
- }
10613
- ),
10614
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10615
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10616
- /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10617
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10618
- "svg",
10881
+ /* @__PURE__ */ jsxs20("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
10882
+ /* @__PURE__ */ jsx34("img", { src: visa2, alt: "", width: 33 }),
10883
+ /* @__PURE__ */ jsx34("img", { src: mastercard2, width: 33, alt: "" }),
10884
+ /* @__PURE__ */ jsx34("img", { src: americanexp2, alt: "", width: 33 }),
10885
+ /* @__PURE__ */ jsx34("img", { src: discover2, width: 33, alt: "" })
10886
+ ] })
10887
+ ] }),
10888
+ activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
10889
+ /* @__PURE__ */ jsx34(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
10890
+ setActiveinCard("form");
10891
+ } }),
10892
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { padding: "0" }, children: /* @__PURE__ */ jsx34("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: partialAmount ? formatUSD((_e = Number(partialAmount)) == null ? void 0 : _e.toFixed(2)) : formatUSD((_f = Number(amount)) == null ? void 0 : _f.toFixed(2)) }) })
10893
+ ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs20("form", { id: "paymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10894
+ if (e.key === "Enter" && loading) {
10895
+ e.preventDefault();
10896
+ e.stopPropagation();
10897
+ }
10898
+ }, children: [
10899
+ /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10900
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
10901
+ /* @__PURE__ */ jsx34("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10902
+ /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10903
+ const value = e.target.value;
10904
+ if (/^[a-zA-Z\s]*$/.test(value)) {
10905
+ handleCardChange("cardName", value);
10906
+ }
10907
+ } }),
10908
+ (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10909
+ ] }),
10910
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
10911
+ /* @__PURE__ */ jsx34("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
10912
+ /* @__PURE__ */ jsx34("div", { className: "toggle-num-wrapper", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx34(
10913
+ FractalFields_default,
10619
10914
  {
10620
- xmlns: "http://www.w3.org/2000/svg",
10621
- width: "20",
10622
- height: "20",
10623
- viewBox: "0 0 20 20",
10624
- fill: "none",
10625
- children: [
10626
- /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10627
- /* @__PURE__ */ jsx32(
10628
- "path",
10629
- {
10630
- d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
10631
- fill: "#161616"
10632
- }
10633
- )
10634
- ]
10915
+ fractalStyles,
10916
+ tokenizerRef,
10917
+ isSky: true
10635
10918
  }
10636
- ) }),
10637
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
10638
- "If checked, I agree to give the ",
10639
- /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10640
- " permission to charge this credit card for agreed-upon purchases in the future."
10641
- ] }) })
10642
- ] })
10643
- ] }) })
10644
- ] }),
10645
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx32("button", { type: "submit", style: { margin: 0 }, className: "pay-button", children: partialAmount ? formatUSD((_f = Number(partialAmount)) == null ? void 0 : _f.toFixed(2)) : formatUSD((_g = Number(amount)) == null ? void 0 : _g.toFixed(2)) }) })
10646
- ] }) : /* @__PURE__ */ jsxs19("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10647
- if (e.key === "Enter" && loading) {
10648
- e.preventDefault();
10649
- e.stopPropagation();
10650
- }
10651
- }, children: [
10652
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10653
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10654
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10655
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10656
- const value = e.target.value;
10657
- if (/^[a-zA-Z\s]*$/.test(value)) {
10658
- handleCardChange("cardName", value);
10659
- }
10660
- } }),
10661
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10662
- ] }),
10663
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx32(
10664
- DataCapFields,
10665
- {
10666
- isOpen: show || autoTrigger,
10667
- tokenKey: dcToken,
10668
- setLoader: activeinCard === "form" ? setLoadingIframe : null
10669
- }
10670
- ) }),
10671
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10672
- /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10673
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_h = cardData == null ? void 0 : cardData.zipCode) != null ? _h : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
10674
- (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10919
+ ) })
10920
+ ] }),
10921
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
10922
+ /* @__PURE__ */ jsx34("label", { htmlFor: "zip", children: "ZIP" }),
10923
+ /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_g = cardData == null ? void 0 : cardData.zipCode) != null ? _g : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
10924
+ (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10925
+ ] }),
10926
+ customerId && /* @__PURE__ */ jsx34("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
10927
+ /* @__PURE__ */ jsx34(
10928
+ "input",
10929
+ {
10930
+ type: "checkbox",
10931
+ id: "save_card",
10932
+ className: "toggle-checkbox",
10933
+ checked: saveCardInfo,
10934
+ onChange: (e) => setSaveCardInfo(e.target.checked)
10935
+ }
10936
+ ),
10937
+ /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", className: "toggle-label" }),
10938
+ /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10939
+ /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
10940
+ /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
10941
+ "svg",
10942
+ {
10943
+ xmlns: "http://www.w3.org/2000/svg",
10944
+ width: "20",
10945
+ height: "20",
10946
+ viewBox: "0 0 20 20",
10947
+ fill: "none",
10948
+ children: [
10949
+ /* @__PURE__ */ jsx34("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10950
+ /* @__PURE__ */ jsx34(
10951
+ "path",
10952
+ {
10953
+ d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
10954
+ fill: "#161616"
10955
+ }
10956
+ )
10957
+ ]
10958
+ }
10959
+ ) }),
10960
+ /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
10961
+ "If checked, I agree to give the ",
10962
+ /* @__PURE__ */ jsx34("b", { children: merchantName || "merchant" }),
10963
+ " permission to charge this credit card for agreed-upon purchases in the future."
10964
+ ] }) })
10965
+ ] })
10966
+ ] }) })
10675
10967
  ] }),
10676
- customerId && /* @__PURE__ */ jsx32("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
10677
- /* @__PURE__ */ jsx32(
10678
- "input",
10968
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx34("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_h = Number(partialAmount)) == null ? void 0 : _h.toFixed(2)) : formatUSD((_i = Number(amount)) == null ? void 0 : _i.toFixed(2)) }) })
10969
+ ] }) : /* @__PURE__ */ jsxs20("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10970
+ if (e.key === "Enter" && loading) {
10971
+ e.preventDefault();
10972
+ e.stopPropagation();
10973
+ }
10974
+ }, children: [
10975
+ /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10976
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
10977
+ /* @__PURE__ */ jsx34("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10978
+ /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10979
+ const value = e.target.value;
10980
+ if (/^[a-zA-Z\s]*$/.test(value)) {
10981
+ handleCardChange("cardName", value);
10982
+ }
10983
+ } }),
10984
+ (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10985
+ ] }),
10986
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx34(
10987
+ DataCapFields,
10679
10988
  {
10680
- type: "checkbox",
10681
- id: "save_card",
10682
- className: "toggle-checkbox",
10683
- checked: saveCardInfo,
10684
- onChange: (e) => setSaveCardInfo(e.target.checked)
10989
+ isOpen: show || autoTrigger,
10990
+ tokenKey: dcToken,
10991
+ setLoader: activeinCard === "form" ? setLoadingIframe : null,
10992
+ isEmbedded: onSubmit ? true : false
10685
10993
  }
10686
- ),
10687
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10688
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10689
- /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10690
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10691
- "svg",
10994
+ ) }),
10995
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
10996
+ /* @__PURE__ */ jsx34("label", { htmlFor: "zip", children: "ZIP" }),
10997
+ /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_j = cardData == null ? void 0 : cardData.zipCode) != null ? _j : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
10998
+ (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10999
+ ] }),
11000
+ customerId && /* @__PURE__ */ jsx34("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
11001
+ /* @__PURE__ */ jsx34(
11002
+ "input",
10692
11003
  {
10693
- xmlns: "http://www.w3.org/2000/svg",
10694
- width: "20",
10695
- height: "20",
10696
- viewBox: "0 0 20 20",
10697
- fill: "none",
10698
- children: [
10699
- /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10700
- /* @__PURE__ */ jsx32(
10701
- "path",
10702
- {
10703
- d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
10704
- fill: "#161616"
10705
- }
10706
- )
10707
- ]
11004
+ type: "checkbox",
11005
+ id: "save_card",
11006
+ className: "toggle-checkbox",
11007
+ checked: saveCardInfo,
11008
+ onChange: (e) => setSaveCardInfo(e.target.checked)
10708
11009
  }
10709
- ) }),
10710
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
10711
- "If checked, I agree to give the ",
10712
- /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10713
- " permission to charge this credit card for agreed-upon purchases in the future."
10714
- ] }) })
10715
- ] })
10716
- ] }) })
10717
- ] }),
10718
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx32("button", { type: "submit", style: { margin: 0 }, className: "pay-button", children: partialAmount ? formatUSD((_i = Number(partialAmount)) == null ? void 0 : _i.toFixed(2)) : formatUSD((_j = Number(amount)) == null ? void 0 : _j.toFixed(2)) }) })
10719
- ] })
10720
- ] }),
10721
- /* @__PURE__ */ jsx32("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs19(Fragment18, { children: [
10722
- /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10723
- /* @__PURE__ */ jsx32("div", { className: "frac-backarrow", children: (bankList == null ? void 0 : bankList.length) > 0 && activeinBank === "form" && /* @__PURE__ */ jsxs19("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinBank("list"), children: [
10724
- " ",
10725
- /* @__PURE__ */ jsx32(IoArrowBack4, {})
10726
- ] }) }),
10727
- /* @__PURE__ */ jsx32("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
11010
+ ),
11011
+ /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", className: "toggle-label" }),
11012
+ /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", children: "Save card for future payments " }),
11013
+ /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
11014
+ /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
11015
+ "svg",
11016
+ {
11017
+ xmlns: "http://www.w3.org/2000/svg",
11018
+ width: "20",
11019
+ height: "20",
11020
+ viewBox: "0 0 20 20",
11021
+ fill: "none",
11022
+ children: [
11023
+ /* @__PURE__ */ jsx34("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
11024
+ /* @__PURE__ */ jsx34(
11025
+ "path",
11026
+ {
11027
+ d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
11028
+ fill: "#161616"
11029
+ }
11030
+ )
11031
+ ]
11032
+ }
11033
+ ) }),
11034
+ /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
11035
+ "If checked, I agree to give the ",
11036
+ /* @__PURE__ */ jsx34("b", { children: merchantName || "merchant" }),
11037
+ " permission to charge this credit card for agreed-upon purchases in the future."
11038
+ ] }) })
11039
+ ] })
11040
+ ] }) })
11041
+ ] }),
11042
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx34("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_k = Number(partialAmount)) == null ? void 0 : _k.toFixed(2)) : formatUSD((_l = Number(amount)) == null ? void 0 : _l.toFixed(2)) }) })
11043
+ ] })
10728
11044
  ] }),
10729
- activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10730
- /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
10731
- setActiveinBank("form");
10732
- } }),
10733
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", style: { padding: "0" }, children: /* @__PURE__ */ jsx32("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: formatUSD((_k = Number(bankAmount)) == null ? void 0 : _k.toFixed(2)) }) })
10734
- ] }) : /* @__PURE__ */ jsxs19("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
10735
- if (e.key === "Enter" && loading) {
10736
- e.preventDefault();
10737
- e.stopPropagation();
10738
- }
10739
- }, children: [
10740
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: {
10741
- minHeight: "444px",
10742
- maxHeight: "444px"
11045
+ /* @__PURE__ */ jsx34("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs20(Fragment19, { children: [
11046
+ !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
11047
+ /* @__PURE__ */ jsx34("div", { className: "frac-backarrow", children: (bankList == null ? void 0 : bankList.length) > 0 && activeinBank === "form" && /* @__PURE__ */ jsxs20("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinBank("list"), children: [
11048
+ " ",
11049
+ /* @__PURE__ */ jsx34(IoArrowBack4, {})
11050
+ ] }) }),
11051
+ /* @__PURE__ */ jsx34("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
11052
+ ] }),
11053
+ activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
11054
+ /* @__PURE__ */ jsx34(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
11055
+ setActiveinBank("form");
11056
+ } }),
11057
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { padding: "0" }, children: /* @__PURE__ */ jsx34("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: formatUSD((_m = Number(bankAmount)) == null ? void 0 : _m.toFixed(2)) }) })
11058
+ ] }) : /* @__PURE__ */ jsxs20("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
11059
+ if (e.key === "Enter" && loading) {
11060
+ e.preventDefault();
11061
+ e.stopPropagation();
11062
+ }
10743
11063
  }, children: [
10744
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10745
- /* @__PURE__ */ jsx32("label", { htmlFor: "nameonaccount", children: "Name on account" }),
10746
- /* @__PURE__ */ jsx32("input", { type: "text", id: "nameonaccount", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", name: "name", value: (_l = achData == null ? void 0 : achData.name) != null ? _l : "", onChange: handleChangeAch }),
10747
- (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
10748
- ] }),
10749
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10750
- /* @__PURE__ */ jsx32("label", { htmlFor: "routingnumber", children: "Routing number" }),
10751
- /* @__PURE__ */ jsx32(
10752
- "input",
10753
- {
10754
- type: "text",
10755
- id: "routingnumber",
10756
- className: "form-control-frac",
10757
- maxLength: 9,
10758
- placeholder: "000000000",
10759
- name: "routingNumber",
10760
- value: (_m = achData == null ? void 0 : achData.routingNumber) != null ? _m : "",
10761
- onChange: handleChangeAch
10762
- }
10763
- ),
10764
- (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
10765
- ] }),
10766
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10767
- /* @__PURE__ */ jsx32("label", { htmlFor: "accountnumber", children: "Account number" }),
10768
- /* @__PURE__ */ jsx32(
10769
- "input",
10770
- {
10771
- type: "text",
10772
- id: "accountnumber",
10773
- className: "form-control-frac",
10774
- maxLength: 16,
10775
- placeholder: "0000000000",
10776
- name: "accountNumber",
10777
- value: (_n = achData == null ? void 0 : achData.accountNumber) != null ? _n : "",
10778
- onChange: handleChangeAch
10779
- }
10780
- ),
10781
- (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
10782
- ] }),
10783
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10784
- /* @__PURE__ */ jsx32("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
10785
- /* @__PURE__ */ jsx32(
10786
- "input",
10787
- {
10788
- type: "text",
10789
- id: "confirmaccountnumber",
10790
- className: "form-control-frac",
10791
- maxLength: 16,
10792
- placeholder: "0000000000",
10793
- name: "confirmAccountNumber",
10794
- value: (_o = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _o : "",
10795
- onChange: handleChangeAch
10796
- }
10797
- ),
10798
- (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
10799
- ] }),
10800
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10801
- /* @__PURE__ */ jsx32("label", { htmlFor: "bankname", children: "Bank name" }),
10802
- /* @__PURE__ */ jsx32(
10803
- "input",
10804
- {
10805
- type: "text",
10806
- id: "bankname",
10807
- className: "form-control-frac",
10808
- maxLength: 100,
10809
- placeholder: "My Bank",
10810
- name: "bankName",
10811
- value: (_p = achData == null ? void 0 : achData.bankName) != null ? _p : "",
10812
- onChange: handleChangeAch
10813
- }
10814
- ),
10815
- (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
10816
- ] }),
10817
- ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10818
- /* @__PURE__ */ jsx32("label", { htmlFor: "companyName", children: "Company name" }),
10819
- /* @__PURE__ */ jsx32(
10820
- "input",
10821
- {
10822
- type: "text",
10823
- id: "companyName",
10824
- className: "form-control-frac",
10825
- maxLength: 100,
10826
- placeholder: "My Company",
10827
- name: "companyName",
10828
- value: (_q = achData == null ? void 0 : achData.companyName) != null ? _q : "",
10829
- onChange: handleChangeAch
10830
- }
10831
- ),
10832
- (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
10833
- ] }),
10834
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10835
- /* @__PURE__ */ jsx32("label", { htmlFor: "accounttype", children: "Select account type" }),
10836
- /* @__PURE__ */ jsxs19("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_r = achData == null ? void 0 : achData.accountType) != null ? _r : "", onChange: handleChangeAch, children: [
10837
- /* @__PURE__ */ jsx32("option", { value: "", children: "Select account" }),
10838
- accountTypes.map((type) => /* @__PURE__ */ jsx32("option", { value: type.value, children: type.label }, type.value))
11064
+ /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: {
11065
+ minHeight: "444px",
11066
+ maxHeight: "444px"
11067
+ }, children: [
11068
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11069
+ /* @__PURE__ */ jsx34("label", { htmlFor: "nameonaccount", children: "Name on account" }),
11070
+ /* @__PURE__ */ jsx34("input", { type: "text", id: "nameonaccount", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", name: "name", value: (_n = achData == null ? void 0 : achData.name) != null ? _n : "", onChange: handleChangeAch }),
11071
+ (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
11072
+ ] }),
11073
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11074
+ /* @__PURE__ */ jsx34("label", { htmlFor: "routingnumber", children: "Routing number" }),
11075
+ /* @__PURE__ */ jsx34(
11076
+ "input",
11077
+ {
11078
+ type: "text",
11079
+ id: "routingnumber",
11080
+ className: "form-control-frac",
11081
+ maxLength: 9,
11082
+ placeholder: "000000000",
11083
+ name: "routingNumber",
11084
+ value: (_o = achData == null ? void 0 : achData.routingNumber) != null ? _o : "",
11085
+ onChange: handleChangeAch
11086
+ }
11087
+ ),
11088
+ (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
11089
+ ] }),
11090
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11091
+ /* @__PURE__ */ jsx34("label", { htmlFor: "accountnumber", children: "Account number" }),
11092
+ /* @__PURE__ */ jsx34(
11093
+ "input",
11094
+ {
11095
+ type: "text",
11096
+ id: "accountnumber",
11097
+ className: "form-control-frac",
11098
+ maxLength: 16,
11099
+ placeholder: "0000000000",
11100
+ name: "accountNumber",
11101
+ value: (_p = achData == null ? void 0 : achData.accountNumber) != null ? _p : "",
11102
+ onChange: handleChangeAch
11103
+ }
11104
+ ),
11105
+ (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
11106
+ ] }),
11107
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11108
+ /* @__PURE__ */ jsx34("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
11109
+ /* @__PURE__ */ jsx34(
11110
+ "input",
11111
+ {
11112
+ type: "text",
11113
+ id: "confirmaccountnumber",
11114
+ className: "form-control-frac",
11115
+ maxLength: 16,
11116
+ placeholder: "0000000000",
11117
+ name: "confirmAccountNumber",
11118
+ value: (_q = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _q : "",
11119
+ onChange: handleChangeAch
11120
+ }
11121
+ ),
11122
+ (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
11123
+ ] }),
11124
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11125
+ /* @__PURE__ */ jsx34("label", { htmlFor: "bankname", children: "Bank name" }),
11126
+ /* @__PURE__ */ jsx34(
11127
+ "input",
11128
+ {
11129
+ type: "text",
11130
+ id: "bankname",
11131
+ className: "form-control-frac",
11132
+ maxLength: 100,
11133
+ placeholder: "My Bank",
11134
+ name: "bankName",
11135
+ value: (_r = achData == null ? void 0 : achData.bankName) != null ? _r : "",
11136
+ onChange: handleChangeAch
11137
+ }
11138
+ ),
11139
+ (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
11140
+ ] }),
11141
+ ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11142
+ /* @__PURE__ */ jsx34("label", { htmlFor: "companyName", children: "Company name" }),
11143
+ /* @__PURE__ */ jsx34(
11144
+ "input",
11145
+ {
11146
+ type: "text",
11147
+ id: "companyName",
11148
+ className: "form-control-frac",
11149
+ maxLength: 100,
11150
+ placeholder: "My Company",
11151
+ name: "companyName",
11152
+ value: (_s = achData == null ? void 0 : achData.companyName) != null ? _s : "",
11153
+ onChange: handleChangeAch
11154
+ }
11155
+ ),
11156
+ (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
11157
+ ] }),
11158
+ /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11159
+ /* @__PURE__ */ jsx34("label", { htmlFor: "accounttype", children: "Select account type" }),
11160
+ /* @__PURE__ */ jsxs20("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_t = achData == null ? void 0 : achData.accountType) != null ? _t : "", onChange: handleChangeAch, children: [
11161
+ /* @__PURE__ */ jsx34("option", { value: "", children: "Select account" }),
11162
+ accountTypes.map((type) => /* @__PURE__ */ jsx34("option", { value: type.value, children: type.label }, type.value))
11163
+ ] })
11164
+ ] }),
11165
+ customerId && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
11166
+ /* @__PURE__ */ jsx34("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
11167
+ /* @__PURE__ */ jsx34("label", { className: "saveachlabel", htmlFor: "saveACH", children: `By selecting this box, I authorize SkyFi, on behalf of ${merchantName || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
10839
11168
  ] })
10840
11169
  ] }),
10841
- customerId && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
10842
- /* @__PURE__ */ jsx32("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
10843
- /* @__PURE__ */ jsx32("label", { className: "saveachlabel", htmlFor: "saveACH", children: `By selecting this box, I authorize SkyFi, on behalf of ${merchantName || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
10844
- ] })
10845
- ] }),
10846
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac ", children: /* @__PURE__ */ jsx32("button", { className: "pay-button", style: { margin: "20px 0 0" }, type: "submit", children: formatUSD((_s = Number(bankAmount)) == null ? void 0 : _s.toFixed(2)) }) })
10847
- ] })
10848
- ] }) })
10849
- ] }) }) }) })
11170
+ /* @__PURE__ */ jsx34("div", { className: "form-group-frac ", children: /* @__PURE__ */ jsx34("button", { className: "pay-button", style: { margin: "20px 0 0", display: onSubmit ? "none" : "block" }, type: "submit", children: formatUSD((_u = Number(bankAmount)) == null ? void 0 : _u.toFixed(2)) }) })
11171
+ ] })
11172
+ ] }) })
11173
+ ] })
11174
+ ] }) }) })
10850
11175
  ] })
10851
11176
  ] })
10852
11177
  ] })
@@ -10857,7 +11182,7 @@ var ModelContentSky_default = ModelContentSky;
10857
11182
 
10858
11183
  // src/app/components/Skysystemz/PayButtonWithForm.tsx
10859
11184
  import axios10 from "axios";
10860
- import { Fragment as Fragment19, jsx as jsx33, jsxs as jsxs20 } from "react/jsx-runtime";
11185
+ import { Fragment as Fragment20, jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
10861
11186
  var PaymentWidget = ({
10862
11187
  amount,
10863
11188
  bankAmount,
@@ -10968,19 +11293,19 @@ var PaymentWidget = ({
10968
11293
  getskyosOrderDetails();
10969
11294
  }
10970
11295
  }, [show, isPartial, partialRef]);
10971
- return /* @__PURE__ */ jsxs20(Fragment19, { children: [
10972
- /* @__PURE__ */ jsx33("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
10973
- /* @__PURE__ */ jsx33(DataScript, {}),
10974
- /* @__PURE__ */ jsx33(FractalTokenizerScript, {}),
10975
- /* @__PURE__ */ jsx33(SkyChargewidgetstyles, {}),
10976
- /* @__PURE__ */ jsx33(CardBankRadioStyles, {}),
10977
- /* @__PURE__ */ jsx33(CustomModal2styles_default, {}),
10978
- /* @__PURE__ */ jsx33(DataCapScriptLoader, {}),
10979
- !autoTrigger && /* @__PURE__ */ jsxs20("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
11296
+ return /* @__PURE__ */ jsxs21(Fragment20, { children: [
11297
+ /* @__PURE__ */ jsx35("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
11298
+ /* @__PURE__ */ jsx35(DataScript, {}),
11299
+ /* @__PURE__ */ jsx35(FractalTokenizerScript, {}),
11300
+ /* @__PURE__ */ jsx35(SkyChargewidgetstyles, {}),
11301
+ /* @__PURE__ */ jsx35(CardBankRadioStyles, {}),
11302
+ /* @__PURE__ */ jsx35(CustomModal2styles_default, {}),
11303
+ /* @__PURE__ */ jsx35(DataCapScriptLoader, {}),
11304
+ !autoTrigger && /* @__PURE__ */ jsxs21("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
10980
11305
  submitBtnText,
10981
11306
  submitBtnIcon
10982
11307
  ] }),
10983
- !autoTrigger ? /* @__PURE__ */ jsx33(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx33(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx33(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
11308
+ !autoTrigger ? /* @__PURE__ */ jsx35(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx35(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx35(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
10984
11309
  ] });
10985
11310
  };
10986
11311
  export {