@fractalpay/fractalpay-next-dev 0.0.234 → 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 +691 -368
  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.234",
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,11 +1715,9 @@ function Chargewidgetstyles() {
1697
1715
  .frac-form .save-ach-div{
1698
1716
  display:flex !important;
1699
1717
  gap:5px !important;
1700
- align-items:start;
1701
- }
1702
- .save-ach-div label{
1703
- margin-top: -4px;
1718
+ align-items:center
1704
1719
  }
1720
+
1705
1721
  .frac-form .card-cvv-in{
1706
1722
  height : 36px !importantt;
1707
1723
  }
@@ -2908,7 +2924,7 @@ function ErrorCardMszStyle() {
2908
2924
 
2909
2925
  // src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
2910
2926
  import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
2911
- var ErrorCardMessage = ({ onClose, error }) => {
2927
+ var ErrorCardMessage = ({ onClose, error, autoTrigger = false }) => {
2912
2928
  return /* @__PURE__ */ jsxs6(Fragment6, { children: [
2913
2929
  /* @__PURE__ */ jsx12(ErrorCardMszStyle, {}),
2914
2930
  /* @__PURE__ */ jsx12("div", { className: "card-error", children: /* @__PURE__ */ jsx12("div", { className: "payment-error-container", children: /* @__PURE__ */ jsxs6("div", { className: "error-icon", children: [
@@ -2917,7 +2933,7 @@ var ErrorCardMessage = ({ onClose, error }) => {
2917
2933
  /* @__PURE__ */ jsx12("div", { className: "payment-error-text", children: error }),
2918
2934
  /* @__PURE__ */ jsx12("div", { className: "thank-you-text", children: "Try again later " })
2919
2935
  ] }),
2920
- /* @__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" }) })
2921
2937
  ] }) }) })
2922
2938
  ] });
2923
2939
  };
@@ -2934,14 +2950,26 @@ var socketClient_default = socket;
2934
2950
 
2935
2951
  // src/app/components/Atoms/CardBankRadio/CardBankRadio.tsx
2936
2952
  import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
2937
- var CardBankRadio = (props) => {
2938
- 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(
2939
2956
  "div",
2940
2957
  {
2941
2958
  className: `frac-card-bank-radio ${props.activetab === props.value ? "frac-active" : ""}`,
2942
2959
  onClick: () => props.onChange(props.value),
2943
2960
  role: "radio",
2944
- 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: [
2945
2973
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-title-main", children: [
2946
2974
  /* @__PURE__ */ jsx13("img", { src: props.label.toLowerCase() === "card" ? defaultcard : props.label.toLowerCase() === "reader" ? pax : bankNew, className: "frac-payment-type-logo", alt: "" }),
2947
2975
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-label", children: [
@@ -2952,7 +2980,7 @@ var CardBankRadio = (props) => {
2952
2980
  /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13("input", { name: "paymenttype", checked: props.activetab === props.value, type: "radio", value: props.value, onChange: (e) => {
2953
2981
  props.onChange(e.target.value);
2954
2982
  } }) })
2955
- ]
2983
+ ] })
2956
2984
  }
2957
2985
  ) });
2958
2986
  };
@@ -3359,7 +3387,8 @@ var DataCapFields = ({
3359
3387
  isOpen,
3360
3388
  tokenKey,
3361
3389
  setLoader,
3362
- isAddCard
3390
+ isAddCard,
3391
+ isEmbedded
3363
3392
  }) => {
3364
3393
  const iframeId = "datacap-iframe";
3365
3394
  const resolverRef = useRef2(null);
@@ -3385,6 +3414,20 @@ var DataCapFields = ({
3385
3414
 
3386
3415
  `;
3387
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
+ }
3388
3431
  const initialize = async () => {
3389
3432
  setLoader == null ? void 0 : setLoader(true);
3390
3433
  setIframeReady(false);
@@ -3423,6 +3466,7 @@ var DataCapFields = ({
3423
3466
  window.DatacapHostedWebToken.requestToken();
3424
3467
  });
3425
3468
  };
3469
+ console.log(setLoader, "loadingIframe");
3426
3470
  return /* @__PURE__ */ jsx18(
3427
3471
  "iframe",
3428
3472
  {
@@ -4605,8 +4649,13 @@ function GetPaymentPage(props) {
4605
4649
  ] }),
4606
4650
  (props == null ? void 0 : props.customerId) && /* @__PURE__ */ jsxs11("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" }, children: [
4607
4651
  /* @__PURE__ */ jsx19("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
4608
- /* @__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.` })
4609
- ] })
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
+ ] }) })
4610
4659
  ] }),
