@fractalpay/fractalpay-next-dev 0.0.247 → 0.0.249

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.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.247",
42
+ version: "0.0.249",
43
43
  private: false,
44
44
  type: "module",
45
45
  scripts: {
@@ -113,25 +113,8 @@ 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-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 {
116
+
117
+ .loader {
135
118
  position: fixed; /* Fixed position to cover the viewport */
136
119
  top: 0;
137
120
  left: 0;
@@ -143,7 +126,7 @@ var LoaderStyle = (props) => {
143
126
  /* background: rgba(255, 255, 0, 0.01); Adjust the blur effect */
144
127
  background-color: rgba(31, 29, 29, 0.52); /* Semi-transparent black background */
145
128
 
146
- backdrop-filter: blur(6.5px); /* Blur effect */
129
+ backdrop-filter: blur(.5px); /* Blur effect */
147
130
  z-index: 999999999999 !important; /* Ensure it's on top of other elements */
148
131
  transform: translate(0%, 0%) !important
149
132
  }
@@ -218,11 +201,10 @@ var LoaderStyle_default = LoaderStyle;
218
201
 
219
202
  // src/app/components/Loader/Loader.tsx
220
203
  import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
221
- var Loader = (_a) => {
222
- var _b = _a, { intensity = "light" } = _b, props = __objRest(_b, ["intensity"]);
204
+ var Loader = (props) => {
223
205
  return /* @__PURE__ */ jsxs(Fragment, { children: [
224
206
  /* @__PURE__ */ jsx2(LoaderStyle_default, {}),
225
- (props == null ? void 0 : props.loading) && /* @__PURE__ */ jsx2("div", { className: `loader-${intensity}`, children: /* @__PURE__ */ jsxs("div", { className: "lds-ellipsis", children: [
207
+ (props == null ? void 0 : props.loading) && /* @__PURE__ */ jsx2("div", { className: "loader", children: /* @__PURE__ */ jsxs("div", { className: "lds-ellipsis", children: [
226
208
  /* @__PURE__ */ jsx2("div", {}),
227
209
  /* @__PURE__ */ jsx2("div", {}),
228
210
  /* @__PURE__ */ jsx2("div", {}),
@@ -236,8 +218,8 @@ var Loader_default = Loader;
236
218
  var { name } = require_package();
237
219
  var S3Url = "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/";
238
220
  if (name === "@fractalpay/fractalpay-next-dev") {
221
+ masterBaseUrl = "https://dev-sky-node.fractalpay.com/";
239
222
  baseUrl = "https://dev-widget.fractalpay.com/";
240
- masterBaseUrl = "http://localhost:8081/";
241
223
  fractalGatewayUrl = "https://api-dev.merchant-trends.com/";
242
224
  datacapUrl = "https://token-cert.dcap.com/v1/client";
243
225
  threedsSecurePublicKey = "pk_test_51RH5Wc2SlJvyNZ80hpUDy88r4rVdpijfKbNaWaUyQEE6rOrPmG2JQyAj7G5amBD5z5daC56WaeT4jfNhrrPcGOEP00UyKu6AOw";
@@ -2926,7 +2908,7 @@ function ErrorCardMszStyle() {
2926
2908
 
2927
2909
  // src/app/components/ErrorCardMessage/ErrorCardMessage.tsx
2928
2910
  import { Fragment as Fragment6, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
2929
- var ErrorCardMessage = ({ onClose, error, autoTrigger = false }) => {
2911
+ var ErrorCardMessage = ({ onClose, error }) => {
2930
2912
  return /* @__PURE__ */ jsxs6(Fragment6, { children: [
2931
2913
  /* @__PURE__ */ jsx12(ErrorCardMszStyle, {}),
2932
2914
  /* @__PURE__ */ jsx12("div", { className: "card-error", children: /* @__PURE__ */ jsx12("div", { className: "payment-error-container", children: /* @__PURE__ */ jsxs6("div", { className: "error-icon", children: [
@@ -2935,7 +2917,7 @@ var ErrorCardMessage = ({ onClose, error, autoTrigger = false }) => {
2935
2917
  /* @__PURE__ */ jsx12("div", { className: "payment-error-text", children: error }),
2936
2918
  /* @__PURE__ */ jsx12("div", { className: "thank-you-text", children: "Try again later " })
2937
2919
  ] }),
2938
- !autoTrigger && /* @__PURE__ */ jsx12("div", { className: "error-btn-div", children: /* @__PURE__ */ jsx12("button", { onClick: onClose, children: "OK" }) })
2920
+ /* @__PURE__ */ jsx12("div", { className: "error-btn-div", children: /* @__PURE__ */ jsx12("button", { onClick: onClose, children: "OK" }) })
2939
2921
  ] }) }) })
2940
2922
  ] });
2941
2923
  };
@@ -2952,28 +2934,14 @@ var socketClient_default = socket;
2952
2934
 
2953
2935
  // src/app/components/Atoms/CardBankRadio/CardBankRadio.tsx
2954
2936
  import { Fragment as Fragment7, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
2955
- var CardBankRadio = (_a) => {
2956
- var _b = _a, { skydesign = false, savingsText } = _b, props = __objRest(_b, ["skydesign", "savingsText"]);
2957
- const savingsBadgeClass = `frac-saving-badge ${skydesign ? "frac-saving-badge-corner" : "frac-saving-badge-corner frac-saving-badge-with-radio"}`;
2958
- return /* @__PURE__ */ jsx13(Fragment7, { children: /* @__PURE__ */ jsx13(
2937
+ var CardBankRadio = (props) => {
2938
+ return /* @__PURE__ */ jsx13(Fragment7, { children: /* @__PURE__ */ jsxs7(
2959
2939
  "div",
2960
2940
  {
2961
2941
  className: `frac-card-bank-radio ${props.activetab === props.value ? "frac-active" : ""}`,
2962
2942
  onClick: () => props.onChange(props.value),
2963
2943
  role: "radio",
2964
- children: skydesign ? /* @__PURE__ */ jsxs7(Fragment7, { children: [
2965
- /* @__PURE__ */ jsxs7("div", { className: "frac-card-title-main", children: [
2966
- /* @__PURE__ */ jsxs7("div", { className: "box-inner-card-text", children: [
2967
- /* @__PURE__ */ jsx13("img", { src: props.label.toLowerCase() === "card" ? defaultcard : props.label.toLowerCase() === "reader" ? pax : bankNew, className: "frac-payment-type-logo", alt: "" }),
2968
- /* @__PURE__ */ jsx13("div", { className: "frac-card-label-text", children: props.label })
2969
- ] }),
2970
- /* @__PURE__ */ jsx13("div", { className: "frac-card-label", children: /* @__PURE__ */ jsx13("div", { className: "frac-card-label-amount", children: formatUSD(props.amount) }) })
2971
- ] }),
2972
- savingsText ? /* @__PURE__ */ jsx13("button", { type: "button", className: savingsBadgeClass, children: savingsText }) : null,
2973
- /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13("input", { name: "paymenttype", checked: props.activetab === props.value, type: "hidden", value: props.value, onChange: (e) => {
2974
- props.onChange(e.target.value);
2975
- } }) })
2976
- ] }) : /* @__PURE__ */ jsxs7(Fragment7, { children: [
2944
+ children: [
2977
2945
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-title-main", children: [
2978
2946
  /* @__PURE__ */ jsx13("img", { src: props.label.toLowerCase() === "card" ? defaultcard : props.label.toLowerCase() === "reader" ? pax : bankNew, className: "frac-payment-type-logo", alt: "" }),
2979
2947
  /* @__PURE__ */ jsxs7("div", { className: "frac-card-label", children: [
@@ -2981,11 +2949,10 @@ var CardBankRadio = (_a) => {
2981
2949
  /* @__PURE__ */ jsx13("div", { className: "frac-card-label-amount", children: formatUSD(props.amount) })
2982
2950
  ] })
2983
2951
  ] }),
2984
- savingsText ? /* @__PURE__ */ jsx13("button", { type: "button", className: savingsBadgeClass, children: savingsText }) : null,
2985
2952
  /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13("input", { name: "paymenttype", checked: props.activetab === props.value, type: "radio", value: props.value, onChange: (e) => {
2986
2953
  props.onChange(e.target.value);
2987
2954
  } }) })
2988
- ] })
2955
+ ]
2989
2956
  }
2990
2957
  ) });
2991
2958
  };
@@ -3010,7 +2977,6 @@ function CardBankRadioStyles({}) {
3010
2977
  justify-content: space-between;
3011
2978
  align-items: center;
3012
2979
  align-self: stretch;
3013
- position: relative;
3014
2980
  }
3015
2981
 
3016
2982
  input[type="radio"] {
@@ -3068,28 +3034,6 @@ function CardBankRadioStyles({}) {
3068
3034
  .frac-card-bank-radio.frac-active {
3069
3035
  background: #F6F6F7;
3070
3036
  }
3071
-
3072
- .frac-saving-badge {
3073
- padding: 1px 7px !important;
3074
- border: 1px solid #9ad7ab;
3075
- border-radius: 999px;
3076
- background: #e8f8ec;
3077
- color: #1e6a34;
3078
- font-size: 10px;
3079
- font-weight: 600;
3080
- line-height: 15px;
3081
- pointer-events: none;
3082
- }
3083
-
3084
- .frac-saving-badge-corner {
3085
- position: absolute;
3086
- top: 8px;
3087
- right: 10px;
3088
- }
3089
-
3090
- .frac-saving-badge-with-radio {
3091
- right: 34px;
3092
- }
3093
3037
  ` });
3094
3038
  }
3095
3039
 
@@ -3267,7 +3211,7 @@ var FractalFields = ({ fractalStyles, tokenizerRef, isAddCard = false, isSky = f
3267
3211
  {
3268
3212
  id: "card_number",
3269
3213
  className: "form-control card-number-new",
3270
- style: { height: `${isSky ? "36px" : "46px"}` }
3214
+ style: { height: `${isSky ? "36px" : "46px"}`, display: "inline-block" }
3271
3215
  }
3272
3216
  ),
3273
3217
  /* @__PURE__ */ jsx17("div", { className: "card-crdi card-expiry-new", children: /* @__PURE__ */ jsxs10("div", { className: "exp-date-year-container", children: [
@@ -3276,7 +3220,7 @@ var FractalFields = ({ fractalStyles, tokenizerRef, isAddCard = false, isSky = f
3276
3220
  {
3277
3221
  id: "exp_month",
3278
3222
  className: "form-control required card-cvv-in",
3279
- style: { height: "36px", display: "block", minHeight: "36px" }
3223
+ style: { height: "36px", display: "inline-block" }
3280
3224
  }
3281
3225
  ) }),
3282
3226
  /* @__PURE__ */ jsx17("div", { className: "exp-year form-group input-main-wrap-frac", children: /* @__PURE__ */ jsx17(
@@ -3284,7 +3228,7 @@ var FractalFields = ({ fractalStyles, tokenizerRef, isAddCard = false, isSky = f
3284
3228
  {
3285
3229
  id: "exp_year",
3286
3230
  className: "form-control required card-cvv-in",
3287
- style: { height: "36px", display: "block", minHeight: "36px" }
3231
+ style: { height: "36px", display: "inline-block" }
3288
3232
  }
3289
3233
  ) }),
3290
3234
  /* @__PURE__ */ jsx17("div", { className: "security-digit form-group input-main-wrap-frac", children: /* @__PURE__ */ jsx17(
@@ -3292,7 +3236,7 @@ var FractalFields = ({ fractalStyles, tokenizerRef, isAddCard = false, isSky = f
3292
3236
  {
3293
3237
  id: "cvv",
3294
3238
  className: "form-control card-cvv-in required",
3295
- style: { height: "36px", display: "block", minHeight: "36px" }
3239
+ style: { height: "36px", display: "inline-block" }
3296
3240
  }
3297
3241
  ) })
3298
3242
  ] }) })
@@ -3415,8 +3359,7 @@ var DataCapFields = ({
3415
3359
  isOpen,
3416
3360
  tokenKey,
3417
3361
  setLoader,
3418
- isAddCard,
3419
- isEmbedded
3362
+ isAddCard
3420
3363
  }) => {
3421
3364
  const iframeId = "datacap-iframe";
3422
3365
  const resolverRef = useRef2(null);
@@ -3442,20 +3385,6 @@ var DataCapFields = ({
3442
3385
 
3443
3386
  `;
3444
3387
  }
3445
- if (isEmbedded) {
3446
- customCSS += `
3447
-
3448
- input {
3449
- background-color: #F6F6F7;
3450
- box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1;
3451
- }
3452
-
3453
- select {
3454
- background-color: #F6F6F7;
3455
- box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1);
3456
- }
3457
- `;
3458
- }
3459
3388
  const initialize = async () => {
3460
3389
  setLoader == null ? void 0 : setLoader(true);
3461
3390
  setIframeReady(false);
@@ -3487,18 +3416,13 @@ var DataCapFields = ({
3487
3416
  };
3488
3417
  initialize();
3489
3418
  }, [isOpen, tokenKey]);
3490
- useEffect7(() => {
3491
- window.requestDcToken = () => {
3492
- return new Promise((resolve, reject) => {
3493
- setLoader == null ? void 0 : setLoader(true);
3494
- resolverRef.current = { resolve, reject };
3495
- });
3496
- };
3497
- return () => {
3498
- delete window.requestDcToken;
3499
- };
3500
- }, []);
3501
- console.log(setLoader, "loadingIframe");
3419
+ window.requestDcToken = () => {
3420
+ return new Promise((resolve, reject) => {
3421
+ setLoader == null ? void 0 : setLoader(true);
3422
+ resolverRef.current = { resolve, reject };
3423
+ window.DatacapHostedWebToken.requestToken();
3424
+ });
3425
+ };
3502
3426
  return /* @__PURE__ */ jsx18(
3503
3427
  "iframe",
3504
3428
  {
@@ -3760,7 +3684,7 @@ function GetPaymentPage(props) {
3760
3684
  }
3761
3685
  }
3762
3686
  if (!isBankConsentChecked) {
3763
- setErrorBankConsent("Above consent is requied");
3687
+ setErrorBankConsent("Above consent is required");
3764
3688
  }
3765
3689
  setAchError(errors);
3766
3690
  return Object.keys(errors).length > 0 || !isBankConsentChecked;
@@ -7676,7 +7600,7 @@ function PartialPayment(props) {
7676
7600
  }
7677
7601
  }
7678
7602
  if (!isBankConsentChecked) {
7679
- setErrorBankConsent("Above consent is requied");
7603
+ setErrorBankConsent("Above consent is required");
7680
7604
  }
7681
7605
  setAchError(errors);
7682
7606
  return Object.keys(errors).length > 0 || !isBankConsentChecked;
@@ -8906,17 +8830,6 @@ function SkyChargewidgetstyles() {
8906
8830
  text-align : left !important;
8907
8831
  text-transform: uppercase !important;
8908
8832
  }
8909
- .frac-form .frac-fee-text{
8910
- display: block;
8911
- padding: 10px 0 4px;
8912
- font-family: 'IBM Plex Mono', monospace !important;
8913
- color: #727272 !important;
8914
- font-size: 12px;
8915
- line-height: 1.4;
8916
- }
8917
- .frac-form .frac-fee-amount{
8918
- color: #c62828 !important;
8919
- }
8920
8833
  .form-control-frac{
8921
8834
  display: block;
8922
8835
  width: 100%;
@@ -8951,7 +8864,7 @@ function SkyChargewidgetstyles() {
8951
8864
  }
8952
8865
  .exp-date-year-container .form-group {
8953
8866
  flex: 1;
8954
- padding-left:.75rem !important;
8867
+ padding-left:.75rem;
8955
8868
  }
8956
8869
  .card-crdi {
8957
8870
  display: flex;
@@ -8968,7 +8881,7 @@ function SkyChargewidgetstyles() {
8968
8881
  }
8969
8882
  .exp-date-year-container .form-group-frac{
8970
8883
  flex:1;
8971
- // padding: 0px !important
8884
+ padding: 0px !important
8972
8885
 
8973
8886
  }
8974
8887
 
@@ -9469,16 +9382,7 @@ margin:0px !important;
9469
9382
  padding:0px !important;
9470
9383
  }
9471
9384
 
9472
-
9473
- .toggle-num-wrapper-new div#card_number {
9474
- display: block !important;
9475
- }
9476
- .toggle-num-wrapper-new .input-main-wrap-frac {
9477
- height: 36px;
9478
- }
9479
- .toggle-num-wrapper-new:focus {
9480
- border: 1px solid #004eab !important;
9481
- }
9385
+
9482
9386
 
9483
9387
  ` });
9484
9388
  }
@@ -9625,162 +9529,10 @@ function CheckoutWrapper({ clientSecret, onSuccess, showLoader, setError, sessio
9625
9529
  // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
9626
9530
  import { IoArrowBack as IoArrowBack4 } from "react-icons/io5";
9627
9531
  import { NumericFormat as NumericFormat2 } from "react-number-format";
9628
-
9629
- // src/app/components/ErrorCardMessage/ErrorCardOverlaystyle.tsx
9630
- import { jsx as jsx32 } from "react/jsx-runtime";
9631
- function ErrorCardOverlayStyle() {
9632
- return /* @__PURE__ */ jsx32("style", { children: `
9633
- .card-error-overlay .logo-container {
9634
- display: flex;
9635
- justify-content: center;
9636
- align-items: center;
9637
- margin-bottom: -50px; /* Adjust this to overlap the content */
9638
- z-index: 10;
9639
- }
9640
-
9641
- .card-error-overlay .client-logo {
9642
- max-width: 100px;
9643
- height: auto;
9644
- object-fit: contain;
9645
- display: block;
9646
- }
9647
-
9648
-
9649
- .card-error-overlay .error-icon-overlay {
9650
- display: flex;
9651
- flex-direction: column;
9652
- align-items: center;
9653
- gap: 12px;
9654
- min-height: 116px;
9655
- z-index: 2;
9656
- }
9657
-
9658
- .card-error-overlay .circle {
9659
- width: 50px;
9660
- height: 50px;
9661
- border: 1px solid red;
9662
- border-radius: 50%;
9663
- display: flex;
9664
- justify-content: center;
9665
- align-items: center;
9666
- margin-bottom:20px
9667
- }
9668
-
9669
- .card-error-overlay .circle .fa-times {
9670
- font-size: 30px;
9671
- color: red;
9672
- }
9673
-
9674
- .card-error-overlay .error-text-overlay {
9675
- display: flex;
9676
- flex-direction: column;
9677
- justify-content: center;
9678
- align-items: center;
9679
- gap: 4px;
9680
- // width: 227px;
9681
- }
9682
-
9683
- .card-error-overlay .payment-error-text-overlay {
9684
- font-family: 'Inter', sans-serif;
9685
- font-weight: 500;
9686
- font-size: 18px;
9687
- line-height: 21px;
9688
- text-align: center;
9689
- letter-spacing: -0.02em;
9690
- color: #161616;
9691
- }
9692
-
9693
- .card-error-overlay .thank-you-text-overlay {
9694
- font-family: 'Inter', sans-serif;
9695
- font-weight: 500;
9696
- font-size: 16px;
9697
- line-height: 18px;
9698
- text-align: center;
9699
- letter-spacing: -0.02em;
9700
- color: #161616 !important;
9701
- opacity: 0.5;
9702
- padding-top:10px
9703
- }
9704
-
9705
- .card-error-overlay .error-btn-div-overlay{
9706
- padding-top:20px;
9707
- width: 100%;
9708
-
9709
- }
9710
- .card-error-overlay .error-btn-div-overlay button{
9711
- outline: 0;
9712
- height: 46px;
9713
- font-size: 16px;
9714
- background: #727272;
9715
- border: none;
9716
- display: block;
9717
- color: #fff;
9718
- width: 100%;
9719
- border-radius: 180px;
9720
- margin: 10px 0;
9721
- text-decoration: none;
9722
- }
9723
- .card-error-overlay .error-btn-div-overlay button:hover, .card-error-overlay .error-btn-div-overlay button:focus {
9724
- background: #222;
9725
- color: #fff;
9726
- cursor: pointer;
9727
- }
9728
- .payment-error-container-overlay {
9729
- width: fit-content;
9730
- position: relative;
9731
- top: 50%;
9732
- left: 50%;
9733
- transform: translate(-50%, -50%);
9734
- background: rgba(255, 255, 255, 0.15);
9735
- backdrop-filter: blur(12px);
9736
- -webkit-backdrop-filter: blur(12px);
9737
- border-radius: 12px;
9738
- z-index: 11111;
9739
- max-width: 240px;
9740
- min-width: 224px;
9741
- padding: 20px;
9742
- margin-left: 17px !important;
9743
- }
9744
- .card-error-overlay {
9745
- position: absolute;
9746
- top: 0;
9747
- left: 0;
9748
- width: 100%;
9749
- height: 100%;
9750
- background: rgb(87 87 87 / 15%);
9751
- backdrop-filter: blur(2px);
9752
- -webkit-backdrop-filter: blur(12px);
9753
- z-index: 1111;
9754
- }
9755
- ` });
9756
- }
9757
-
9758
- // src/app/components/ErrorCardMessage/ErrorCardOverlay.tsx
9759
- import { Fragment as Fragment18, jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
9760
- var ErrorCardOverlay = ({ onClose, error, autoTrigger = false }) => {
9761
- return /* @__PURE__ */ jsxs19(Fragment18, { children: [
9762
- /* @__PURE__ */ jsx33(ErrorCardOverlayStyle, {}),
9763
- /* @__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: [
9764
- /* @__PURE__ */ jsx33("div", { className: "circle", children: /* @__PURE__ */ jsx33("i", { className: "fa fa-times", "aria-hidden": "true" }) }),
9765
- /* @__PURE__ */ jsxs19("div", { className: "error-text-overlay", children: [
9766
- /* @__PURE__ */ jsx33("div", { className: "payment-error-text-overlay", children: error }),
9767
- /* @__PURE__ */ jsx33("div", { className: "thank-you-text-overlay", children: "Try again later " })
9768
- ] }),
9769
- !autoTrigger && /* @__PURE__ */ jsx33("div", { className: "error-btn-div-overlay", children: /* @__PURE__ */ jsx33("button", { onClick: onClose, children: "OK" }) })
9770
- ] }) }) })
9771
- ] });
9772
- };
9773
- var ErrorCardOverlay_default = ErrorCardOverlay;
9774
-
9775
- // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
9776
- import { Fragment as Fragment19, jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
9777
- 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 }) => {
9778
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
9532
+ import { Fragment as Fragment18, jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
9533
+ 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 }) => {
9534
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
9779
9535
  const hasRunRef = useRef10(false);
9780
- const cardFormRef = useRef10(null);
9781
- const bankFormRef = useRef10(null);
9782
- const expiryYearRef = useRef10(null);
9783
- const expiryMonthRef = useRef10(null);
9784
9536
  const cardListRunRef = useRef10(false);
9785
9537
  const threeDSContainerRef = useRef10(null);
9786
9538
  const [activetab, setActive] = useState10("card");
@@ -9832,10 +9584,6 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9832
9584
  let pax2 = S3Url + "widget/pax.svg";
9833
9585
  let cardicon = S3Url + "widget/cardicon.svg";
9834
9586
  let bankicon = S3Url + "widget/bankicon.svg";
9835
- let defualtcardborder = S3Url + "widget/defualtcardborder.svg";
9836
- let unionicon = S3Url + "widget/unionpay.svg";
9837
- let dinersicon = S3Url + "widget/diners.svg";
9838
- let jcbicon = S3Url + "widget/jcb.svg";
9839
9587
  const showLoader = () => setLoading(true);
9840
9588
  const hideLoader = () => setLoading(false);
9841
9589
  const CalculateCashDiscount = (amount2, surcharge2) => {
@@ -9843,10 +9591,6 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
9843
9591
  const originalAmount = amount2 / (1 + surchargeVal);
9844
9592
  return Math.round(originalAmount * 100) / 100;
9845
9593
  };
9846
- const cardFeeAmount = Number(pass_fee_amount || 0);
9847
- const bankFeeAmount = Number(bankSurcharge || 0);
9848
- const bankSavingsAmount = Math.max(bankFeeAmount > 0 ? cardFeeAmount - bankFeeAmount : cardFeeAmount, 0);
9849
- const bankSavingsText = bankSavingsAmount > 0 ? `Save ${formatUSD(bankSavingsAmount.toFixed(2))}` : "";
9850
9594
  const tokenizerRef = useRef10(null);
9851
9595
  const fractalStyles = {
9852
9596
  input: {
@@ -10012,7 +9756,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10012
9756
  }
10013
9757
  }
10014
9758
  if (!isBankConsentChecked) {
10015
- setErrorBankConsent("Above consent is requied");
9759
+ setErrorBankConsent("Above consent is required");
10016
9760
  }
10017
9761
  setAchError(errors);
10018
9762
  return Object.keys(errors).length > 0 || !isBankConsentChecked;
@@ -10056,7 +9800,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10056
9800
  }
10057
9801
  };
10058
9802
  const handleFractalTokenFlow = async () => {
10059
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v, _w, _x, _y, _z, _A;
9803
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t, _u, _v, _w;
10060
9804
  try {
10061
9805
  const requestOptions = {
10062
9806
  method: "POST",
@@ -10097,29 +9841,17 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10097
9841
  three_ds_data
10098
9842
  );
10099
9843
  } catch (error2) {
10100
- console.log(error2, "error in tokenization");
10101
- let readableMessage = "Something went wrong!";
10102
- try {
10103
- const rawError = ((_n2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _n2.data) || (error2 == null ? void 0 : error2.message) || "";
10104
- const errorText = typeof rawError === "string" ? rawError : JSON.stringify(rawError);
10105
- const lines = ((_p2 = (_o2 = errorText.split) == null ? void 0 : _o2.call(errorText, "\n")) == null ? void 0 : _p2.filter(Boolean)) || [];
10106
- const lastLine = lines.at(-1) || "";
10107
- const parts = (_q2 = lastLine.split) == null ? void 0 : _q2.call(lastLine, ": ");
10108
- readableMessage = (parts == null ? void 0 : parts.length) > 1 ? parts.pop().trim() : lastLine.trim() || readableMessage;
10109
- } catch (e) {
10110
- readableMessage = "Something went wrong!";
10111
- }
10112
- setErrorIframe(readableMessage);
9844
+ setErrorIframe(error2);
10113
9845
  hideLoader();
10114
9846
  }
10115
9847
  if (tokenizeData == null ? void 0 : tokenizeData.token) {
10116
9848
  let ThreedsData = tokenizeData == null ? void 0 : tokenizeData.stripe_three_ds_response;
10117
- if (require3ds && !ThreedsData && (ThreedsData == null ? void 0 : ThreedsData.status) === "200 OK" && ((_r2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _r2.challenge_url)) {
9849
+ if (require3ds && !ThreedsData && (ThreedsData == null ? void 0 : ThreedsData.status) === "200 OK" && ((_n2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _n2.challenge_url)) {
10118
9850
  setError("Something went wrong. Please try again later.");
10119
9851
  }
10120
9852
  if (require3ds) {
10121
- if (!((_s2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _s2.challenge_url)) {
10122
- completeFractalFlow(tokenizeData == null ? void 0 : tokenizeData.token, (_t2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _t2.id);
9853
+ if (!((_o2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _o2.challenge_url)) {
9854
+ completeFractalFlow(tokenizeData == null ? void 0 : tokenizeData.token, (_p2 = ThreedsData == null ? void 0 : ThreedsData.data) == null ? void 0 : _p2.id);
10123
9855
  } else {
10124
9856
  hideLoader();
10125
9857
  setStripeResponse(__spreadProps(__spreadValues({}, ThreedsData == null ? void 0 : ThreedsData.data), {
@@ -10135,11 +9867,11 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10135
9867
  console.log(error2, "error");
10136
9868
  let readableMessage = "Something went wrong!";
10137
9869
  try {
10138
- const rawError = ((_u2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _u2.data) || (error2 == null ? void 0 : error2.message) || "";
9870
+ const rawError = ((_q2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _q2.data) || (error2 == null ? void 0 : error2.message) || "";
10139
9871
  const errorText = typeof rawError === "string" ? rawError : JSON.stringify(rawError);
10140
- const lines = ((_w = (_v = errorText.split) == null ? void 0 : _v.call(errorText, "\n")) == null ? void 0 : _w.filter(Boolean)) || [];
9872
+ const lines = ((_s2 = (_r2 = errorText.split) == null ? void 0 : _r2.call(errorText, "\n")) == null ? void 0 : _s2.filter(Boolean)) || [];
10141
9873
  const lastLine = lines.at(-1) || "";
10142
- const parts = (_x = lastLine.split) == null ? void 0 : _x.call(lastLine, ": ");
9874
+ const parts = (_t = lastLine.split) == null ? void 0 : _t.call(lastLine, ": ");
10143
9875
  readableMessage = (parts == null ? void 0 : parts.length) > 1 ? parts.pop().trim() : lastLine.trim() || readableMessage;
10144
9876
  } catch (e) {
10145
9877
  readableMessage = "Something went wrong!";
@@ -10147,8 +9879,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10147
9879
  setError(readableMessage);
10148
9880
  callback({
10149
9881
  error: readableMessage,
10150
- result: (_z = (_y = error2 == null ? void 0 : error2.response) == null ? void 0 : _y.data) == null ? void 0 : _z.result,
10151
- statusCode: (_A = error2 == null ? void 0 : error2.response) == null ? void 0 : _A.status
9882
+ result: (_v = (_u = error2 == null ? void 0 : error2.response) == null ? void 0 : _u.data) == null ? void 0 : _v.result,
9883
+ statusCode: (_w = error2 == null ? void 0 : error2.response) == null ? void 0 : _w.status
10152
9884
  });
10153
9885
  }
10154
9886
  };
@@ -10565,8 +10297,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10565
10297
  });
10566
10298
  };
10567
10299
  const handlechargeCustomer = async (e) => {
10568
- var _a2, _b2, _c2, _d2, _e2, _f2, _g2;
10569
- e == null ? void 0 : e.currentTarget.blur();
10300
+ var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2;
10301
+ e.currentTarget.blur();
10570
10302
  if (loading) return;
10571
10303
  let customer_id = customerId;
10572
10304
  let card_id = selectedCard == null ? void 0 : selectedCard.id;
@@ -10613,6 +10345,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10613
10345
  statusCode: (_g2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _g2.status
10614
10346
  });
10615
10347
  hideLoader();
10348
+ setError(((_i2 = (_h2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _h2.data) == null ? void 0 : _i2.message) || "Something went wrong!");
10616
10349
  }
10617
10350
  } else {
10618
10351
  setError("Please Select A Card/Bank");
@@ -10695,13 +10428,13 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10695
10428
  }
10696
10429
  }, [show, autoTrigger]);
10697
10430
  useEffect15(() => {
10698
- if (!hasRunRef.current && (show || autoTrigger) && onLoad) {
10431
+ if (!hasRunRef.current && (show || autoTrigger)) {
10699
10432
  getPaymentDetails();
10700
10433
  if (isPartial && !partialRef) {
10701
10434
  crateOrderFrac();
10702
10435
  }
10703
10436
  }
10704
- }, [show, autoTrigger, isPartial, onLoad]);
10437
+ }, [show, autoTrigger, isPartial]);
10705
10438
  useEffect15(() => {
10706
10439
  if ((show || autoTrigger) && pass_fee_amount) {
10707
10440
  let cashdisc = Number(amount) - Number(pass_fee_amount);
@@ -10788,89 +10521,18 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10788
10521
  styles: {}
10789
10522
  });
10790
10523
  }, []);
10791
- const stateRef = useRef10({
10792
- activeinBank,
10793
- activeinCard,
10794
- activetab
10795
- });
10796
- useEffect15(() => {
10797
- stateRef.current = {
10798
- activeinBank,
10799
- activeinCard,
10800
- activetab
10801
- };
10802
- }, [activeinBank, activeinCard, activetab]);
10803
- const submit = useCallback(() => {
10804
- var _a2, _b2;
10805
- const { activeinBank: activeinBank2, activeinCard: activeinCard2, activetab: activetab2 } = stateRef.current;
10806
- if (activetab2 === "card") {
10807
- if (activeinCard2 === "form") {
10808
- (_a2 = cardFormRef.current) == null ? void 0 : _a2.requestSubmit();
10809
- } else if (activeinCard2 === "list") {
10810
- handlechargeCustomer();
10811
- }
10812
- } else if (activetab2 === "ach") {
10813
- if (activeinBank2 === "form") {
10814
- (_b2 = bankFormRef.current) == null ? void 0 : _b2.requestSubmit();
10815
- } else if (activeinBank2 === "list") {
10816
- handlechargeCustomer();
10817
- }
10818
- }
10819
- }, []);
10820
- useEffect15(() => {
10821
- onSubmit == null ? void 0 : onSubmit(submit);
10822
- }, [onSubmit, submit]);
10823
- function detectCardType(cardinput) {
10824
- if (!cardinput) return null;
10825
- const number = cardinput.replace(/\D/g, "");
10826
- const patterns = {
10827
- visa: /^4/,
10828
- mastercard: /^(5[1-5]|2[2-7][0-9]{2})/,
10829
- amex: /^3[47]/,
10830
- discover: /^(6011|65|64[4-9])/,
10831
- diners: /^(30[0-5]|36|38)/,
10832
- jcb: /^(35[2-8][0-9])/,
10833
- unionpay: /^62/
10834
- };
10835
- for (const [type, regex] of Object.entries(patterns)) {
10836
- if (regex.test(number)) {
10837
- return type;
10838
- }
10839
- }
10840
- return "unknown";
10841
- }
10842
- function getCardImage(cardInput) {
10843
- const cardType = detectCardType(cardInput);
10844
- switch (cardType) {
10845
- case "visa":
10846
- return /* @__PURE__ */ jsx34("img", { src: visa2, alt: "visa", width: 33 });
10847
- case "mastercard":
10848
- return /* @__PURE__ */ jsx34("img", { src: mastercard2, width: 33, alt: "mastercard" });
10849
- case "amex":
10850
- return /* @__PURE__ */ jsx34("img", { src: americanexp2, alt: "amex", width: 33 });
10851
- case "discover":
10852
- return /* @__PURE__ */ jsx34("img", { src: discover2, width: 33, alt: "discover" });
10853
- case "diners":
10854
- return /* @__PURE__ */ jsx34("img", { src: dinersicon, alt: "Diners Club" });
10855
- case "jcb":
10856
- return /* @__PURE__ */ jsx34("img", { src: jcbicon, alt: "JCB" });
10857
- case "unionpay":
10858
- return /* @__PURE__ */ jsx34("img", { src: unionicon, alt: "UnionPay" });
10859
- default:
10860
- return /* @__PURE__ */ jsx34("img", { src: defualtcardborder, alt: "card" });
10861
- }
10862
- }
10863
- return /* @__PURE__ */ jsxs20(Fragment19, { children: [
10864
- (initialLoader || !onLoad) && /* @__PURE__ */ jsx34(Loader_default, { intensity: "dark", loading: initialLoader || !onLoad }),
10865
- error && /* @__PURE__ */ jsx34("div", { children: /* @__PURE__ */ jsx34(ErrorCardOverlay_default, { error, onClose: handleClose, autoTrigger }) }),
10866
- errorIframe && /* @__PURE__ */ jsx34("div", { children: /* @__PURE__ */ jsx34(ErrorCardOverlay_default, { error: errorIframe, onClose: () => {
10524
+ console.log(activeinCard === "list", "activeinCard", activeList);
10525
+ return /* @__PURE__ */ jsxs19(Fragment18, { children: [
10526
+ initialLoader && /* @__PURE__ */ jsx32(Loader_default, { loading: initialLoader }),
10527
+ error && /* @__PURE__ */ jsx32("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx32(ErrorCardMessage_default, { error, onClose: handleClose }) }),
10528
+ errorIframe && /* @__PURE__ */ jsx32("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx32(ErrorCardMessage_default, { error: errorIframe, onClose: () => {
10867
10529
  setErrorIframe("");
10868
- }, autoTrigger: onSubmit ? !onSubmit : autoTrigger }) }),
10869
- /* @__PURE__ */ jsxs20(Fragment19, { children: [
10870
- (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx34(Loader_default, { intensity: "light", loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
10871
- /* @__PURE__ */ jsxs20("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
10872
- /* @__PURE__ */ jsx34("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
10873
- (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx34(
10530
+ } }) }),
10531
+ !error && !errorIframe && /* @__PURE__ */ jsxs19(Fragment18, { children: [
10532
+ (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx32(Loader_default, { loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
10533
+ /* @__PURE__ */ jsxs19("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
10534
+ /* @__PURE__ */ jsx32("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
10535
+ (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx32(
10874
10536
  ThreeDSChallenge,
10875
10537
  {
10876
10538
  containerRef: threeDSContainerRef,
@@ -10880,33 +10542,40 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10880
10542
  onSuccess: handleSuccess,
10881
10543
  onError: handleError
10882
10544
  }
10883
- ) : /* @__PURE__ */ jsxs20("div", { className: "parent-pay-container", children: [
10884
- /* @__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: [
10885
- /* @__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" }) }),
10886
- /* @__PURE__ */ jsx34("defs", { children: /* @__PURE__ */ jsx34("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx34("rect", { width: "16", height: "16", fill: "white" }) }) })
10545
+ ) : /* @__PURE__ */ jsxs19("div", { className: "parent-pay-container", children: [
10546
+ /* @__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: [
10547
+ /* @__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" }) }),
10548
+ /* @__PURE__ */ jsx32("defs", { children: /* @__PURE__ */ jsx32("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx32("rect", { width: "16", height: "16", fill: "white" }) }) })
10887
10549
  ] }) }),
10888
- /* @__PURE__ */ jsx34("div", { className: "pay-main-logo-res" }),
10889
- /* @__PURE__ */ jsxs20("div", { className: onSubmit ? "pay-container frac-pay-container " : "pay-container", children: [
10890
- !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "pay-header pay-conatiner-one", children: [
10891
- /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-first", children: [
10892
- /* @__PURE__ */ jsxs20("div", { className: "pay-logo-container", children: [
10893
- /* @__PURE__ */ jsx34("div", { className: "pay-main-logo" }),
10894
- /* @__PURE__ */ jsx34("h1", { className: "pay-heading", children: "Pay" }),
10895
- (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs20("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
10550
+ /* @__PURE__ */ jsx32("div", { className: "pay-main-logo-res" }),
10551
+ /* @__PURE__ */ jsxs19("div", { className: "pay-container", children: [
10552
+ /* @__PURE__ */ jsxs19("div", { className: "pay-header pay-conatiner-one", children: [
10553
+ /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-first", children: [
10554
+ /* @__PURE__ */ jsxs19("div", { className: "pay-logo-container", children: [
10555
+ /* @__PURE__ */ jsx32("div", { className: "pay-main-logo" }),
10556
+ /* @__PURE__ */ jsx32("h1", { className: "pay-heading", children: "Pay" }),
10557
+ (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs19("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
10896
10558
  " ",
10897
- /* @__PURE__ */ jsx34(IoArrowBack4, {}),
10559
+ /* @__PURE__ */ jsx32(IoArrowBack4, {}),
10898
10560
  " Back"
10899
10561
  ] })
10900
10562
  ] }),
10901
- /* @__PURE__ */ jsx34("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
10902
- /* @__PURE__ */ jsx34("small", { className: "pay-payment-amount", children: "Select payment type" }),
10903
- /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
10904
- /* @__PURE__ */ jsx34(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10905
- !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx34(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab, savingsText: bankSavingsText })
10563
+ /* @__PURE__ */ jsx32("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs19("div", { className: "pay-amount-conatiner", children: [
10564
+ /* @__PURE__ */ jsx32("small", { className: "pay-payment-amount", children: "Select payment type" }),
10565
+ /* @__PURE__ */ jsxs19("div", { className: "frac-card-bank-radio-main", children: [
10566
+ /* @__PURE__ */ jsx32(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10567
+ !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx32(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab })
10906
10568
  ] }),
10907
- isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
10908
- /* @__PURE__ */ jsx34("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10909
- /* @__PURE__ */ jsx34(
10569
+ pass_fee && activetab === "card" && cashDiscount && Number(amount) - Number(cashDiscount) > 0 ? /* @__PURE__ */ jsxs19("div", { className: "frac-cash-discount-fee", children: [
10570
+ /* @__PURE__ */ jsxs19("small", { children: [
10571
+ activetab === "card" ? "Cash Discount" : "Cash Discount Savings",
10572
+ " "
10573
+ ] }),
10574
+ /* @__PURE__ */ jsx32("p", { children: formatUSD((Number(amount) - Number(cashDiscount)).toFixed(2)) })
10575
+ ] }) : null,
10576
+ isPartial && /* @__PURE__ */ jsxs19("div", { className: "frac-partial-payment-input", children: [
10577
+ /* @__PURE__ */ jsx32("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10578
+ /* @__PURE__ */ jsx32(
10910
10579
  NumericFormat2,
10911
10580
  {
10912
10581
  prefix: "$",
@@ -10930,378 +10599,331 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
10930
10599
  }
10931
10600
  }
10932
10601
  ),
10933
- partialError && /* @__PURE__ */ jsx34("span", { className: "error-span", children: partialError })
10602
+ partialError && /* @__PURE__ */ jsx32("span", { className: "error-span", children: partialError })
10934
10603
  ] })
10935
10604
  ] }) })
10936
10605
  ] }),
10937
- /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-last", children: [
10938
- /* @__PURE__ */ jsx34("img", { src: secure2, alt: "" }),
10939
- /* @__PURE__ */ jsx34("img", { src: pov2, alt: "" }),
10606
+ /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-last", children: [
10607
+ /* @__PURE__ */ jsx32("img", { src: secure2, alt: "" }),
10608
+ /* @__PURE__ */ jsx32("img", { src: pov2, alt: "" }),
10940
10609
  "Secure payments powered by Fractal"
10941
10610
  ] })
10942
10611
  ] }),
10943
- /* @__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: [
10944
- onSubmit && /* @__PURE__ */ jsx34("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
10945
- /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
10946
- /* @__PURE__ */ jsx34(CardBankRadio, { skydesign: true, label: "Card", amount: (_c = Number(amount)) == null ? void 0 : _c.toFixed(2), value: "card", onChange: handletabchange, activetab }),
10947
- !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, savingsText: bankSavingsText })
10612
+ /* @__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: [
10613
+ /* @__PURE__ */ jsxs19("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
10614
+ /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10615
+ /* @__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: [
10616
+ " ",
10617
+ /* @__PURE__ */ jsx32(IoArrowBack4, {})
10618
+ ] }) }),
10619
+ /* @__PURE__ */ jsx32("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
10948
10620
  ] }),
10949
- isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
10950
- /* @__PURE__ */ jsx34("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
10951
- /* @__PURE__ */ jsx34(
10952
- NumericFormat2,
10953
- {
10954
- prefix: "$",
10955
- className: "form-control-frac",
10956
- value: partialAmount,
10957
- onValueChange: (values) => {
10958
- handlePartialChange(values);
10959
- },
10960
- thousandSeparator: true,
10961
- placeholder: "Enter partial amount",
10962
- allowNegative: false,
10963
- allowLeadingZeros: false,
10964
- decimalScale: 2,
10965
- fixedDecimalScale: true
10966
- }
10967
- ),
10968
- partialError && /* @__PURE__ */ jsx34("span", { className: "error-span", children: partialError })
10969
- ] })
10970
- ] }) }),
10971
- is3DSEnable ? clientSecret && /* @__PURE__ */ jsx34(CheckoutWrapper, { onSuccess, clientSecret, amount, showLoader, hideLoader, callback, session_token, handleClose, setError, isPreAuth }) : /* @__PURE__ */ jsxs20(Fragment19, { children: [
10972
- /* @__PURE__ */ jsxs20("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
10973
- !onSubmit && /* @__PURE__ */ jsxs20(Fragment19, { children: [
10974
- /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
10975
- /* @__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: [
10976
- " ",
10977
- /* @__PURE__ */ jsx34(IoArrowBack4, {})
10978
- ] }) }),
10979
- /* @__PURE__ */ jsx34("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
10621
+ /* @__PURE__ */ jsxs19("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
10622
+ /* @__PURE__ */ jsx32("img", { src: visa2, alt: "", width: 33 }),
10623
+ /* @__PURE__ */ jsx32("img", { src: mastercard2, width: 33, alt: "" }),
10624
+ /* @__PURE__ */ jsx32("img", { src: americanexp2, alt: "", width: 33 }),
10625
+ /* @__PURE__ */ jsx32("img", { src: discover2, width: 33, alt: "" })
10626
+ ] }),
10627
+ activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10628
+ /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
10629
+ setActiveinCard("form");
10630
+ } }),
10631
+ /* @__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)) }) })
10632
+ ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs19("form", { id: "paymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10633
+ if (e.key === "Enter" && loading) {
10634
+ e.preventDefault();
10635
+ e.stopPropagation();
10636
+ }
10637
+ }, children: [
10638
+ /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10639
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10640
+ /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10641
+ /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10642
+ const value = e.target.value;
10643
+ if (/^[a-zA-Z\s]*$/.test(value)) {
10644
+ handleCardChange("cardName", value);
10645
+ }
10646
+ } }),
10647
+ (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
10980
10648
  ] }),
10981
- /* @__PURE__ */ jsxs20("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
10982
- /* @__PURE__ */ jsx34("img", { src: visa2, alt: "", width: 33 }),
10983
- /* @__PURE__ */ jsx34("img", { src: mastercard2, width: 33, alt: "" }),
10984
- /* @__PURE__ */ jsx34("img", { src: americanexp2, alt: "", width: 33 }),
10985
- /* @__PURE__ */ jsx34("img", { src: discover2, width: 33, alt: "" })
10986
- ] })
10987
- ] }),
10988
- activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
10989
- /* @__PURE__ */ jsx34(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
10990
- setActiveinCard("form");
10991
- } }),
10992
- /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, 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)) }) })
10993
- ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs20("form", { id: "paymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
10994
- if (e.key === "Enter" && loading) {
10995
- e.preventDefault();
10996
- e.stopPropagation();
10997
- }
10998
- }, children: [
10999
- /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
11000
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11001
- /* @__PURE__ */ jsx34("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
11002
- /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
11003
- const value = e.target.value;
11004
- if (/^[a-zA-Z\s]*$/.test(value)) {
11005
- handleCardChange("cardName", value);
11006
- }
11007
- } }),
11008
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
11009
- ] }),
11010
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11011
- /* @__PURE__ */ jsx34("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
11012
- /* @__PURE__ */ jsx34("div", { className: "toggle-num-wrapper toggle-num-wrapper-new", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx34(
11013
- FractalFields_default,
11014
- {
11015
- fractalStyles,
11016
- tokenizerRef,
11017
- isSky: true
11018
- }
11019
- ) })
11020
- ] }),
11021
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11022
- /* @__PURE__ */ jsx34("label", { htmlFor: "zip", children: "ZIP" }),
11023
- /* @__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) }),
11024
- (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
11025
- pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
11026
- "Credit cards include a fee amount of ",
11027
- /* @__PURE__ */ jsx34("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
11028
- "."
11029
- ] })
11030
- ] }),
11031
- 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: [
11032
- /* @__PURE__ */ jsx34(
11033
- "input",
10649
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10650
+ /* @__PURE__ */ jsx32("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
10651
+ /* @__PURE__ */ jsx32("div", { className: "toggle-num-wrapper", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx32(
10652
+ FractalFields_default,
10653
+ {
10654
+ fractalStyles,
10655
+ tokenizerRef,
10656
+ isSky: true
10657
+ }
10658
+ ) })
10659
+ ] }),
10660
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10661
+ /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10662
+ /* @__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) }),
10663
+ (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10664
+ ] }),
10665
+ 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: [
10666
+ /* @__PURE__ */ jsx32(
10667
+ "input",
10668
+ {
10669
+ type: "checkbox",
10670
+ id: "save_card",
10671
+ className: "toggle-checkbox",
10672
+ checked: saveCardInfo,
10673
+ onChange: (e) => setSaveCardInfo(e.target.checked)
10674
+ }
10675
+ ),
10676
+ /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10677
+ /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10678
+ /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10679
+ /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10680
+ "svg",
11034
10681
  {
11035
- type: "checkbox",
11036
- id: "save_card",
11037
- className: "toggle-checkbox",
11038
- checked: saveCardInfo,
11039
- onChange: (e) => setSaveCardInfo(e.target.checked)
10682
+ xmlns: "http://www.w3.org/2000/svg",
10683
+ width: "20",
10684
+ height: "20",
10685
+ viewBox: "0 0 20 20",
10686
+ fill: "none",
10687
+ children: [
10688
+ /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10689
+ /* @__PURE__ */ jsx32(
10690
+ "path",
10691
+ {
10692
+ 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",
10693
+ fill: "#161616"
10694
+ }
10695
+ )
10696
+ ]
11040
10697
  }
11041
- ),
11042
- /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", className: "toggle-label" }),
11043
- /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", children: "Save card for future payments " }),
11044
- /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
11045
- /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
11046
- "svg",
11047
- {
11048
- xmlns: "http://www.w3.org/2000/svg",
11049
- width: "20",
11050
- height: "20",
11051
- viewBox: "0 0 20 20",
11052
- fill: "none",
11053
- children: [
11054
- /* @__PURE__ */ jsx34("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
11055
- /* @__PURE__ */ jsx34(
11056
- "path",
11057
- {
11058
- 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",
11059
- fill: "#161616"
11060
- }
11061
- )
11062
- ]
11063
- }
11064
- ) }),
11065
- /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
11066
- "If checked, I agree to give the ",
11067
- /* @__PURE__ */ jsx34("b", { children: merchantName || "merchant" }),
11068
- " permission to charge this credit card for agreed-upon purchases in the future."
11069
- ] }) })
11070
- ] })
11071
- ] }) })
10698
+ ) }),
10699
+ /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
10700
+ "If checked, I agree to give the ",
10701
+ /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10702
+ " permission to charge this credit card for agreed-upon purchases in the future."
10703
+ ] }) })
10704
+ ] })
10705
+ ] }) })
10706
+ ] }),
10707
+ /* @__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)) }) })
10708
+ ] }) : /* @__PURE__ */ jsxs19("form", { id: "PaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, onKeyDown: (e) => {
10709
+ if (e.key === "Enter" && loading) {
10710
+ e.preventDefault();
10711
+ e.stopPropagation();
10712
+ }
10713
+ }, children: [
10714
+ /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
10715
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10716
+ /* @__PURE__ */ jsx32("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
10717
+ /* @__PURE__ */ jsx32("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
10718
+ const value = e.target.value;
10719
+ if (/^[a-zA-Z\s]*$/.test(value)) {
10720
+ handleCardChange("cardName", value);
10721
+ }
10722
+ } }),
10723
+ (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
11072
10724
  ] }),
11073
- /* @__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)) }) })
11074
- ] }) : /* @__PURE__ */ jsxs20("form", { id: "PaymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
11075
- if (e.key === "Enter" && loading) {
11076
- e.preventDefault();
11077
- e.stopPropagation();
11078
- }
11079
- }, children: [
11080
- /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
11081
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11082
- /* @__PURE__ */ jsx34("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
11083
- /* @__PURE__ */ jsx34("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
11084
- const value = e.target.value;
11085
- if (/^[a-zA-Z\s]*$/.test(value)) {
11086
- handleCardChange("cardName", value);
11087
- }
11088
- } }),
11089
- (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
11090
- ] }),
11091
- /* @__PURE__ */ jsx34("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx34(
11092
- DataCapFields,
10725
+ /* @__PURE__ */ jsx32("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx32(
10726
+ DataCapFields,
10727
+ {
10728
+ isOpen: show || autoTrigger,
10729
+ tokenKey: dcToken,
10730
+ setLoader: activeinCard === "form" ? setLoadingIframe : null
10731
+ }
10732
+ ) }),
10733
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10734
+ /* @__PURE__ */ jsx32("label", { htmlFor: "zip", children: "ZIP" }),
10735
+ /* @__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) }),
10736
+ (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode })
10737
+ ] }),
10738
+ 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: [
10739
+ /* @__PURE__ */ jsx32(
10740
+ "input",
11093
10741
  {
11094
- isOpen: show || autoTrigger,
11095
- tokenKey: dcToken,
11096
- setLoader: activeinCard === "form" ? setLoadingIframe : null,
11097
- isEmbedded: onSubmit ? true : false
10742
+ type: "checkbox",
10743
+ id: "save_card",
10744
+ className: "toggle-checkbox",
10745
+ checked: saveCardInfo,
10746
+ onChange: (e) => setSaveCardInfo(e.target.checked)
11098
10747
  }
11099
- ) }),
11100
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11101
- /* @__PURE__ */ jsx34("label", { htmlFor: "zip", children: "ZIP" }),
11102
- /* @__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) }),
11103
- (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
11104
- pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
11105
- "Credit cards include a fee amount of ",
11106
- /* @__PURE__ */ jsx34("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
11107
- "."
11108
- ] })
11109
- ] }),
11110
- 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: [
11111
- /* @__PURE__ */ jsx34(
11112
- "input",
10748
+ ),
10749
+ /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", className: "toggle-label" }),
10750
+ /* @__PURE__ */ jsx32("label", { htmlFor: "save_card", children: "Save card for future payments " }),
10751
+ /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
10752
+ /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
10753
+ "svg",
11113
10754
  {
11114
- type: "checkbox",
11115
- id: "save_card",
11116
- className: "toggle-checkbox",
11117
- checked: saveCardInfo,
11118
- onChange: (e) => setSaveCardInfo(e.target.checked)
10755
+ xmlns: "http://www.w3.org/2000/svg",
10756
+ width: "20",
10757
+ height: "20",
10758
+ viewBox: "0 0 20 20",
10759
+ fill: "none",
10760
+ children: [
10761
+ /* @__PURE__ */ jsx32("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
10762
+ /* @__PURE__ */ jsx32(
10763
+ "path",
10764
+ {
10765
+ 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",
10766
+ fill: "#161616"
10767
+ }
10768
+ )
10769
+ ]
11119
10770
  }
11120
- ),
11121
- /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", className: "toggle-label" }),
11122
- /* @__PURE__ */ jsx34("label", { htmlFor: "save_card", children: "Save card for future payments " }),
11123
- /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
11124
- /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
11125
- "svg",
11126
- {
11127
- xmlns: "http://www.w3.org/2000/svg",
11128
- width: "20",
11129
- height: "20",
11130
- viewBox: "0 0 20 20",
11131
- fill: "none",
11132
- children: [
11133
- /* @__PURE__ */ jsx34("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
11134
- /* @__PURE__ */ jsx34(
11135
- "path",
11136
- {
11137
- 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",
11138
- fill: "#161616"
11139
- }
11140
- )
11141
- ]
11142
- }
11143
- ) }),
11144
- /* @__PURE__ */ jsx34("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
11145
- "If checked, I agree to give the ",
11146
- /* @__PURE__ */ jsx34("b", { children: merchantName || "merchant" }),
11147
- " permission to charge this credit card for agreed-upon purchases in the future."
11148
- ] }) })
11149
- ] })
11150
- ] }) })
11151
- ] }),
11152
- /* @__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)) }) })
11153
- ] })
11154
- ] }),
11155
- /* @__PURE__ */ jsx34("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs20(Fragment19, { children: [
11156
- !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
11157
- /* @__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: [
11158
- " ",
11159
- /* @__PURE__ */ jsx34(IoArrowBack4, {})
11160
- ] }) }),
11161
- /* @__PURE__ */ jsx34("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
11162
- ] }),
11163
- activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
11164
- /* @__PURE__ */ jsx34(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
11165
- setActiveinBank("form");
11166
- } }),
11167
- /* @__PURE__ */ jsx34("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, 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)) }) })
11168
- ] }) : /* @__PURE__ */ jsxs20("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, ref: bankFormRef, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
11169
- if (e.key === "Enter" && loading) {
11170
- e.preventDefault();
11171
- e.stopPropagation();
11172
- }
11173
- }, children: [
11174
- /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: {
11175
- minHeight: "444px",
11176
- maxHeight: "444px"
11177
- }, children: [
11178
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11179
- /* @__PURE__ */ jsx34("label", { htmlFor: "nameonaccount", children: "Name on account" }),
11180
- /* @__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 }),
11181
- (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
11182
- ] }),
11183
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11184
- /* @__PURE__ */ jsx34("label", { htmlFor: "routingnumber", children: "Routing number" }),
11185
- /* @__PURE__ */ jsx34(
11186
- "input",
11187
- {
11188
- type: "text",
11189
- id: "routingnumber",
11190
- className: "form-control-frac",
11191
- maxLength: 9,
11192
- placeholder: "000000000",
11193
- name: "routingNumber",
11194
- value: (_o = achData == null ? void 0 : achData.routingNumber) != null ? _o : "",
11195
- onChange: handleChangeAch
11196
- }
11197
- ),
11198
- (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
11199
- ] }),
11200
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11201
- /* @__PURE__ */ jsx34("label", { htmlFor: "accountnumber", children: "Account number" }),
11202
- /* @__PURE__ */ jsx34(
11203
- "input",
11204
- {
11205
- type: "text",
11206
- id: "accountnumber",
11207
- className: "form-control-frac",
11208
- maxLength: 16,
11209
- placeholder: "0000000000",
11210
- name: "accountNumber",
11211
- value: (_p = achData == null ? void 0 : achData.accountNumber) != null ? _p : "",
11212
- onChange: handleChangeAch
11213
- }
11214
- ),
11215
- (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
11216
- ] }),
11217
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11218
- /* @__PURE__ */ jsx34("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
11219
- /* @__PURE__ */ jsx34(
11220
- "input",
11221
- {
11222
- type: "text",
11223
- id: "confirmaccountnumber",
11224
- className: "form-control-frac",
11225
- maxLength: 16,
11226
- placeholder: "0000000000",
11227
- name: "confirmAccountNumber",
11228
- value: (_q = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _q : "",
11229
- onChange: handleChangeAch
11230
- }
11231
- ),
11232
- (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
11233
- ] }),
11234
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11235
- /* @__PURE__ */ jsx34("label", { htmlFor: "bankname", children: "Bank name" }),
11236
- /* @__PURE__ */ jsx34(
11237
- "input",
11238
- {
11239
- type: "text",
11240
- id: "bankname",
11241
- className: "form-control-frac",
11242
- maxLength: 100,
11243
- placeholder: "My Bank",
11244
- name: "bankName",
11245
- value: (_r = achData == null ? void 0 : achData.bankName) != null ? _r : "",
11246
- onChange: handleChangeAch
11247
- }
11248
- ),
11249
- (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
11250
- ] }),
11251
- ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11252
- /* @__PURE__ */ jsx34("label", { htmlFor: "companyName", children: "Company name" }),
11253
- /* @__PURE__ */ jsx34(
11254
- "input",
11255
- {
11256
- type: "text",
11257
- id: "companyName",
11258
- className: "form-control-frac",
11259
- maxLength: 100,
11260
- placeholder: "My Company",
11261
- name: "companyName",
11262
- value: (_s = achData == null ? void 0 : achData.companyName) != null ? _s : "",
11263
- onChange: handleChangeAch
11264
- }
11265
- ),
11266
- (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx34("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
11267
- ] }),
11268
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
11269
- /* @__PURE__ */ jsx34("label", { htmlFor: "accounttype", children: "Select account type" }),
11270
- /* @__PURE__ */ jsxs20("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_t = achData == null ? void 0 : achData.accountType) != null ? _t : "", onChange: handleChangeAch, children: [
11271
- /* @__PURE__ */ jsx34("option", { value: "", children: "Select account" }),
11272
- accountTypes.map((type) => /* @__PURE__ */ jsx34("option", { value: type.value, children: type.label }, type.value))
11273
- ] }),
11274
- bankFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
11275
- "There is a processing fee of ",
11276
- /* @__PURE__ */ jsx34("span", { className: "frac-fee-amount", children: formatUSD(bankFeeAmount.toFixed(2)) }),
11277
- "."
11278
- ] }),
11279
- /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
11280
- /* @__PURE__ */ jsx34("input", { type: "checkbox", id: "achconsent", className: "", checked: isBankConsentChecked, onChange: (e) => {
11281
- setIsBankConsentChecked(e.target.checked);
11282
- if (e.target.checked) {
11283
- setErrorBankConsent("");
11284
- }
11285
- } }),
11286
- /* @__PURE__ */ jsx34("label", { className: "saveachlabel", htmlFor: "achconsent", 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.` })
11287
- ] }),
11288
- errorBankConsent && /* @__PURE__ */ jsx34("span", { className: "error-span", children: errorBankConsent }),
11289
- customerId && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
11290
- /* @__PURE__ */ jsx34("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
11291
- /* @__PURE__ */ jsx34("label", { className: "saveachlabel", htmlFor: "saveACH", children: "Save Bank" })
11292
- ] }),
11293
- saveACHinfo && /* @__PURE__ */ jsx34("div", { className: "form-group-frac saveachtext", children: /* @__PURE__ */ jsxs20("p", { children: [
10771
+ ) }),
10772
+ /* @__PURE__ */ jsx32("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
11294
10773
  "If checked, I agree to give the ",
11295
- /* @__PURE__ */ jsx34("b", { children: merchantName || "merchant" }),
11296
- " permission to charge this bank account for agreed-upon purchases in the future."
10774
+ /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10775
+ " permission to charge this credit card for agreed-upon purchases in the future."
11297
10776
  ] }) })
11298
10777
  ] })
10778
+ ] }) })
10779
+ ] }),
10780
+ /* @__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)) }) })
10781
+ ] })
10782
+ ] }),
10783
+ /* @__PURE__ */ jsx32("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs19(Fragment18, { children: [
10784
+ /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
10785
+ /* @__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: [
10786
+ " ",
10787
+ /* @__PURE__ */ jsx32(IoArrowBack4, {})
10788
+ ] }) }),
10789
+ /* @__PURE__ */ jsx32("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
10790
+ ] }),
10791
+ activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
10792
+ /* @__PURE__ */ jsx32(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
10793
+ setActiveinBank("form");
10794
+ } }),
10795
+ /* @__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)) }) })
10796
+ ] }) : /* @__PURE__ */ jsxs19("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
10797
+ if (e.key === "Enter" && loading) {
10798
+ e.preventDefault();
10799
+ e.stopPropagation();
10800
+ }
10801
+ }, children: [
10802
+ /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: {
10803
+ minHeight: "444px",
10804
+ maxHeight: "444px"
10805
+ }, children: [
10806
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10807
+ /* @__PURE__ */ jsx32("label", { htmlFor: "nameonaccount", children: "Name on account" }),
10808
+ /* @__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 }),
10809
+ (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
11299
10810
  ] }),
11300
- /* @__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)) }) })
11301
- ] })
11302
- ] }) })
11303
- ] })
11304
- ] }) }) })
10811
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10812
+ /* @__PURE__ */ jsx32("label", { htmlFor: "routingnumber", children: "Routing number" }),
10813
+ /* @__PURE__ */ jsx32(
10814
+ "input",
10815
+ {
10816
+ type: "text",
10817
+ id: "routingnumber",
10818
+ className: "form-control-frac",
10819
+ maxLength: 9,
10820
+ placeholder: "000000000",
10821
+ name: "routingNumber",
10822
+ value: (_m = achData == null ? void 0 : achData.routingNumber) != null ? _m : "",
10823
+ onChange: handleChangeAch
10824
+ }
10825
+ ),
10826
+ (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
10827
+ ] }),
10828
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10829
+ /* @__PURE__ */ jsx32("label", { htmlFor: "accountnumber", children: "Account number" }),
10830
+ /* @__PURE__ */ jsx32(
10831
+ "input",
10832
+ {
10833
+ type: "text",
10834
+ id: "accountnumber",
10835
+ className: "form-control-frac",
10836
+ maxLength: 16,
10837
+ placeholder: "0000000000",
10838
+ name: "accountNumber",
10839
+ value: (_n = achData == null ? void 0 : achData.accountNumber) != null ? _n : "",
10840
+ onChange: handleChangeAch
10841
+ }
10842
+ ),
10843
+ (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
10844
+ ] }),
10845
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10846
+ /* @__PURE__ */ jsx32("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
10847
+ /* @__PURE__ */ jsx32(
10848
+ "input",
10849
+ {
10850
+ type: "text",
10851
+ id: "confirmaccountnumber",
10852
+ className: "form-control-frac",
10853
+ maxLength: 16,
10854
+ placeholder: "0000000000",
10855
+ name: "confirmAccountNumber",
10856
+ value: (_o = achData == null ? void 0 : achData.confirmAccountNumber) != null ? _o : "",
10857
+ onChange: handleChangeAch
10858
+ }
10859
+ ),
10860
+ (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
10861
+ ] }),
10862
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10863
+ /* @__PURE__ */ jsx32("label", { htmlFor: "bankname", children: "Bank name" }),
10864
+ /* @__PURE__ */ jsx32(
10865
+ "input",
10866
+ {
10867
+ type: "text",
10868
+ id: "bankname",
10869
+ className: "form-control-frac",
10870
+ maxLength: 100,
10871
+ placeholder: "My Bank",
10872
+ name: "bankName",
10873
+ value: (_p = achData == null ? void 0 : achData.bankName) != null ? _p : "",
10874
+ onChange: handleChangeAch
10875
+ }
10876
+ ),
10877
+ (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
10878
+ ] }),
10879
+ ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10880
+ /* @__PURE__ */ jsx32("label", { htmlFor: "companyName", children: "Company name" }),
10881
+ /* @__PURE__ */ jsx32(
10882
+ "input",
10883
+ {
10884
+ type: "text",
10885
+ id: "companyName",
10886
+ className: "form-control-frac",
10887
+ maxLength: 100,
10888
+ placeholder: "My Company",
10889
+ name: "companyName",
10890
+ value: (_q = achData == null ? void 0 : achData.companyName) != null ? _q : "",
10891
+ onChange: handleChangeAch
10892
+ }
10893
+ ),
10894
+ (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx32("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
10895
+ ] }),
10896
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
10897
+ /* @__PURE__ */ jsx32("label", { htmlFor: "accounttype", children: "Select account type" }),
10898
+ /* @__PURE__ */ jsxs19("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_r = achData == null ? void 0 : achData.accountType) != null ? _r : "", onChange: handleChangeAch, children: [
10899
+ /* @__PURE__ */ jsx32("option", { value: "", children: "Select account" }),
10900
+ accountTypes.map((type) => /* @__PURE__ */ jsx32("option", { value: type.value, children: type.label }, type.value))
10901
+ ] })
10902
+ ] }),
10903
+ /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
10904
+ /* @__PURE__ */ jsx32("input", { type: "checkbox", id: "achconsent", className: "", checked: isBankConsentChecked, onChange: (e) => {
10905
+ setIsBankConsentChecked(e.target.checked);
10906
+ if (e.target.checked) {
10907
+ setErrorBankConsent("");
10908
+ }
10909
+ } }),
10910
+ /* @__PURE__ */ jsx32("label", { className: "saveachlabel", htmlFor: "achconsent", 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.` })
10911
+ ] }),
10912
+ errorBankConsent && /* @__PURE__ */ jsx32("span", { className: "error-span", children: errorBankConsent }),
10913
+ customerId && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
10914
+ /* @__PURE__ */ jsx32("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => setSaveACHinfo(e.target.checked) }),
10915
+ /* @__PURE__ */ jsx32("label", { className: "saveachlabel", htmlFor: "saveACH", children: "Save Bank" })
10916
+ ] }),
10917
+ saveACHinfo && /* @__PURE__ */ jsx32("div", { className: "form-group-frac saveachtext", children: /* @__PURE__ */ jsxs19("p", { children: [
10918
+ "If checked, I agree to give the ",
10919
+ /* @__PURE__ */ jsx32("b", { children: merchantName || "merchant" }),
10920
+ " permission to charge this bank account for agreed-upon purchases in the future."
10921
+ ] }) })
10922
+ ] }),
10923
+ /* @__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)) }) })
10924
+ ] })
10925
+ ] }) })
10926
+ ] }) }) }) })
11305
10927
  ] })
11306
10928
  ] })
11307
10929
  ] })
@@ -11312,7 +10934,7 @@ var ModelContentSky_default = ModelContentSky;
11312
10934
 
11313
10935
  // src/app/components/Skysystemz/PayButtonWithForm.tsx
11314
10936
  import axios10 from "axios";
11315
- import { Fragment as Fragment20, jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
10937
+ import { Fragment as Fragment19, jsx as jsx33, jsxs as jsxs20 } from "react/jsx-runtime";
11316
10938
  var PaymentWidget = ({
11317
10939
  amount,
11318
10940
  bankAmount,
@@ -11423,510 +11045,24 @@ var PaymentWidget = ({
11423
11045
  getskyosOrderDetails();
11424
11046
  }
11425
11047
  }, [show, isPartial, partialRef]);
11426
- return /* @__PURE__ */ jsxs21(Fragment20, { children: [
11427
- /* @__PURE__ */ jsx35("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
11428
- /* @__PURE__ */ jsx35(DataScript, {}),
11429
- /* @__PURE__ */ jsx35(FractalTokenizerScript, {}),
11430
- /* @__PURE__ */ jsx35(SkyChargewidgetstyles, {}),
11431
- /* @__PURE__ */ jsx35(CardBankRadioStyles, {}),
11432
- /* @__PURE__ */ jsx35(CustomModal2styles_default, {}),
11433
- /* @__PURE__ */ jsx35(DataCapScriptLoader, {}),
11434
- !autoTrigger && /* @__PURE__ */ jsxs21("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
11435
- submitBtnText,
11436
- submitBtnIcon
11437
- ] }),
11438
- !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 }))
11439
- ] });
11440
- };
11441
-
11442
- // src/app/components/Skysystemz/EmbeddedCheckout.tsx
11443
- import { useEffect as useEffect17, useState as useState12, useMemo as useMemo2 } from "react";
11444
- import axios11 from "axios";
11445
-
11446
- // src/app/components/Skysystemz/EmbeddedCheckoutStyles.tsx
11447
- import { jsx as jsx36 } from "react/jsx-runtime";
11448
- function EmbeddedCheckoutStyles({ extraCustomCSS }) {
11449
- return /* @__PURE__ */ jsx36("style", { children: `
11450
-
11451
- .pay-amount-conatiner{
11452
- margin-top: 20px !important;
11453
- margin-bottom: 20px !important ;
11454
- }
11455
-
11456
- .frac-pay-container.pay-container {
11457
- grid-template-columns:1fr;
11458
- }
11459
-
11460
-
11461
- /* Card */
11462
- .plan-card {
11463
- width: 100%;
11464
- font-family: Inter, sans-serif;
11465
- background: #fff;
11466
- }
11467
-
11468
- /* Header */
11469
- .card-header {
11470
- padding: 12px 0 0 0;
11471
- }
11472
-
11473
- /* Button */
11474
- .collapse-btn {
11475
- width: 100%;
11476
- background: none;
11477
- border: none;
11478
- display: flex;
11479
- justify-content: space-between;
11480
- align-items: center;
11481
- cursor: pointer;
11482
- font-size: 15px;
11483
- padding: 0;
11484
- }
11485
-
11486
- /* Arrow */
11487
- .arrow {
11488
- transition: transform 0.3s ease;
11489
- height: 8px;
11490
- }
11491
-
11492
- /* Open State */
11493
- .collapse-btn.open .arrow {
11494
- transform: rotate(180deg); /* Down */
11495
- }
11496
-
11497
- /* Body */
11498
- .card-body {
11499
- padding: 0;
11500
- }
11501
-
11502
- /* Plan Header */
11503
- .plan-header {
11504
- font-size: 15px;
11505
- font-weight: 600;
11506
- }
11507
-
11508
- /* Scrollable List */
11509
- .plan-list {
11510
- max-height: 200px;
11511
- overflow-y: auto;
11512
- padding-right: 6px;
11513
- }
11514
-
11515
- /* Items */
11516
- .plan-item {
11517
- display: flex;
11518
- justify-content: space-between;
11519
- padding: 6px 0;
11520
- font-size: 14px;
11521
- }
11522
-
11523
- /* Badges */
11524
- .badge {
11525
- padding: 4px 10px;
11526
- border-radius: 12px;
11527
- font-size: 12px;
11528
- font-weight: 500;
11529
- }
11530
-
11531
- .badge-included {
11532
- background: #f1f3f5;
11533
- color: #495057;
11534
- }
11535
-
11536
- .badge-available {
11537
- background: #f8f9fa;
11538
- color: #212529;
11539
- }
11540
-
11541
- /* Helpers */
11542
- .row-between {
11543
- display: flex;
11544
- justify-content: space-between;
11545
- }
11546
-
11547
- .text-end {
11548
- text-align: right;
11549
- }
11550
-
11551
- .text-muted {
11552
- color: #6c757d;
11553
- font-size: 12px;
11554
- }
11555
-
11556
- .fw-semibold {
11557
- font-weight: 600;
11558
- }
11559
-
11560
- .mb-2 {
11561
- margin-bottom: 8px;
11562
- }
11563
-
11564
- /* Divider */
11565
- .divider {
11566
- height: 1px;
11567
- background: #e5e7eb;
11568
- margin: 8px 0;
11569
- }
11570
-
11571
- /* Collapse Animation */
11572
- .collapse {
11573
- max-height: 0;
11574
- overflow: hidden;
11575
- transition: max-height 0.3s ease;
11576
- }
11577
-
11578
- .collapse.show {
11579
- max-height: 1000px;
11580
- }
11581
- .frac-pay-container.pay-container {
11582
- grid-template-columns:1fr;
11583
- }
11584
- .frac-payment-form-div .amt-pay-con {
11585
- padding-right: 0px;
11586
- }
11587
- .frac-payment-form-div .ach-scrl {
11588
- padding-right: 0px;
11589
- gap: 10px;
11590
- max-height: fit-content !important;
11591
- min-height: fit-content !important;
11592
- overflow: hidden !important;
11593
- }
11594
- .frac-payment-form-div .frac-card-bank-radio-main {
11595
- display: flex;
11596
- flex-direction: row;
11597
- align-items: flex-start;
11598
- align-self: stretch;
11599
- border-radius: 14px;
11600
- border: none;
11601
- overflow: visible;
11602
- gap: 10px;
11603
- }
11604
- .frac-payment-form-div .frac-card-bank-radio {
11605
- display: flex;
11606
- padding: 12px 16px;
11607
- justify-content: space-between;
11608
- align-items: center;
11609
- align-self: stretch;
11610
- width: 50%;
11611
- border: 1px solid #E0DFE2;
11612
- border-radius: 10px;
11613
- box-shadow: rgba(149, 157, 165, 0.2) 0px 1px 4px;
11614
- }
11615
- .frac-payment-form-div .frac-card-bank-radio.frac-active {
11616
- background: #fff;
11617
- border: 2px solid #004eab !important;
11618
- }
11619
-
11620
- .frac-payment-form-div .form-control-frac {
11621
- border: 1px solid #dee2e6 !important;
11622
- border-radius: 0.375rem !important;
11623
- background-color: #F6F6F7;
11624
- box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1);
11625
- }
11626
- .frac-payment-form-div .form-control-frac:focus {
11627
- border: 1px solid #004eab !important;
11628
- }
11629
- .frac-payment-form-div .card-expiry-new {
11630
- border: none;
11631
- gap: 10px;
11632
- }
11633
- .frac-payment-form-div .exp-date-year-container {
11634
- gap: 10px;
11635
- width: 100%;
11636
- }
11637
- .frac-payment-form-div .card-type-logo-wrap{
11638
- position: absolute;
11639
- right: 10px;
11640
- max-width: 30px;
11641
- }
11642
- .detials-wrap.detials-wrap-1 {
11643
- display: flex;
11644
- flex-wrap: wrap;
11645
- }
11646
- @media screen and (max-width: 1280px) {
11647
- .frac-pay-container.pay-container {
11648
- grid-template-columns: 1fr;
11649
- border: none;
11650
- }
11651
- }
11652
- @media screen and (max-width: 899px) {
11653
- .detials-wrap {
11654
- grid-template-columns: 1fr !important;
11655
- }
11656
- .frac-payment-form-div .exp-date-year-container{
11657
- width: 100%;}
11658
-
11659
- }
11660
- @media screen and (max-width: 575px) {
11661
- .frac-payment-form-div .card-type-logo-wrap{
11662
- max-width: 30px;
11663
- }
11664
- form#ACHPaymentForm .ach-scrl {
11665
- grid-template-columns: 1fr !important;
11666
- }
11667
- @media screen and (max-width: 375px) {
11668
- .frac-payment-form-div .exp-date-year-container {
11669
- flex-direction: column;
11670
- }
11671
- .parent-pay-container {
11672
- padding: 10px;
11673
- }
11674
- }
11675
- }
11676
- .box-inner-card-text{
11677
- display: flex;
11678
- gap: 0px;
11679
- flex-direction: column;
11680
- }
11681
- .box-inner-card-text .frac-payment-type-logo {
11682
- width: 17px;
11683
- height: 17px;
11684
- aspect-ratio: 1/1;
11685
- }
11686
- .exp-date-year-wrap.form-control-frac input {
11687
- background: transparent;
11688
- border: none;
11689
- outline: none;
11690
- font-size: 1rem;
11691
- font-weight: 400;
11692
- }
11693
- .exp-date-year-wrap.form-control-frac {
11694
- display: flex;
11695
- gap: 2px;
11696
- }
11697
- .exp-date-year-wrap input.exp-month {
11698
- width: 32px;
11699
- }
11700
- .detials-wrap {
11701
- display: grid;
11702
- grid-template-columns: 1fr 1fr;
11703
- gap: 10px;
11704
- }
11705
- .detials-wrap.detials-wrap-2{
11706
- grid-template-columns: 1fr 1fr;
11707
- }
11708
- form#ACHPaymentForm .ach-scrl {
11709
- display: grid;
11710
- grid-gap: 0px 10px;
11711
- grid-template-columns: 1fr;
11712
- }
11713
- .plan-list {
11714
- max-height: 130px;
11715
- min-height: 130px;
11716
- overflow-y: auto;
11717
- padding-right: 6px;
11718
- }
11719
- .plan-list::-webkit-scrollbar {
11720
- width: 3px;
11721
- background-color: #F5F5F5;
11722
- }
11723
- .plan-list::-webkit-scrollbar-thumb {
11724
- background-color: #35254D;
11725
- }
11726
- div#cvv {
11727
- border-top-left-radius: 0;
11728
- border-bottom-left-radius: 0;
11729
- border-top: 0;
11730
- border-bottom: 0;
11731
- border-right: 0;
11732
- }
11733
- div#exp_year {
11734
- height: 36px;
11735
- width: calc(100% + 1px);
11736
- border-radius: 0;
11737
- border-top: 0;
11738
- border-bottom: 0;
11739
- border-right: 1px solid #dee2e6;
11740
- }
11741
- div#exp_month {
11742
- width: calc(100% + 1px);
11743
- border-top-right-radius: 0;
11744
- border-bottom-right-radius: 0;
11745
- border: 0;
11746
- border-right: 1px solid #dee2e6;
11747
- }
11748
- .exp-date-year-container .form-group {
11749
- flex: 1;
11750
- }
11751
- .input-main-wrap-frac{
11752
- margin:0px !important;
11753
- padding:0px !important;
11754
- }
11755
- .toggle-num-wrapper.toggle-num-wrapper-new {
11756
- border: 1px solid #dee2e6 !important;
11757
- border-radius: 0.375rem !important;
11758
- background-color: #F6F6F7;
11759
- box-shadow: 1px 1px 2px inset rgba(0, 0, 0, 0.1);
11760
- }
11761
- .toggle-num-wrapper-new div#card_number {
11762
- padding: 0px 10px;
11763
- border: none;
11764
- border-bottom: 1px solid #dee2e6;
11765
- }
11766
- .toggle-num-wrapper-new .card-crdi.card-expiry-new {
11767
- padding: 0px 10px;
11768
- }
11769
- .toggle-num-wrapper-new .input-main-wrap-frac {
11770
- height: 36px;
11771
- }
11772
- .toggle-num-wrapper-new:focus {
11773
- border: 1px solid #004eab !important;
11774
- }
11775
- .frac-card-title-main {
11776
- display: flex;
11777
- align-items: start;
11778
- gap: 4px;
11779
- flex-direction: column;
11780
- }
11781
- .parent-pay-container {
11782
- padding: 24px;
11783
- background-color: #ffffff !important;
11784
- border-radius: 15px;
11785
- min-width: 300px;
11786
- }
11787
-
11788
-
11789
- ${extraCustomCSS}
11790
-
11791
- ` });
11792
- }
11793
-
11794
- // src/app/components/Skysystemz/EmbeddedCheckout.tsx
11795
- import { Fragment as Fragment21, jsx as jsx37, jsxs as jsxs22 } from "react/jsx-runtime";
11796
- var EmbeddedCheckout = ({
11797
- amount,
11798
- bankAmount,
11799
- submitBtnText = "Pay",
11800
- session_token,
11801
- customerId,
11802
- callback,
11803
- merchantName = "merchant",
11804
- isPreAuth,
11805
- surcharge = "0",
11806
- submitBtnClass,
11807
- submitBtnIcon,
11808
- isRequest,
11809
- pass_fee,
11810
- pass_fee_amount,
11811
- require3ds = false,
11812
- autoTrigger = false,
11813
- isPartial,
11814
- bankSurcharge,
11815
- partialRef,
11816
- onSubmit,
11817
- onLoad,
11818
- customCSS: customCSS2
11819
- }) => {
11820
- const [show, setShow] = useState12(false);
11821
- const [loading, setLoading] = useState12(false);
11822
- const [childHandleClose, setChildHandleClose] = useState12(() => () => {
11823
- });
11824
- const [orderGuid, setOrderGuid] = useState12(null);
11825
- const [remainingAmount, setRemainingAmount] = useState12(null);
11826
- const initialCommonProps = useMemo2(
11827
- () => ({
11828
- amount,
11829
- bankAmount,
11830
- submitBtnText,
11831
- session_token,
11832
- customerId,
11833
- callback,
11834
- merchantName,
11835
- isPreAuth,
11836
- surcharge,
11837
- submitBtnClass,
11838
- submitBtnIcon,
11839
- isRequest,
11840
- pass_fee,
11841
- pass_fee_amount,
11842
- require3ds,
11843
- autoTrigger,
11844
- setShow,
11845
- setHandleCloseRef: setChildHandleClose,
11846
- isPartial,
11847
- bankSurcharge,
11848
- partialRef
11849
- }),
11850
- [
11851
- amount,
11852
- bankAmount,
11853
- submitBtnText,
11854
- session_token,
11855
- customerId,
11856
- callback,
11857
- merchantName,
11858
- isPreAuth,
11859
- surcharge,
11860
- submitBtnClass,
11861
- submitBtnIcon,
11862
- isRequest,
11863
- pass_fee,
11864
- pass_fee_amount,
11865
- require3ds,
11866
- autoTrigger,
11867
- isPartial,
11868
- bankSurcharge,
11869
- partialRef
11870
- ]
11871
- );
11872
- const [commonProps, setCommonProps] = useState12(initialCommonProps);
11873
- useEffect17(() => {
11874
- if (show) {
11875
- setCommonProps(initialCommonProps);
11876
- }
11877
- }, [show, initialCommonProps]);
11878
- const getskyosOrderDetails = async () => {
11879
- var _a;
11880
- setLoading(true);
11881
- try {
11882
- const res = await axios11.get(
11883
- `${masterBaseUrl}api/v1/gateway/get-order-details/${session_token}`,
11884
- { params: { isPartial, partialRef } }
11885
- );
11886
- if ((_a = res == null ? void 0 : res.data) == null ? void 0 : _a.result) {
11887
- const data = res.data.data;
11888
- if (data == null ? void 0 : data.orderGuid) {
11889
- setOrderGuid(data == null ? void 0 : data.orderGuid);
11890
- setRemainingAmount(data == null ? void 0 : data.remainingAmount);
11891
- }
11892
- setCommonProps((prev) => __spreadProps(__spreadValues({}, prev), {
11893
- amount: data.amount,
11894
- pass_fee_amount: data.pass_fee_amount,
11895
- pass_fee: data.pass_fee
11896
- }));
11897
- }
11898
- } catch (error) {
11899
- console.log("error while getting skyosorderdeatils", error);
11900
- } finally {
11901
- setLoading(false);
11902
- }
11903
- };
11904
- useEffect17(() => {
11905
- if (show && isPartial && partialRef) {
11906
- getskyosOrderDetails();
11907
- }
11908
- }, [show, isPartial, partialRef]);
11909
- console.log(onLoad, "onLoad");
11910
- return /* @__PURE__ */ jsxs22(Fragment21, { children: [
11911
- /* @__PURE__ */ jsx37("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
11912
- /* @__PURE__ */ jsx37(DataScript, {}),
11913
- /* @__PURE__ */ jsx37(FractalTokenizerScript, {}),
11914
- /* @__PURE__ */ jsx37(SkyChargewidgetstyles, {}),
11915
- /* @__PURE__ */ jsx37(CardBankRadioStyles, {}),
11916
- /* @__PURE__ */ jsx37(CustomModal2styles_default, {}),
11917
- /* @__PURE__ */ jsx37(DataCapScriptLoader, {}),
11918
- /* @__PURE__ */ jsx37(EmbeddedCheckoutStyles, { extraCustomCSS: customCSS2 }),
11919
- !autoTrigger && /* @__PURE__ */ jsxs22("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
11048
+ return /* @__PURE__ */ jsxs20(Fragment19, { children: [
11049
+ /* @__PURE__ */ jsx33("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
11050
+ /* @__PURE__ */ jsx33(DataScript, {}),
11051
+ /* @__PURE__ */ jsx33(FractalTokenizerScript, {}),
11052
+ /* @__PURE__ */ jsx33(SkyChargewidgetstyles, {}),
11053
+ /* @__PURE__ */ jsx33(CardBankRadioStyles, {}),
11054
+ /* @__PURE__ */ jsx33(CustomModal2styles_default, {}),
11055
+ /* @__PURE__ */ jsx33(DataCapScriptLoader, {}),
11056
+ !autoTrigger && /* @__PURE__ */ jsxs20("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
11920
11057
  submitBtnText,
11921
11058
  submitBtnIcon
11922
11059
  ] }),
11923
- !autoTrigger ? /* @__PURE__ */ jsx37(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx37(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx37(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
11060
+ !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 }))
11924
11061
  ] });
11925
11062
  };
11926
11063
  export {
11927
11064
  AddCardEasyPay as AddCard,
11928
11065
  CardOnFile,
11929
- EmbeddedCheckout,
11930
11066
  GetPaymentPage,
11931
11067
  PartialPayment,
11932
11068
  PaymentWidget,