4611
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)) }) })
4612
4661
  ] })
@@ -8523,8 +8572,13 @@ function PartialPayment(props) {
8523
8572
  ] }),
8524
8573
  (props == null ? void 0 : props.customerId) && /* @__PURE__ */ jsxs17("div", { className: "form-group mb-4 save-ach-div", style: { paddingTop: "5px" }, children: [
8525
8574
  /* @__PURE__ */ jsx28("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
8526
- /* @__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.` })
8527
- ] })
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
+ ] }) })
8528
8582
  ] }),
8529
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)) }) })
8530
8584
  ] })
@@ -9476,10 +9530,162 @@ function CheckoutWrapper({ clientSecret, onSuccess, showLoader, setError, sessio
9476
9530
  // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
9477
9531
  import { IoArrowBack as IoArrowBack4 } from "react-icons/io5";
9478
9532
  import { NumericFormat as NumericFormat2 } from "react-number-format";
9479
- import { Fragment as Fragment18, jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
9480
- 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 }) => {
9481
- 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;
9482
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);
9483
9689
  const cardListRunRef = useRef10(false);
9484
9690
  const threeDSContainerRef = useRef10(null);
9485
9691
  const [activetab, setActive] = useState10("card");
@@ -9530,6 +9736,10 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9530
9736
  let pax2 = S3Url + "widget/pax.svg";
9531
9737
  let cardicon = S3Url + "widget/cardicon.svg";
9532
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";
9533
9743
  const showLoader = () => setLoading(true);
9534
9744
  const hideLoader = () => setLoading(false);
9535
9745
  const CalculateCashDiscount = (amount2, surcharge2) => {
@@ -9743,7 +9953,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9743
9953
  }
9744
9954
  };
9745
9955
  const handleFractalTokenFlow = async () => {
9746
- 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;
9747
9957
  try {
9748
9958
  const requestOptions = {
9749
9959
  method: "POST",
@@ -9814,7 +10024,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9814
10024
  const errorText = typeof rawError === "string" ? rawError : JSON.stringify(rawError);
9815
10025
  const lines = ((_s2 = (_r2 = errorText.split) == null ? void 0 : _r2.call(errorText, "\n")) == null ? void 0 : _s2.filter(Boolean)) || [];
9816
10026
  const lastLine = lines.at(-1) || "";
9817
- const parts = (_t = lastLine.split) == null ? void 0 : _t.call(lastLine, ": ");
10027
+ const parts = (_t2 = lastLine.split) == null ? void 0 : _t2.call(lastLine, ": ");
9818
10028
  readableMessage = (parts == null ? void 0 : parts.length) > 1 ? parts.pop().trim() : lastLine.trim() || readableMessage;
9819
10029
  } catch (e) {
9820
10030
  readableMessage = "Something went wrong!";
@@ -9822,7 +10032,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9822
10032
  setError(readableMessage);
9823
10033
  callback({
9824
10034
  error: readableMessage,
9825
- 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,
9826
10036
  statusCode: (_w = error2 == null ? void 0 : error2.response) == null ? void 0 : _w.status
9827
10037
  });
9828
10038
  }
@@ -10238,8 +10448,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10238
10448
  });
10239
10449
  };
10240
10450
  const handlechargeCustomer = async (e) => {
10241
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
10242
- e.currentTarget.blur();
10451
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2;
10452
+ e == null ? void 0 : e.currentTarget.blur();
10243
10453
  if (loading) return;
10244
10454
  let customer_id = customerId;
10245
10455
  let card_id = selectedCard == null ? void 0 : selectedCard.id;
@@ -10286,7 +10496,6 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10286
10496
  statusCode: (_g2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _g2.status
10287
10497
  });
10288
10498
  hideLoader();
10289
- setError(((_i2 = (_h2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _h2.data) == null ? void 0 : _i2.message) || "Something went wrong!");
10290
10499
  }
10291
10500
  } else {
10292
10501
  setError("Please Select A Card/Bank");
@@ -10368,13 +10577,13 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10368
10577
  }
10369
10578
  }, [show, autoTrigger]);
10370
10579
  useEffect15(() => {
10371
- if (!hasRunRef.current && (show || autoTrigger)) {
10580
+ if (!hasRunRef.current && (show || autoTrigger) && onLoad) {
10372
10581
  getPaymentDetails();
10373
10582
  if (isPartial && !partialRef) {
10374
10583
  crateOrderFrac();
10375
10584
  }
10376
10585
  }
10377
- }, [show, autoTrigger, isPartial]);
10586
+ }, [show, autoTrigger, isPartial, onLoad]);
10378
10587
  useEffect15(() => {
10379
10588
  if ((show || autoTrigger) && pass_fee_amount) {
10380
10589
  let cashdisc = Number(amount) - Number(pass_fee_amount);
@@ -10462,17 +10671,92 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10462
10671
  });
10463
10672
  }, []);
10464
10673
  console.log(activeinCard === "list", "activeinCard", activeList);
10465
- return /* @__PURE__ */ jsxs19(Fragment18, { children: [
10466
- initialLoader && /* @__PURE__ */ jsx32(Loader_default, { loading: initialLoader }),
10467
- error && /* @__PURE__ */ jsx32("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx32(ErrorCardMessage_default, { error, onClose: handleClose }) }),
10468
- 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: () => {
10469
10753
  setErrorIframe("");
10470
- } }) }),
10471
- !error && !errorIframe && /* @__PURE__ */ jsxs19(Fragment18, { children: [
10472
- (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx32(Loader_default, { loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
10473
- /* @__PURE__ */ jsxs19("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
10474
- /* @__PURE__ */ jsx32("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
10475
- (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(
10476
10760
  ThreeDSChallenge,
10477
10761
  {
10478
10762
  containerRef: threeDSContainerRef,
@@ -10482,40 +10766,40 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10482
10766
  onSuccess: handleSuccess,
10483
10767
  onError: handleError
10484
10768
  }
10485
- ) : /* @__PURE__ */ jsxs19("div", { className: "parent-pay-container", children: [
10486
- /* @__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: [
10487
- /* @__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" }) }),
10488
- /* @__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" }) }) })
10489
10773
  ] }) }),
10490
- /* @__PURE__ */ jsx32("div", { className: "pay-main-logo-res" }),
10491
- /* @__PURE__ */ jsxs19("div", { className: "pay-container", children: [
10492
- /* @__PURE__ */ jsxs19("div", { className: "pay-header pay-conatiner-one", children: [
10493
- /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-first", children: [
10494
- /* @__PURE__ */ jsxs19("div", { className: "pay-logo-container", children: [
10495
- /* @__PURE__ */ jsx32("div", { className: "pay-main-logo" }),
10496
- /* @__PURE__ */ jsx32("h1", { className: "pay-heading", children: "Pay" }),
10497
- (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: [
10498
10782
  " ",
10499
- /* @__PURE__ */ jsx32(IoArrowBack4, {}),
10783
+ /* @__PURE__ */ jsx34(IoArrowBack4, {}),
10500
10784
  " Back"
10501
10785
  ] })
10502
10786
  ] }),
10503
- /* @__PURE__ */ jsx32("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs19("div", { className: "pay-amount-conatiner", children: [
10504
- /* @__PURE__ */ jsx32("small", { className: "pay-payment-amount", children: "Select payment type" }),
10505
- /* @__PURE__ */ jsxs19("div", { className: "frac-card-bank-radio-main", children: [
10506
- /* @__PURE__ */ jsx32(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10507
- !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 })
10508
10792
  ] }),
10509
- pass_fee && activetab === "card" && cashDiscount && Number(amount) - Number(cashDiscount) > 0 ? /* @__PURE__ */ jsxs19("div", { className: "frac-cash-discount-fee", children: [
10510
- /* @__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: [
10511
10795
  activetab === "card" ? "Cash Discount" : "Cash Discount Savings",
10512
10796
  " "
10513
10797
  ] }),
10514
- /* @__PURE__ */ jsx32("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10798
+ /* @__PURE__ */ jsx34("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10515
10799
  ] }) : null,
10516
- isPartial && /* @__PURE__ */ jsxs19("div", { className: "frac-partial-payment-input", children: [
10517
- /* @__PURE__ */ jsx32("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10518
- /* @__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(
10519
10803
  NumericFormat2,
10520
10804
  {
10521
10805
  prefix: "$",
@@ -10539,316 +10823,355 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10539
10823
  }
10540
10824
  }
10541
10825
  ),
10542
- partialError && /* @__PURE__ */ jsx32("span", { className: "error-span", children: partialError })
10826
+ partialError && /* @__PURE__ */ jsx34("span", { className: "error-span", children: partialError })
10543
10827
  ] })
10544
10828
  ] }) })
10545
10829
  ] }),
10546
- /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-last", children: [
10547
- /* @__PURE__ */ jsx32("img", { src: secure2, alt: "" }),
10548
- /* @__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: "" }),
10549
10833
  "Secure payments powered by Fractal"
10550
10834
  ] })
10551
10835
  ] }),
10552
- /* @__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: [
10553
- /* @__PURE__ */ jsxs19("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
10554
- /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10555
- /* @__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: [
10556
- " ",
10557
- /* @__PURE__ */ jsx32(IoArrowBack4, {})
10558
- ] }) }),
10559
- /* @__PURE__ */ jsx32("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
10560
- ] }),
10561
- /* @__PURE__ */ jsxs19("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
10562
- /* @__PURE__ */ jsx32("img", { src: visa2, alt: "", width: 33 }),
10563
- /* @__PURE__ */ jsx32("img", { src: mastercard2, width: 33, alt: "" }),
10564
- /* @__PURE__ */ jsx32("img", { src: americanexp2, alt: "", width: 33 }),
10565
- /* @__PURE__ */ jsx32("img", { src: discover2, width: 33, alt: "" })
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 })
10566
10841
  ] }),
10567
- activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10568
- /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
10569
- setActiveinCard("form");
10570
- } }),
10571
- /* @__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)) }) })
10572
- ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs19("form", { id: "paymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10573
- if (e.key === "Enter" && loading) {
10574
- e.preventDefault();
10575
- e.stopPropagation();
10576
- }
10577
- }, children: [
10578
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10579
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10580
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10581
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10582
- const value = e.target.value;
10583
- if (/^[a-zA-Z\s]*$/.test(value)) {
10584
- handleCardChange("cardName", value);
10585
- }
10586
- } }),
10587
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10588
- ] }),
10589
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10590
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
10591
- /* @__PURE__ */ jsx32("div", { className: "toggle-num-wrapper", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx32(
10592
- FractalFields_default,
10593
- {
10594
- fractalStyles,
10595
- tokenizerRef,
10596
- isSky: true
10597
- }
10598
- ) })
10599
- ] }),
10600
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10601
- /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10602
- /* @__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) }),
10603
- (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" })
10604
10880
  ] }),
10605
- 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: [
10606
- /* @__PURE__ */ jsx32(
10607
- "input",
10608
- {
10609
- type: "checkbox",
10610
- id: "save_card",
10611
- className: "toggle-checkbox",
10612
- checked: saveCardInfo,
10613
- onChange: (e) => setSaveCardInfo(e.target.checked)
10614
- }
10615
- ),
10616
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10617
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10618
- /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10619
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10620
- "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,
10621
10914
  {
10622
- xmlns: "http://www.w3.org/2000/svg",
10623
- width: "20",
10624
- height: "20",
10625
- viewBox: "0 0 20 20",
10626
- fill: "none",
10627
- children: [
10628
- /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10629
- /* @__PURE__ */ jsx32(
10630
- "path",
10631
- {
10632
- 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",
10633
- fill: "#161616"
10634
- }
10635
- )
10636
- ]
10915
+ fractalStyles,
10916
+ tokenizerRef,
10917
+ isSky: true
10637
10918
  }
10638
- ) }),
10639
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
10640
- "If checked, I agree to give the ",
10641
- /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10642
- " permission to charge this credit card for agreed-upon purchases in the future."
10643
- ] }) })
10644
- ] })
10645
- ] }) })
10646
- ] }),
10647
- /* @__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)) }) })
10648
- ] }) : /* @__PURE__ */ jsxs19("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10649
- if (e.key === "Enter" && loading) {
10650
- e.preventDefault();
10651
- e.stopPropagation();
10652
- }
10653
- }, children: [
10654
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10655
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10656
- /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10657
- /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10658
- const value = e.target.value;
10659
- if (/^[a-zA-Z\s]*$/.test(value)) {
10660
- handleCardChange("cardName", value);
10661
- }
10662
- } }),
10663
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10664
- ] }),
10665
- /* @__PURE__ */ jsx32("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx32(
10666
- DataCapFields,
10667
- {
10668
- isOpen: show || autoTrigger,
10669
- tokenKey: dcToken,
10670
- setLoader: activeinCard === "form" ? setLoadingIframe : null
10671
- }
10672
- ) }),
10673
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10674
- /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10675
- /* @__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) }),
10676
- (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
+ ] }) })
10677
10967
  ] }),
10678
- 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: [
10679
- /* @__PURE__ */ jsx32(
10680
- "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,
10681
10988
  {
10682
- type: "checkbox",
10683
- id: "save_card",
10684
- className: "toggle-checkbox",
10685
- checked: saveCardInfo,
10686
- onChange: (e) => setSaveCardInfo(e.target.checked)
10989
+ isOpen: show || autoTrigger,
10990
+ tokenKey: dcToken,
10991
+ setLoader: activeinCard === "form" ? setLoadingIframe : null,
10992
+ isEmbedded: onSubmit ? true : false
10687
10993
  }
10688
- ),
10689
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10690
- /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10691
- /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10692
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10693
- "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",
10694
11003
  {
10695
- xmlns: "http://www.w3.org/2000/svg",
10696
- width: "20",
10697
- height: "20",
10698
- viewBox: "0 0 20 20",
10699
- fill: "none",
10700
- children: [
10701
- /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10702
- /* @__PURE__ */ jsx32(
10703
- "path",
10704
- {
10705
- 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",
10706
- fill: "#161616"
10707
- }
10708
- )
10709
- ]
11004
+ type: "checkbox",
11005
+ id: "save_card",
11006
+ className: "toggle-checkbox",
11007
+ checked: saveCardInfo,
11008
+ onChange: (e) => setSaveCardInfo(e.target.checked)
10710
11009
  }
10711
- ) }),
10712
- /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
10713
- "If checked, I agree to give the ",
10714
- /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10715
- " permission to charge this credit card for agreed-upon purchases in the future."
10716
- ] }) })
10717
- ] })
10718
- ] }) })
10719
- ] }),
10720
- /* @__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)) }) })
10721
- ] })
10722
- ] }),
10723
- /* @__PURE__ */ jsx32("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs19(Fragment18, { children: [
10724
- /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10725
- /* @__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: [
10726
- " ",
10727
- /* @__PURE__ */ jsx32(IoArrowBack4, {})
10728
- ] }) }),
10729
- /* @__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
+ ] })
10730
11044
  ] }),
10731
- activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10732
- /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
10733
- setActiveinBank("form");
10734
- } }),
10735
- /* @__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)) }) })
10736
- ] }) : /* @__PURE__ */ jsxs19("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
10737
- if (e.key === "Enter" && loading) {
10738
- e.preventDefault();
10739
- e.stopPropagation();
10740
- }
10741
- }, children: [
10742
- /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: {
10743
- minHeight: "444px",
10744
- 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
+ }
10745
11063
  }, children: [
10746
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10747
- /* @__PURE__ */ jsx32("label", { htmlFor: "nameonaccount", children: "Name on account" }),
10748
- /* @__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 }),
10749
- (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
10750
- ] }),
10751
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10752
- /* @__PURE__ */ jsx32("label", { htmlFor: "routingnumber", children: "Routing number" }),
10753
- /* @__PURE__ */ jsx32(
10754
- "input",
10755
- {
10756
- type: "text",
10757
- id: "routingnumber",
10758
- className: "form-control-frac",
10759
- maxLength: 9,
10760
- placeholder: "000000000",
10761
- name: "routingNumber",
10762
- value: (_m = achData == null ? void 0 : achData.routingNumber) != null ? _m : "",
10763
- onChange: handleChangeAch
10764
- }
10765
- ),
10766
- (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
10767
- ] }),
10768
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10769
- /* @__PURE__ */ jsx32("label", { htmlFor: "accountnumber", children: "Account number" }),
10770
- /* @__PURE__ */ jsx32(
10771
- "input",
10772
- {
10773
- type: "text",
10774
- id: "accountnumber",
10775
- className: "form-control-frac",
10776
- maxLength: 16,
10777
- placeholder: "0000000000",
10778
- name: "accountNumber",
10779
- value: (_n = achData == null ? void 0 : achData.accountNumber) != null ? _n : "",
10780
- onChange: handleChangeAch
10781
- }
10782
- ),
10783
- (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
10784
- ] }),
10785
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10786
- /* @__PURE__ */ jsx32("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
10787
- /* @__PURE__ */ jsx32(
10788
- "input",
10789
- {
10790
- type: "text",
10791
- id: "confirmaccountnumber",
10792
- className: "form-control-frac",
10793
- maxLength: 16,
10794
- placeholder: "0000000000",
10795
- name: "confirmAccountNumber",
10796
- value: (_o = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _o : "",
10797
- onChange: handleChangeAch
10798
- }
10799
- ),
10800
- (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
10801
- ] }),
10802
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10803
- /* @__PURE__ */ jsx32("label", { htmlFor: "bankname", children: "Bank name" }),
10804
- /* @__PURE__ */ jsx32(
10805
- "input",
10806
- {
10807
- type: "text",
10808
- id: "bankname",
10809
- className: "form-control-frac",
10810
- maxLength: 100,
10811
- placeholder: "My Bank",
10812
- name: "bankName",
10813
- value: (_p = achData == null ? void 0 : achData.bankName) != null ? _p : "",
10814
- onChange: handleChangeAch
10815
- }
10816
- ),
10817
- (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
10818
- ] }),
10819
- ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10820
- /* @__PURE__ */ jsx32("label", { htmlFor: "companyName", children: "Company name" }),
10821
- /* @__PURE__ */ jsx32(
10822
- "input",
10823
- {
10824
- type: "text",
10825
- id: "companyName",
10826
- className: "form-control-frac",
10827
- maxLength: 100,
10828
- placeholder: "My Company",
10829
- name: "companyName",
10830
- value: (_q = achData == null ? void 0 : achData.companyName) != null ? _q : "",
10831
- onChange: handleChangeAch
10832
- }
10833
- ),
10834
- (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
10835
- ] }),
10836
- /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10837
- /* @__PURE__ */ jsx32("label", { htmlFor: "accounttype", children: "Select account type" }),
10838
- /* @__PURE__ */ jsxs19("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_r = achData == null ? void 0 : achData.accountType) != null ? _r : "", onChange: handleChangeAch, children: [
10839
- /* @__PURE__ */ jsx32("option", { value: "", children: "Select account" }),
10840
- 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.` })
10841
11168
  ] })
10842
11169
  ] }),
10843
- customerId && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
10844
- /* @__PURE__ */ jsx32("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
10845
- /* @__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.` })
10846
- ] })
10847
- ] }),
10848
- /* @__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)) }) })
10849
- ] })
10850
- ] }) })
10851
- ] }) }) }) })
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
+ ] }) }) })
10852
11175
  ] })
10853
11176
  ] })
10854
11177
  ] })
@@ -10859,7 +11182,7 @@ var ModelContentSky_default = ModelContentSky;
10859
11182
 
10860
11183
  // src/app/components/Skysystemz/PayButtonWithForm.tsx
10861
11184
  import axios10 from "axios";
10862
- 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";
10863
11186
  var PaymentWidget = ({
10864
11187
  amount,
10865
11188
  bankAmount,
@@ -10970,19 +11293,19 @@ var PaymentWidget = ({
10970
11293
  getskyosOrderDetails();
10971
11294
  }
10972
11295
  }, [show, isPartial, partialRef]);
10973
- return /* @__PURE__ */ jsxs20(Fragment19, { children: [
10974
- /* @__PURE__ */ jsx33("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
10975
- /* @__PURE__ */ jsx33(DataScript, {}),
10976
- /* @__PURE__ */ jsx33(FractalTokenizerScript, {}),
10977
- /* @__PURE__ */ jsx33(SkyChargewidgetstyles, {}),
10978
- /* @__PURE__ */ jsx33(CardBankRadioStyles, {}),
10979
- /* @__PURE__ */ jsx33(CustomModal2styles_default, {}),
10980
- /* @__PURE__ */ jsx33(DataCapScriptLoader, {}),
10981
- !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: [
10982
11305
  submitBtnText,
10983
11306
  submitBtnIcon
10984
11307
  ] }),
10985
- !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 }))
10986
11309
  ] });
10987
11310
  };
10988
11311
  export {