paymob-pixel-alpha 1.1.47 → 1.1.49

package/main.js

@@ -81178,7 +81178,6 @@ function Knet(props) {
   const formattedAmount = formatNumber(Number(amount), currency);
   const formattedEquivalentAmount = formatNumber(Number(EquivalentAmount || amount), KnetCurrency || currency);
   const displayAmount = formattedEquivalentAmount || formattedAmount;
-  const displayCurrenc = KnetCurrency || currency;
   const {
     displayCurrency,
     currencyFontFamily
@@ -81225,7 +81224,7 @@ function Knet(props) {
       })
     }), !disablePay && /*#__PURE__*/(0,jsx_runtime.jsx)(Button_Button, {
       id: "pay-button",
-      label: `${(_customStyle$knetText7 = customStyle == null || (_customStyle$knetText8 = customStyle.knetText) == null ? void 0 : _customStyle$knetText8.PAY_KNET_BUTTON) != null ? _customStyle$knetText7 : t('PAY')} ${displayCurrenc} ${displayAmount}`,
+      label: `${(_customStyle$knetText7 = customStyle == null || (_customStyle$knetText8 = customStyle.knetText) == null ? void 0 : _customStyle$knetText8.PAY_KNET_BUTTON) != null ? _customStyle$knetText7 : t('PAY')} ${displayCurrency} ${displayAmount}`,
       fullWidth: true,
       color: 'primary',
       customStyle: customStyle == null ? void 0 : customStyle.button,
@@ -81267,9 +81266,7 @@ function KnetElement({
   payment,
   customStyle,
   paymentMethodsCount,
-  disablePay,
-  onPaymentStart,
-  onPaymentEnd
+  disablePay
 }) {
   const [loading, setLoading] = (0,react.useState)(false);
   const {
@@ -81287,7 +81284,6 @@ function KnetElement({
   const handlePay = async () => {
     try {
       var _res$data, _res$data2;
-      onPaymentStart == null || onPaymentStart(payment.type);
       setLoading(true);
       const res = await payWithKnet(payment == null ? void 0 : payment.token, String(amountInCents));
       const redirectionUrl = ((_res$data = res.data) == null ? void 0 : _res$data.redirection_url) || ((_res$data2 = res.data) == null ? void 0 : _res$data2.redirect_url);
@@ -81296,7 +81292,6 @@ function KnetElement({
       }
     } catch (error) {
       console.error('Payment error:', error);
-      onPaymentEnd == null || onPaymentEnd();
     } finally {
       setLoading(false);
     }
@@ -81596,7 +81591,7 @@ const knetApplePayPayment = async (applePaytoken, paymentToken, clientData) => {
 };
 ;// ./src/components/Payments/KnetApplePay/index.tsx
 
-const KnetApplePay_excluded = ["payment", "customStyle", "onBeforePaymentComplete", "onAfterPaymentComplete", "onPaymentCancel", "isLoading", "country", "paymentMethodsCount", "onPaymentStart", "onPaymentEnd"];
+const KnetApplePay_excluded = ["payment", "customStyle", "onBeforePaymentComplete", "onAfterPaymentComplete", "onPaymentCancel", "isLoading", "country", "paymentMethodsCount"];
 
 
 
@@ -81611,9 +81606,7 @@ function KnetApplePayElement(_ref) {
       onPaymentCancel,
       isLoading,
       country,
-      paymentMethodsCount,
-      onPaymentStart,
-      onPaymentEnd
+      paymentMethodsCount
     } = _ref,
     restProps = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(_ref, KnetApplePay_excluded);
   const {
@@ -81644,15 +81637,9 @@ function KnetApplePayElement(_ref) {
     validatemerchant: validatemerchant,
     knetApplePayPayment: knetApplePayPayment,
     onSubmit: handleSubmit,
-    onBeforePaymentComplete: data => {
-      onPaymentStart == null || onPaymentStart(payment.type);
-      return onBeforePaymentComplete == null ? void 0 : onBeforePaymentComplete(data);
-    },
+    onBeforePaymentComplete: onBeforePaymentComplete,
     onAfterPaymentComplete: onAfterPaymentComplete,
-    onPaymentCancel: () => {
-      onPaymentEnd == null || onPaymentEnd();
-      onPaymentCancel == null || onPaymentCancel();
-    },
+    onPaymentCancel: onPaymentCancel,
     customStyle: customStyle,
     isLoading: isLoading,
     paymentName: payment.name,
@@ -82410,7 +82397,7 @@ const renderSelectedPaymentMethod = (selectedPaymentMethod, restProps = {}) => {
 ;// ./src/constants/paymentNames.ts
 const PAYMENT_NAMES = {
   "CARD": 'Card',
-  "KNET": 'KNET ',
+  "KNET": 'KNET Card',
   "KNET_APPLE_PAY": 'KNET Apple Pay'
 };
 ;// ./src/utils/classNames.ts
@@ -82424,8 +82411,7 @@ const TabElement = ({
   selectedPaymentMethodType,
   setSelectedPayment,
   icon,
-  customStyle,
-  disabled
+  customStyle
 }) => {
   var _customStyle$button;
   const {
@@ -82443,11 +82429,8 @@ const TabElement = ({
   };
   const isSelected = selectedPaymentMethodType === type;
   return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-    onClick: () => {
-      if (disabled) return;
-      setSelectedPayment(paymentMethod);
-    },
-    className: classNames('text-gray-500 font-semibold text-sm flex flex-col items-start gap-2 border p-3 relative rounded-xl transition-all duration-300 cursor-pointer text-start flex-1', 'w-full sm:w-1/3 md:w-1/4 lg:w-1/6', isSelected ? 'text-blue-500 border-blue-500' : 'border-gray-200', disabled && 'opacity-50 cursor-not-allowed'),
+    onClick: () => setSelectedPayment(paymentMethod),
+    className: classNames('text-gray-500 font-semibold text-sm flex flex-col items-start gap-2 border p-3 relative rounded-xl transition-all duration-300 cursor-pointer text-start flex-1', 'w-full sm:w-1/3 md:w-1/4 lg:w-1/6', isSelected ? 'text-blue-500 border-blue-500' : 'border-gray-200'),
     style: customStyle != null && (_customStyle$button = customStyle.button) != null && _customStyle$button.borderColor && isSelected ? {
       borderColor: customStyle.button.borderColor,
       borderRadius: customStyle.tabs.borderRadius
@@ -82467,7 +82450,7 @@ const TabElement = ({
 };
 ;// ./src/components/Payments/List/TabView.tsx
 
-const TabView_excluded = ["paymentMethods", "isPaymentInProgress"];
+const TabView_excluded = ["paymentMethods"];
 
 
 
@@ -82476,8 +82459,7 @@ const TabView_excluded = ["paymentMethods", "isPaymentInProgress"];
 function TabView(props) {
   var _restProps$customStyl;
   const {
-      paymentMethods,
-      isPaymentInProgress
+      paymentMethods
     } = props,
     restProps = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(props, TabView_excluded);
   const firstPaymentMethod = (paymentMethods == null ? void 0 : paymentMethods[0]) || null;
@@ -82502,23 +82484,19 @@ function TabView(props) {
         paymentMethod: paymentMethod,
         icon: getPaymentLogo_getPaymentLogo(paymentMethod.type),
         setSelectedPayment: selected => {
-          if (isPaymentInProgress) return;
           setSelectedPaymentMethod(Object.assign({}, selected, {
             userSelected: true
           }));
         },
-        customStyle: restProps.customStyle,
-        disabled: isPaymentInProgress && isPaymentInProgress !== paymentMethod.type
+        customStyle: restProps.customStyle
       }, paymentMethod.type))
-    }), renderSelectedPaymentMethod(selectedPaymentMethod, Object.assign({}, restProps, {
-      isPaymentInProgress
-    }))]
+    }), renderSelectedPaymentMethod(selectedPaymentMethod, restProps)]
   });
 }
 /* harmony default export */ const List_TabView = (TabView);
 ;// ./src/components/Payments/List/ListView.tsx
 
-const ListView_excluded = ["paymentMethods", "customStyle", "isPaymentInProgress"];
+const ListView_excluded = ["paymentMethods", "customStyle"];
 
 
 
@@ -82528,8 +82506,7 @@ const ListView = _ref => {
   var _customStyle$paymentM2;
   let {
       paymentMethods,
-      customStyle,
-      isPaymentInProgress
+      customStyle
     } = _ref,
     restProps = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(_ref, ListView_excluded);
   const [selectedPaymentMethod, setSelectedPaymentMethod] = (0,react.useState)(null);
@@ -82550,7 +82527,6 @@ const ListView = _ref => {
     return PAYMENT_NAMES[normalized];
   };
   const toggleAccordion = (index, payment) => {
-    if (isPaymentInProgress) return;
     setOpenIndex(prevIndex => prevIndex === index ? null : index);
     setSelectedPaymentMethod(Object.assign({}, payment, {
       userSelected: true
@@ -82568,133 +82544,16 @@ const ListView = _ref => {
       type: paymentMethod.type,
       isOpen: openIndex === index,
       toggleAccordion: () => toggleAccordion(index, paymentMethod),
-      disabled: isPaymentInProgress && isPaymentInProgress !== paymentMethod.type,
       content: openIndex === index ? renderSelectedPaymentMethod(paymentMethod, Object.assign({}, restProps, {
-        customStyle,
-        isPaymentInProgress
+        customStyle
       })) : null
     }, paymentMethod.id))]
   });
 };
 /* harmony default export */ const List_ListView = ((/* unused pure expression or super */ null && (ListView)));
-;// ../../apps/elements/src/environments/environment.ts
-// This file can be replaced during build by using the `fileReplacements` array.
-// When building for production, this file is replaced with `environment.prod.ts`.
+;// ./src/components/Payments/List/index.tsx
 
-const environment_environment = {
-  production: false,
-  API_URL_EG: 'https://accept-alpha.paymob.com',
-  API_URL_AE: 'https://international-staging.paymob.com',
-  API_URL_SA: 'https://international-staging.paymob.com',
-  API_URL_PK: 'https://international-staging.paymob.com',
-  API_URL_OM: 'https://international-staging.paymob.com',
-  API_URL_DEFAULT: 'https://accept-alpha.paymob.com',
-  IFRAME_PATH: 'unifiedcheckout/iframe-card',
-  PIXEL_CSS_LINKS: ['https://cdn.jsdelivr.net/npm/paymob-pixel-alpha@latest/styles.css', 'https://cdn.jsdelivr.net/npm/paymob-pixel-alpha@latest/main.css', 'https://cdn.jsdelivr.net/npm/paymob-pixel-alpha@latest/Inter.woff2', 'https://cdn.jsdelivr.net/npm/paymob-pixel-alpha@latest/Inter.woff', 'https://cdn.jsdelivr.net/npm/paymob-pixel-alpha@latest/Inter.ttf']
-};
-;// ../../apps/elements/src/components/Payments/Card/card.module.scss
-// extracted by mini-css-extract-plugin
-/* harmony default export */ const Card_card_module = ({"action-btn":"card_action-btn__crD1m","gotham":"card_gotham__H601r","iframe":"card_iframe__eUHY1"});
-;// ../../apps/elements/src/services/cardService.ts
 
-const cardService_payWithSavedCard = payload => {
-  return lib_axios.post(`/api/acceptance/payments/pay`, {
-    source: {
-      identifier: payload.identifier,
-      subtype: 'TOKEN',
-      cvn: payload.cvv,
-      unified_checkout: payload.isElements ? 'False' : 'True'
-    },
-    payment_token: payload.token,
-    unified_checkout: payload.isElements ? 'False' : 'True',
-    api_source: 'PIXEL'
-  }).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-const cardService_checkDiscount = (payment_token, integration_id, identifier, isSavedCard) => {
-  return lib_axios.post(`/api/acceptance/transaction_discount/use-discount`, Object.assign({
-    payment_token,
-    integration_id,
-    subtype: 'CARD'
-  }, !isSavedCard && {
-    identifier: identifier.replace(/\s/g, '')
-  }, isSavedCard && {
-    saved_card_token: identifier
-  })).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-const cardService_lookupFees = (payment_token, identifier) => {
-  return lib_axios.post(`/api/acceptance/caf-fee-lookup/lookup-fees`, {
-    payment_token,
-    card_token: identifier
-  }).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-const cardService_sendOTP = payload => {
-  return lib_axios.post(`/api/acceptance/omannet_callback/otp_verify`, {
-    payment_id: payload.paymentId,
-    otp: payload.otp,
-    payment_token: payload.token
-  }).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-;// ../../apps/elements/src/utils/getErrorMsg.ts
-const utils_getErrorMsg_isString = data => typeof data === 'string';
-const getErrorMsg_DECLINED_MESSAGE = 'Payment is declined';
-const getErrorMsg_getErrorMsg = err => {
-  var _data$data, _data$data2;
-  const data = err == null ? void 0 : err.data;
-  if (!err) {
-    return getErrorMsg_DECLINED_MESSAGE;
-  }
-  if (utils_getErrorMsg_isString(err)) {
-    return err;
-  }
-  if (data != null && data['data.message'] && utils_getErrorMsg_isString(data['data.message'])) {
-    return data['data.message'];
-  }
-  if (data != null && data.message && utils_getErrorMsg_isString(data.message)) {
-    return data.message;
-  }
-  if (data != null && data.msg && utils_getErrorMsg_isString(data.msg)) {
-    return data.msg;
-  }
-  if (data != null && data.detail && utils_getErrorMsg_isString(data.detail)) {
-    return data.detail;
-  }
-  if (data != null && data.error && utils_getErrorMsg_isString(data.error)) {
-    return data.error;
-  }
-  if (data != null && data.error_message && utils_getErrorMsg_isString(data.error_message)) {
-    return data.error_message;
-  }
-  if (data != null && (_data$data = data.data) != null && _data$data.message && utils_getErrorMsg_isString((_data$data2 = data.data) == null ? void 0 : _data$data2.message)) {
-    var _data$data3;
-    return (_data$data3 = data.data) == null ? void 0 : _data$data3.message;
-  }
-  if (Array.isArray(data) && utils_getErrorMsg_isString(data[0])) {
-    return data[0];
-  }
-  return getErrorMsg_DECLINED_MESSAGE;
-};
-;// ../../apps/elements/src/constants/index.ts
-const constants_INTEGRATION_TYPE = {
-  DIRECT_PAYMENT: 'directPayment',
-  TOKENIZATION: 'tokenization'
-};
-;// ../../apps/elements/src/utils/getFieldErrorMessage.ts
-const getFieldErrorMessage_isRequiredError = error => error.includes('required');
-function getFieldErrorMessage_getFieldErrorMessage({
-  nativeError,
-  customError
-}) {
-  if (!customError) return nativeError;
-  if (typeof customError === 'string') return customError;
-  if (getFieldErrorMessage_isRequiredError(nativeError) && customError.required) {
-    return customError.required;
-  }
-  if (!getFieldErrorMessage_isRequiredError(nativeError) && customError.invalid) {
-    return customError.invalid;
-  }
-  return nativeError;
-}
-;// ../../apps/elements/src/components/Payments/Card/index.tsx
 
 
 
@@ -82702,1180 +82561,58 @@ function getFieldErrorMessage_getFieldErrorMessage({
 
 
 
-// import { DeleteCard } from '@unified-checkout/card';
 
 
 
 
 
-const Card_CardElement = /*#__PURE__*/(0,react.forwardRef)(({
-  payment,
-  customStyle,
-  tenure,
-  baseUrl,
-  savedCards,
-  disablePay,
-  forceSaveCard,
-  showSaveCard,
-  isList,
-  onBeforePaymentComplete,
-  onAfterPaymentComplete,
-  onCardValidationChanged,
-  showPaymobLogo,
-  hideCardHolderName,
-  isLoading,
-  country,
-  integrationType,
-  publicKey,
-  discounts,
-  onPaymentCancel
-}, ref) => {
-  var _customStyle$discount, _customStyle$containe, _customStyle$containe2, _customStyle$button, _customStyle$containe3, _customStyle$labelTex, _customStyle$buttonTe, _customStyle$placehol, _customStyle$discount2, _customStyle$discount3, _customStyle$errorTex, _customStyle$errorTex2, _customStyle$errorTex3, _customStyle$errorTex4, _customStyle$hintText, _customStyle$labelTex2, _customStyle$buttonTe2, _customStyle$labelTex3, _customStyle$buttonTe3, _customStyle$buttonTe4;
+
+const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
+  var _customStyle$containe;
   const {
-    amount,
-    currency,
-    paymentMethodType,
-    useCvv
-  } = payment;
+    payments,
+    customStyle,
+    baseUrl,
+    savedCards,
+    forceSaveCard,
+    showSaveCard,
+    disablePay,
+    onBeforePaymentComplete,
+    onAfterPaymentComplete,
+    onPaymentCancel,
+    onCardValidationChanged,
+    showPaymobLogo,
+    hideCardHolderName,
+    publicKey,
+    clientSecret,
+    selectedPaymentMethods,
+    integrationType,
+    discounts,
+    viewMode
+  } = props;
   const {
     t
-  } = useTranslation_useTranslation('card');
-  const {
-    t: tPaymentLayout
   } = useTranslation_useTranslation('flash', {
-    keyPrefix: 'paymentLayout'
+    keyPrefix: 'paymentsList'
   });
-  const isMobile = useWidth_useWidth();
-  const [loading, setLoading] = (0,react.useState)(false);
-  const [cardHolderName, setCardHolderName] = (0,react.useState)('');
-  const [isActionBtnDisabled, setIsActionBtnDisabled] = (0,react.useState)(false);
-  const [shouldSubmitData, setShouldSubmitData] = (0,react.useState)(false);
-  const [saveCard, setSaveCard] = (0,react.useState)(false);
-  const [height, setHeight] = (0,react.useState)(80);
+  const [paymentList, setPaymentList] = (0,react.useState)(payments);
+  const [savedCardsList, setSavedCardsList] = (0,react.useState)(savedCards);
   const [errorMessage, setErrorMessage] = (0,react.useState)('');
-  const iframeRef = (0,react.useRef)(null);
-  const iframeCVVRefs = (0,react.useRef)({});
-  const [errors, setErrors] = (0,react.useState)({});
-  const [isIframeLoaded, setIsIframeLoaded] = (0,react.useState)(false);
-  const [showDeleteCardModal, setShowDeleteCardModal] = (0,react.useState)(false);
-  const [selectedDeleteCard, setSelectedDeleteCard] = (0,react.useState)();
-  const [selectedCard, setSelectedCard] = (0,react.useState)();
-  const [selectedCardCVV, setSelectedCardCVV] = (0,react.useState)('');
-  const [showCardModal, setShowCardModal] = (0,react.useState)(false);
-  const [showCVVTooltipModal, setShowCVVTooltipModal] = (0,react.useState)(false);
-  const previousValidationRef = (0,react.useRef)(false);
-  const [showOTP, setShowOTP] = (0,react.useState)(false);
-  const [sendOTPLoading, setSendOTPLoading] = (0,react.useState)(false);
-  const [paymentId, setPaymentId] = (0,react.useState)('');
-  const [otpErrorMessage, setOTPErrorMessage] = (0,react.useState)('');
-  const [isOmanNetCard, setIsOmanNetCard] = (0,react.useState)(false);
-  const tokenizationResolve = (0,react.useRef)(null);
-  const isCardValid = hideCardHolderName ? !isActionBtnDisabled : !(isActionBtnDisabled || !cardHolderName);
-  const isAmexCardSelected = (selectedCard == null ? void 0 : selectedCard.type) === src_constants_CARD_TYPES.AMEX;
-  const selectedCardCvvLength = selectedCardCVV.length;
-  const selectedCardId = selectedCard == null ? void 0 : selectedCard.id;
-  const [discountAppliedMessage, setDiscountAppliedMessage] = (0,react.useState)(null);
-  const [discountErrorMessage, setDiscountErrorMessage] = (0,react.useState)('');
-  const [totalAmount, setTotalAmount] = (0,react.useState)('');
-  const {
-    displayCurrency,
-    currencyFontFamily
-  } = formatCurrencyForDisplay_formatCurrencyForDisplay(currency);
-  const [showFeesDetails, setShowFeesDetails] = (0,react.useState)(false);
-  const [discountedAmount, setDiscountedAmount] = (0,react.useState)('');
-  const [feesAmount, setFeesAmount] = (0,react.useState)((payment == null ? void 0 : payment.feesAmount) || '');
-  const [updatedPaymentToken, setUpdatedPaymentToken] = (0,react.useState)('');
-  const showCvvInput = paymentMethodType === constants_PAYMENT_METHODS_TYPES.MOTO && useCvv || paymentMethodType === constants_PAYMENT_METHODS_TYPES.ONLINE;
-  const shouldDisablePayBtn = showCvvInput ? loading || (isAmexCardSelected ? selectedCardCvvLength !== src_constants_AMEX_CVV_LENGTH : selectedCardCvvLength !== constants_CVV_LENGTH) : !selectedCardId;
-  (0,react.useEffect)(() => {
-    const handleDataFromIframe = event => {
-      var _iframeRef$current, _event$data, _event$data2, _event$data3, _event$data4, _event$data5, _event$data6;
-      if (!event.data) return;
-      if (!event.data.type) return;
-      const isFromCVVIframe = Object.values(iframeCVVRefs.current).some(ref => (ref == null || ref.getContentWindow == null ? void 0 : ref.getContentWindow()) === event.source);
-      if (!isFromCVVIframe && event.source !== ((_iframeRef$current = iframeRef.current) == null ? void 0 : _iframeRef$current.contentWindow)) {
-        return;
-      }
-      if (event.data.shouldFocusOnCardName) {
-        var _iframeRef$current2;
-        const cardNameField = (_iframeRef$current2 = iframeRef.current) == null || (_iframeRef$current2 = _iframeRef$current2.nextElementSibling) == null ? void 0 : _iframeRef$current2.querySelector(`input[name=name]`);
-        if (cardNameField !== null) {
-          cardNameField == null || cardNameField.focus();
-        }
-      }
-      if (event.data.iframeCardHight) {
-        setHeight(event.data.iframeCardHight);
-      }
-      if (event.data.selectedCardCVV) {
-        setSelectedCardCVV(event.data.selectedCardCVV);
-      }
-      if (event.data.showCardModal !== undefined) {
-        setShowCardModal(event.data.showCardModal);
-      }
-      if (event.data.errors) {
-        setErrors(event.data.errors);
-      }
-      if (event.data.shouldDisableActionBtn !== undefined) {
-        setIsActionBtnDisabled(event.data.shouldDisableActionBtn);
-      }
-      if (event.data.loading !== undefined) {
-        setLoading(event.data.loading);
-      }
-      if ((event == null || (_event$data = event.data) == null ? void 0 : _event$data.type) === 'paymentResponse') {
-        handlePaymentResponse(event.data.response);
-      }
-      if ((event == null || (_event$data2 = event.data) == null ? void 0 : _event$data2.type) === 'openCVVToolTipModal') {
-        setShowCVVTooltipModal(true);
-      }
-      if ((event == null || (_event$data3 = event.data) == null ? void 0 : _event$data3.type) === 'tokenizationResponse' && tokenizationResolve.current) {
-        tokenizationResolve.current(event.data.response.res);
-        tokenizationResolve.current = null;
-      }
-      if ((event == null || (_event$data4 = event.data) == null ? void 0 : _event$data4.type) === 'discountResponse') {
-        var _event$data$response;
-        handleDiscount((_event$data$response = event.data.response) == null ? void 0 : _event$data$response.res);
-      }
-      if ((event == null || (_event$data5 = event.data) == null ? void 0 : _event$data5.type) === 'isIframeLoaded') {
-        setIsIframeLoaded(true);
-      }
-      if ((event == null || (_event$data6 = event.data) == null ? void 0 : _event$data6.type) === 'feesResponse') {
-        var _event$data$response2;
-        handleFees((_event$data$response2 = event.data.response) == null ? void 0 : _event$data$response2.res);
-      }
-    };
-    const handlePaymentResponse = ({
-      res,
-      requiresOTP,
-      isOmanNetCard
-    }) => {
-      var _iframeRef$current3, _res$data, _res$data2, _res$data3;
-      setShouldSubmitData(false);
-      setSendOTPLoading(false);
-      setIsOmanNetCard(false);
-      const cardHolderInput = (_iframeRef$current3 = iframeRef.current) == null || (_iframeRef$current3 = _iframeRef$current3.nextElementSibling) == null ? void 0 : _iframeRef$current3.querySelector(`input[name=name]`);
-      if (cardHolderInput) {
-        setTimeout(() => cardHolderInput.disabled = false, 1000);
-      }
-      const redirectionUrl = ((_res$data = res.data) == null ? void 0 : _res$data.redirection_url) || ((_res$data2 = res.data) == null ? void 0 : _res$data2.redirect_url);
-      if (requiresOTP) {
-        setIsOmanNetCard(!!isOmanNetCard);
-        setPaymentId(res.data.payment_id);
-        setShowOTP(true);
-      } else if (onAfterPaymentComplete && ((_res$data3 = res.data) == null ? void 0 : _res$data3.is_3d_secure) !== 'true') {
-        onAfterPaymentComplete(res);
-      } else if (res.status === 200 && redirectionUrl) {
-        window.location.href = redirectionUrl;
-      } else if (res.status === 400) {
-        var _res$data4, _res$data5, _res$data6;
-        if (res.data instanceof Array && res.data[0] === 'Retry limit reached.' || ((_res$data4 = res.data) == null ? void 0 : _res$data4.msg) === 'Retry limit reached.') {
-          setErrorMessage(t('ERR_MSG_EXCEEDED_TRIALS'));
-        } else if (((_res$data5 = res.data) == null ? void 0 : _res$data5.message) === 'Session Error') {
-          setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-        } else if (res.data instanceof Array && res.data[0] === 'Order has already paid.' || ((_res$data6 = res.data) == null ? void 0 : _res$data6.msg) === 'Order has already paid.') {
-          setErrorMessage(t('ERR_MSG_ALREADY_PAID'));
-        } else {
-          setErrorMessage(t('ERR_MSG_DECLINED'));
-        }
-      } else if (res.status === 401) {
-        setErrorMessage(t('ERR_MSG_EXPIRED'));
-      } else if (res.status === 422) {
-        setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-      } else if (res.status === 403) {
-        setErrorMessage(t('ERR_MSG_EXCEEDED_TRIALS'));
-      } else if (res.status === 406) {
-        setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-      } else {
-        setErrorMessage(t('ERR_MSG_SOMETHING_WENT_WRONG'));
-      }
-    };
-    window.addEventListener('message', handleDataFromIframe);
-    return () => {
-      window.removeEventListener('message', handleDataFromIframe);
-    };
-  }, []);
-  (0,react.useEffect)(() => {
-    const hasSavedCards = savedCards == null ? void 0 : savedCards.length;
-    const shouldListenToSavedCardSubmit = hasSavedCards && !shouldDisablePayBtn && !showCardModal;
-    const shouldListenToPayWithoutButton = hasSavedCards && showCardModal && isCardValid || !hasSavedCards && isCardValid;
-    if (disablePay) {
-      if (shouldListenToSavedCardSubmit) {
-        window.addEventListener('payFromOutside', handleSavedCardSubmit);
-      } else {
-        window.removeEventListener('payFromOutside', handleSavedCardSubmit);
-      }
-      if (shouldListenToPayWithoutButton) {
-        window.addEventListener('payFromOutside', handlePayWithoutButton);
-      } else {
-        window.removeEventListener('payFromOutside', handlePayWithoutButton);
-      }
-    }
-    return () => {
-      if (disablePay) {
-        window.removeEventListener('payFromOutside', handlePayWithoutButton);
-        window.removeEventListener('payFromOutside', handleSavedCardSubmit);
-      }
-    };
-  }, [isCardValid, shouldDisablePayBtn, showCardModal, savedCards == null ? void 0 : savedCards.length]);
-  (0,react.useEffect)(() => {
-    if (iframeRef.current && shouldSubmitData) {
-      const handlePay = async () => {
-        var _iframeRef$current4;
-        if (loading) return;
-        const cardHolderInput = (_iframeRef$current4 = iframeRef.current) == null || (_iframeRef$current4 = _iframeRef$current4.nextElementSibling) == null ? void 0 : _iframeRef$current4.querySelector(`input[name=name]`);
-        if (cardHolderInput) {
-          cardHolderInput.disabled = true;
-        }
-        setLoading(true);
-        if (onBeforePaymentComplete) {
-          const result = await onBeforePaymentComplete(payment.name);
-          if (!result) {
-            setShouldSubmitData(false);
-            setLoading(false);
-            return;
-          }
-        }
-        sendCardData(true);
-        setShouldSubmitData(false);
-      };
-      handlePay();
-    }
-  }, [cardHolderName, saveCard, shouldSubmitData, iframeRef.current]);
-  (0,react.useEffect)(() => {
-    if (isIframeLoaded) {
-      sendCardData();
-    }
-  }, [isIframeLoaded, payment]);
-  (0,react.useEffect)(() => {
-    let resizeObserver = null;
-    if (isIframeLoaded) {
-      var _iframeRef$current5, _iframeRef$current6;
-      (_iframeRef$current5 = iframeRef.current) == null || (_iframeRef$current5 = _iframeRef$current5.contentWindow) == null || _iframeRef$current5.postMessage({
-        type: 'customStyles',
-        payload: {
-          styling: customStyle,
-          options: {
-            hideCardHolderName: hideCardHolderName
-          }
-        }
-      }, '*');
-      const nextElement = (_iframeRef$current6 = iframeRef.current) == null ? void 0 : _iframeRef$current6.nextElementSibling;
-      resizeObserver = new ResizeObserver(entries => {
-        for (let entry of entries) {
-          const width = Math.floor(entry.contentRect.width - 0.5);
-          if (nextElement) {
-            nextElement.style.width = `${width}px`;
-          }
-        }
-      });
-      iframeRef.current && resizeObserver.observe(iframeRef.current);
-    }
-    return () => {
-      var _resizeObserver;
-      (_resizeObserver = resizeObserver) == null || _resizeObserver.disconnect();
-    };
-  }, [isIframeLoaded, iframeRef.current]);
-  (0,react.useEffect)(() => {
-    var _iframeRef$current7;
-    (_iframeRef$current7 = iframeRef.current) == null || (_iframeRef$current7 = _iframeRef$current7.contentWindow) == null || _iframeRef$current7.postMessage({
-      type: 'cardHolderError',
-      payload: {
-        error: errors['name']
-      }
-    }, '*');
-  }, [errors.name]);
-  (0,react.useEffect)(() => {
-    const isSavedCardView = (savedCards == null ? void 0 : savedCards.length) && !showCardModal;
-    const correctErrorsCount = Object.keys(errors).length === 4;
-    if (isSavedCardView && previousValidationRef.current !== !shouldDisablePayBtn) {
-      onCardValidationChanged == null || onCardValidationChanged(!shouldDisablePayBtn);
-      previousValidationRef.current = !shouldDisablePayBtn;
-    } else if (correctErrorsCount && previousValidationRef.current !== isCardValid) {
-      onCardValidationChanged == null || onCardValidationChanged(isCardValid);
-      previousValidationRef.current = isCardValid;
-    }
-  }, [isCardValid, shouldDisablePayBtn]);
-  (0,react.useImperativeHandle)(ref, () => ({
-    handleGenerateToken
-  }));
-  async function handleGenerateToken() {
-    return new Promise((resolve, reject) => {
-      var _iframeRef$current8;
-      if (loading || !isCardValid || isLoading) {
-        return reject();
-      }
-      tokenizationResolve.current = resolve;
-      (_iframeRef$current8 = iframeRef.current) == null || (_iframeRef$current8 = _iframeRef$current8.contentWindow) == null || _iframeRef$current8.postMessage({
-        type: 'tokenizeCard',
-        payload: {
-          publicKey,
-          cardHolderName,
-          shouldSubmitData: true
-        }
-      }, '*');
-    });
-  }
-  ;
-  const sendCardData = shouldSubmitData => {
-    var _iframeRef$current9, _payment$subType, _payment$subType2, _payment$subType3;
-    (_iframeRef$current9 = iframeRef.current) == null || (_iframeRef$current9 = _iframeRef$current9.contentWindow) == null || _iframeRef$current9.postMessage({
-      type: 'cardData',
-      payload: {
-        paymentToken: payment == null ? void 0 : payment.token,
-        subType: {
-          paymentToken: payment == null || (_payment$subType = payment.subType) == null ? void 0 : _payment$subType.token,
-          type: payment == null || (_payment$subType2 = payment.subType) == null ? void 0 : _payment$subType2.type,
-          integrationId: payment == null || (_payment$subType3 = payment.subType) == null ? void 0 : _payment$subType3.integrationId
-        },
-        currency,
-        cardHolderName,
-        saveCard: forceSaveCard || saveCard,
-        tenure,
-        shouldSubmitData: shouldSubmitData,
-        country,
-        integrationId: payment == null ? void 0 : payment.id,
-        discounts,
-        checkBinFees: payment == null ? void 0 : payment.checkBinFees,
-        feesAmount: payment == null ? void 0 : payment.feesAmount
-      }
-    }, '*');
-  };
-  const handlePayWithoutButton = () => {
-    setShouldSubmitData(true);
-  };
-  const handleFocusToPrevInput = () => {
-    var _iframeRef$current0;
-    (_iframeRef$current0 = iframeRef.current) == null || (_iframeRef$current0 = _iframeRef$current0.contentWindow) == null || _iframeRef$current0.postMessage({
-      type: 'setPrevFocus',
-      payload: {
-        shouldFocusOnCVV: true
-      }
-    }, '*');
-  };
-  const handleCardHolderChange = e => {
-    setCardHolderName(e.target.value);
-  };
-  const handleResetDiscountMessages = () => {
-    setDiscountErrorMessage("");
-    setDiscountAppliedMessage(null);
-    setTotalAmount("");
-    setDiscountedAmount("");
-  };
-  const handleSavedCardDiscount = async (identifier, hasDiscount, savedCardType, updatedPaymentToken) => {
-    var _payment$subType4, _payment$subType5, _discounts$data;
-    handleResetDiscountMessages();
-    const paymentToken = savedCardType === constants_SAVED_CARD_TYPES.OMAN_NET ? payment == null || (_payment$subType4 = payment.subType) == null ? void 0 : _payment$subType4.token : payment == null ? void 0 : payment.token;
-    const integrationId = savedCardType === constants_SAVED_CARD_TYPES.OMAN_NET ? payment == null || (_payment$subType5 = payment.subType) == null ? void 0 : _payment$subType5.integrationId : payment == null ? void 0 : payment.id;
-    const discountIntegrationId = discounts == null || (_discounts$data = discounts.data) == null || (_discounts$data = _discounts$data.find(discount => (discount == null ? void 0 : discount.integration_id) === integrationId)) == null ? void 0 : _discounts$data.integration_id;
-    if (!hasDiscount || !discountIntegrationId) return;
-    const res = await cardService_checkDiscount(updatedPaymentToken || paymentToken, discountIntegrationId, identifier, savedCardType);
-    handleDiscount(res);
-    if (res.status === 200) return true;
-  };
-  const handleDiscount = res => {
-    handleResetDiscountMessages();
-    if (!res) return;
-    if (res.status === 200) {
-      const {
-        discount_amount_cents,
-        discounted_amount_cents,
-        caf,
-        updatedPaymentToken
-      } = res.data;
-      const discountedAmount = formatAmountBasedOnCurrency_formatAmountBasedOnCurrency(discounted_amount_cents, currency);
-      const totalAmount = formatAmountBasedOnCurrency_formatAmountBasedOnCurrency(discount_amount_cents, currency);
-      if (discount_amount_cents < 0) {
-        setDiscountErrorMessage(t('DISCOUNT_EXCEEDS_ORDER'));
-      } else if (discounted_amount_cents > 0) {
-        setDiscountAppliedMessage(/*#__PURE__*/(0,jsx_runtime.jsx)(Trans_Trans, {
-          ns: "card",
-          i18nKey: "DISCOUNT_APPLIED",
-          values: {
-            currency: tPaymentLayout(displayCurrency),
-            amount: discountedAmount
-          },
-          components: {
-            span: /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-              style: {
-                fontFamily: currencyFontFamily
-              }
-            })
-          }
-        }));
-        setTotalAmount(totalAmount);
-        setDiscountedAmount(discountedAmount);
-        if (caf > 0) {
-          const feesAmount = formatAmountBasedOnCurrency_formatAmountBasedOnCurrency(caf, currency);
-          setFeesAmount(feesAmount);
-          setShowFeesDetails(true);
-          setUpdatedPaymentToken(updatedPaymentToken);
-        }
-      }
-    } else if (res.status !== 500) {
-      setDiscountErrorMessage(getErrorMsg_getErrorMsg(res));
-    }
-  };
-  const handleFeesReset = () => {
-    setTotalAmount("");
-    setFeesAmount((payment == null ? void 0 : payment.feesAmount) || '');
-    setShowFeesDetails(false);
-    setUpdatedPaymentToken("");
-    handleResetDiscountMessages();
-  };
-  const handleSavedCardFees = async (identifier, savedCardType, hasDiscount) => {
-    handleFeesReset();
-    if (!payment.checkBinFees && payment.feesAmount) {
-      setShowFeesDetails(true);
-      handleSavedCardDiscount(identifier, hasDiscount, savedCardType);
-    } else if (payment.checkBinFees) {
-      var _payment$subType6;
-      const paymentToken = savedCardType === constants_SAVED_CARD_TYPES.OMAN_NET ? payment == null || (_payment$subType6 = payment.subType) == null ? void 0 : _payment$subType6.token : payment == null ? void 0 : payment.token;
-      const res = await cardService_lookupFees(paymentToken, identifier);
-      if (res.status === 200) {
-        const {
-          updated_payment_token
-        } = res.data;
-        const discountApplied = await handleSavedCardDiscount(identifier, hasDiscount, savedCardType, updated_payment_token);
-        if (discountApplied) return;
-        handleFees(res);
-      } else {
-        handleSavedCardDiscount(identifier, hasDiscount, savedCardType);
-      }
-    }
-  };
-  const handleFees = res => {
-    handleFeesReset();
-    if (!res) return;
-    const {
-      checkBinFees,
-      feesAmount
-    } = payment || {};
-    if (!checkBinFees && feesAmount && res.showFeesDetails) {
-      setShowFeesDetails(true);
-    } else if (res.status === 200) {
-      const {
-        total_fees_cents,
-        new_amount_cents,
-        updated_payment_token
-      } = res.data;
-      if (total_fees_cents > 0) {
-        const _feesAmount = formatAmountBasedOnCurrency_formatAmountBasedOnCurrency(total_fees_cents, currency);
-        const totalAmount = formatAmountBasedOnCurrency_formatAmountBasedOnCurrency(new_amount_cents, currency);
-        setTotalAmount(totalAmount);
-        setFeesAmount(_feesAmount);
-        setShowFeesDetails(true);
-        setUpdatedPaymentToken(updated_payment_token);
-      }
-    }
-  };
-  const handleCloseDeleteCardModal = () => {
-    setShowDeleteCardModal(false);
-    setSelectedDeleteCard(null);
-  };
-  const handleDeleteCard = () => {
-    //
-  };
-  const handleSelectCard = card => {
-    if (card.expired) return;
-    setSelectedCardCVV('');
-    if ((selectedCard == null ? void 0 : selectedCard.id) === card.id) setSelectedCard(null);else {
-      setSelectedCard(card);
-      if (payment != null && payment.checkBinFees || payment != null && payment.feesAmount) {
-        handleSavedCardFees == null || handleSavedCardFees(card.identifier, card.type, !!card.identifier && !!card.hasDiscount);
-      }
-      if (!(payment != null && payment.checkBinFees) && !(payment != null && payment.feesAmount)) {
-        handleSavedCardDiscount == null || handleSavedCardDiscount(card.identifier, !!card.identifier && !!card.hasDiscount, card.type);
-      }
-    }
-  };
-  const handleSelectDeleteCard = (e, card) => {
-    e.stopPropagation();
-    setShowDeleteCardModal(true);
-    setSelectedDeleteCard(card);
-  };
-  const handleSavedCardSubmit = async () => {
-    var _payment$subType7, _res$data7, _res$data8, _res$data9;
-    if (loading) return;
-    setLoading(true);
-    if (onBeforePaymentComplete) {
-      const result = await onBeforePaymentComplete(payment.name);
-      if (!result) {
-        setSelectedCard(null);
-        setSelectedCardCVV('');
-        setLoading(false);
-        return;
-      }
-    }
-    const isOmanNet = (selectedCard == null ? void 0 : selectedCard.type) === constants_SAVED_CARD_TYPES.OMAN_NET;
-    const data = {
-      identifier: selectedCard == null ? void 0 : selectedCard.identifier,
-      cvv: selectedCardCVV
-    };
-    const payload = Object.assign({
-      identifier: data.identifier,
-      token: updatedPaymentToken || (isOmanNet ? payment == null || (_payment$subType7 = payment.subType) == null ? void 0 : _payment$subType7.token : payment == null ? void 0 : payment.token)
-    }, data.cvv && {
-      cvv: data.cvv
-    }, {
-      isElements: true
-    });
-    const res = await cardService_payWithSavedCard(payload);
-    setLoading(false);
-    setIsOmanNetCard(false);
-    const isSuccess = String((_res$data7 = res.data) == null ? void 0 : _res$data7.success) === 'true';
-    const isPending = String((_res$data8 = res.data) == null ? void 0 : _res$data8.pending) === 'true';
-    const isOTPGeneration = String((_res$data9 = res.data) == null ? void 0 : _res$data9.otp_generation) === 'true';
-    if (res.status === 200) {
-      if (isOmanNet && isOTPGeneration && !isSuccess && isPending) {
-        setIsOmanNetCard(true);
-        setPaymentId(res.data.payment_id);
-        setShowOTP(true);
-      } else {
-        window.location.href = res.data.redirection_url;
-      }
-    } else if (res.status === 400) {
-      var _res$data0, _res$data1, _res$data10;
-      if (res.data instanceof Array && res.data[0] === 'Retry limit reached.' || ((_res$data0 = res.data) == null ? void 0 : _res$data0.msg) === 'Retry limit reached.') {
-        setErrorMessage(t('ERR_MSG_EXCEEDED_TRIALS'));
-      } else if (((_res$data1 = res.data) == null ? void 0 : _res$data1.message) === 'Session Error') {
-        setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-      } else if (res.data instanceof Array && res.data[0] === 'Order has already paid.' || ((_res$data10 = res.data) == null ? void 0 : _res$data10.msg) === 'Order has already paid.') {
-        setErrorMessage(t('ERR_MSG_ALREADY_PAID'));
-      } else {
-        setErrorMessage(t('ERR_MSG_DECLINED'));
-      }
-    } else if (res.status === 401) {
-      setErrorMessage(t('ERR_MSG_EXPIRED'));
-    } else if (res.status === 422) {
-      setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-    } else if (res.status === 403) {
-      setErrorMessage(t('ERR_MSG_EXCEEDED_TRIALS'));
-    } else if (res.status === 406) {
-      setErrorMessage(t('ERR_MSG_ALREADY_PROCESSED'));
-    } else {
-      setErrorMessage(t('ERR_MSG_SOMETHING_WENT_WRONG'));
-    }
-  };
-  const handleOTPSubmit = async otp => {
-    var _payment$subType8, _res$data11, _res$data12;
-    setSendOTPLoading(true);
-    const res = await cardService_sendOTP({
-      token: updatedPaymentToken || (isOmanNetCard ? (_payment$subType8 = payment.subType) == null ? void 0 : _payment$subType8.token : payment.token),
-      otp,
-      paymentId
-    });
-    const redirectionUrl = ((_res$data11 = res.data) == null ? void 0 : _res$data11.redirection_url) || ((_res$data12 = res.data) == null ? void 0 : _res$data12.redirect_url);
-    if (res.status === 200) {
-      if (redirectionUrl && (res.data.result === 'CAPTURED' || res.data.result === 'APPROVED')) {
-        window.location.href = redirectionUrl;
-      } else {
-        setOTPErrorMessage(getErrorMsg_getErrorMsg(res));
-      }
-    } else if (res.status !== 200) {
-      setOTPErrorMessage(getErrorMsg_getErrorMsg(res));
-    }
-    setSendOTPLoading(false);
-  };
-  const handleShowNewCardForm = () => {
-    if (loading) return;
-    setSelectedCard(null);
-    setSelectedCardCVV('');
-    setShowCardModal(true);
-    if (previousValidationRef.current) {
-      onCardValidationChanged == null || onCardValidationChanged(false);
-      previousValidationRef.current = false;
-    }
-    handleResetDiscountMessages();
-    handleFeesReset();
-  };
-  const handleViewSavedCards = () => {
-    setShowCardModal(false);
-    setIsIframeLoaded(false);
-    setCardHolderName('');
-    if (previousValidationRef.current) {
-      onCardValidationChanged == null || onCardValidationChanged(false);
-      previousValidationRef.current = false;
-    }
-    handleFeesReset();
-  };
-  const handleCloseOTP = () => {
-    setShowOTP(false);
-    setErrorMessage('');
-    onPaymentCancel == null || onPaymentCancel();
-  };
-  const orderDetailsContent = discountedAmount || showFeesDetails && feesAmount ? /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-    className: "flex flex-col gap-3 mt-6 text-sm leading-4",
-    style: customStyle == null ? void 0 : customStyle.label,
-    children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-      className: "flex justify-between items-center",
-      children: [/*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-        children: "Order amount:"
-      }), /*#__PURE__*/(0,jsx_runtime.jsxs)("p", {
-        children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-          style: {
-            fontFamily: currencyFontFamily
-          },
-          children: displayCurrency
-        }), ' ', amount]
-      })]
-    }), discountedAmount && /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-      className: "flex justify-between items-center text-green-600",
-      style: customStyle == null || (_customStyle$discount = customStyle.discount) == null ? void 0 : _customStyle$discount.successMessage,
-      children: [/*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-        children: "Discount amount:"
-      }), /*#__PURE__*/(0,jsx_runtime.jsxs)("p", {
-        children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-          style: {
-            fontFamily: currencyFontFamily
-          },
-          children: displayCurrency
-        }), ' ', discountedAmount]
-      })]
-    }), showFeesDetails && feesAmount && /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-      className: "flex justify-between items-center",
-      children: [/*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-        children: "Convenience fee:"
-      }), /*#__PURE__*/(0,jsx_runtime.jsxs)("p", {
-        children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-          style: {
-            fontFamily: currencyFontFamily
-          },
-          children: displayCurrency
-        }), ' ', feesAmount]
-      })]
-    })]
-  }) : null;
-  return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-    className: customStyle != null && (_customStyle$containe = customStyle.container) != null && _customStyle$containe.fontFamily ? '' : Card_card_module['gotham'],
-    style: Object.assign({}, customStyle == null ? void 0 : customStyle.container, isList && {
-      padding: 'unset'
-    }),
-    children: [isMobile && showOTP && /*#__PURE__*/(0,jsx_runtime.jsx)(MobileOTPModal_MobileOTPModal, {
-      onClose: handleCloseOTP,
-      onSubmit: handleOTPSubmit,
-      length: 4,
-      modalHeader: `${4}-digit code`,
-      loading: sendOTPLoading,
-      onErrorMessage: setOTPErrorMessage,
-      error: otpErrorMessage,
-      customStyle: {
-        container: {
-          backgroundColor: (customStyle == null || (_customStyle$containe2 = customStyle.container) == null ? void 0 : _customStyle$containe2.backgroundColor) || '',
-          borderRadius: (customStyle == null || (_customStyle$button = customStyle.button) == null ? void 0 : _customStyle$button.borderRadius) || ''
-        },
-        button: customStyle == null ? void 0 : customStyle.button,
-        label: customStyle == null ? void 0 : customStyle.label,
-        error: customStyle == null ? void 0 : customStyle.error
-      }
-    }), !isMobile && showOTP && /*#__PURE__*/(0,jsx_runtime.jsx)(ModalView_ModalView, {
-      showModal: showOTP,
-      onClose: handleCloseOTP,
-      customStyle: customStyle == null ? void 0 : customStyle.button,
-      children: /*#__PURE__*/(0,jsx_runtime.jsx)(OTPModal_OTPModal, {
-        onClose: handleCloseOTP,
-        onSubmit: handleOTPSubmit,
-        length: 4,
-        modalHeader: `${4}-digit code`,
-        loading: sendOTPLoading,
-        onErrorMessage: setOTPErrorMessage,
-        error: otpErrorMessage,
-        customStyle: {
-          container: {
-            backgroundColor: (customStyle == null || (_customStyle$containe3 = customStyle.container) == null ? void 0 : _customStyle$containe3.backgroundColor) || ''
-          },
-          cancelButton: Object.assign({}, customStyle == null ? void 0 : customStyle.button, {
-            backgroundColor: '#fff',
-            lineHeight: 'normal',
-            color: ''
-          }),
-          button: customStyle == null ? void 0 : customStyle.button,
-          label: customStyle == null ? void 0 : customStyle.label,
-          error: customStyle == null ? void 0 : customStyle.error
-        }
-      })
-    }), /*#__PURE__*/(0,jsx_runtime.jsx)(CVVToolTipModal_CVVToolTipModal, {
-      onClose: () => setShowCVVTooltipModal(false),
-      showModal: showCVVTooltipModal,
-      customStyle: customStyle
-    }), errorMessage && /*#__PURE__*/(0,jsx_runtime.jsx)(ErrorMessageViewTwo_ErrorMessage, {
-      errorMessage: errorMessage
-    }), (!savedCards || savedCards && showCardModal) && /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-      children: [/*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-        className: `${customStyle != null && customStyle.hideCardLabel && !showCardModal ? 'hidden' : 'flex'} justify-between`,
-        style: {
-          marginBottom: '-8px'
-        },
-        children: [!(customStyle != null && customStyle.hideCardLabel) && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-          style: Object.assign({}, customStyle == null ? void 0 : customStyle.label),
-          className: "mt-4",
-          children: (customStyle == null || (_customStyle$labelTex = customStyle.labelText) == null ? void 0 : _customStyle$labelTex.cardLabel) || t('CARD_INFO')
-        }), showCardModal && /*#__PURE__*/(0,jsx_runtime.jsx)("button", {
-          id: 'cancel-button',
-          className: "hover:!opacity-75 underline ms-auto",
-          style: customStyle == null ? void 0 : customStyle.label,
-          disabled: loading,
-          onClick: handleViewSavedCards,
-          children: (customStyle == null || (_customStyle$buttonTe = customStyle.buttonText) == null ? void 0 : _customStyle$buttonTe.viewSavedCardsBtn) || t('VIEW_SAVED_CARDS')
-        })]
-      }), !!(discounts != null && discounts.count) && /*#__PURE__*/(0,jsx_runtime.jsx)(Discounts, {
-        customStyle: customStyle == null ? void 0 : customStyle.discount,
-        discounts: discounts.data
-      }), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-        className: "[&>div:nth-child(even)]:w-[calc(100%-1px)]",
-        children: [(!isIframeLoaded || !(payment.token || integrationType === constants_INTEGRATION_TYPE.TOKENIZATION)) && /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-          className: "-mt-1",
-          children: [/*#__PURE__*/(0,jsx_runtime.jsx)(dist_Skeleton, {
-            height: 37
-          }), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
-            className: "flex gap-1 [&>*]:flex-1",
-            children: [/*#__PURE__*/(0,jsx_runtime.jsx)(dist_Skeleton, {
-              height: 37
-            }), /*#__PURE__*/(0,jsx_runtime.jsx)(dist_Skeleton, {
-              height: 37
-            })]
-          }), !hideCardHolderName && /*#__PURE__*/(0,jsx_runtime.jsx)(dist_Skeleton, {
-            height: 37
-          })]
-        }), /*#__PURE__*/(0,jsx_runtime.jsx)("iframe", {
-          title: 'Elements',
-          id: "iFrame",
-          ref: iframeRef,
-          src: `${baseUrl}/${environment_environment['IFRAME_PATH']}/?type=card&v=2&integration_type=${integrationType}`
-          // src={`http://localhost:9001/${environment['IFRAME_PATH']}/?type=card&v=2&integration_type=${integrationType}`}
-          ,
-          className: Card_card_module['iframe'],
-          style: {
-            display: isIframeLoaded && (payment.token || integrationType === constants_INTEGRATION_TYPE.TOKENIZATION) ? 'block' : 'none'
-          },
-          frameBorder: "0",
-          scrolling: "no",
-          width: "100%",
-          height: height
-        }), isIframeLoaded && (payment.token || integrationType === constants_INTEGRATION_TYPE.TOKENIZATION) && /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-          children: [!hideCardHolderName && /*#__PURE__*/(0,jsx_runtime.jsx)(components_CardHolder_CardHolder, {
-            onChange: handleCardHolderChange,
-            focusToPrevInput: handleFocusToPrevInput,
-            customStyle: customStyle,
-            setErrors: setErrors,
-            error: errors['name'],
-            placeholder: customStyle == null || (_customStyle$placehol = customStyle.placeholderText) == null ? void 0 : _customStyle$placehol.holderName
-          }), discountErrorMessage && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-            className: "mt-2 text-orange-700 text-sm leading-[1.125rem] tracking-[0.01rem]",
-            style: customStyle == null || (_customStyle$discount2 = customStyle.discount) == null ? void 0 : _customStyle$discount2.validationMessage,
-            children: discountErrorMessage
-          }), discountAppliedMessage && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-            className: "mt-2 text-green-600 text-sm leading-[1.125rem] tracking-[0.01rem]",
-            style: customStyle == null || (_customStyle$discount3 = customStyle.discount) == null ? void 0 : _customStyle$discount3.successMessage,
-            children: discountAppliedMessage
-          }), (errors['number'] || errors['name'] || errors['cvc'] || errors['expiry']) && /*#__PURE__*/(0,jsx_runtime.jsxs)("ul", {
-            style: customStyle == null ? void 0 : customStyle.error,
-            className: "my-2 text-sm text-red-600 list-disc list-inside list-item:text-red-600",
-            children: [errors['number'] && /*#__PURE__*/(0,jsx_runtime.jsx)("li", {
-              children: getFieldErrorMessage_getFieldErrorMessage({
-                nativeError: errors['number'],
-                customError: customStyle == null || (_customStyle$errorTex = customStyle.errorText) == null ? void 0 : _customStyle$errorTex.cardNumber
-              })
-            }), errors['expiry'] && /*#__PURE__*/(0,jsx_runtime.jsx)("li", {
-              children: getFieldErrorMessage_getFieldErrorMessage({
-                nativeError: errors['expiry'],
-                customError: customStyle == null || (_customStyle$errorTex2 = customStyle.errorText) == null ? void 0 : _customStyle$errorTex2.expiryDate
-              })
-            }), errors['cvc'] && /*#__PURE__*/(0,jsx_runtime.jsx)("li", {
-              children: getFieldErrorMessage_getFieldErrorMessage({
-                nativeError: errors['cvc'],
-                customError: customStyle == null || (_customStyle$errorTex3 = customStyle.errorText) == null ? void 0 : _customStyle$errorTex3.securityCode
-              })
-            }), errors['name'] && /*#__PURE__*/(0,jsx_runtime.jsx)("li", {
-              children: getFieldErrorMessage_getFieldErrorMessage({
-                nativeError: errors['name'],
-                customError: customStyle == null || (_customStyle$errorTex4 = customStyle.errorText) == null ? void 0 : _customStyle$errorTex4.holderName
-              })
-            })]
-          }), orderDetailsContent]
-        })]
-      }), /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-        children: [forceSaveCard && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-          style: customStyle == null ? void 0 : customStyle.label,
-          className: "flex h-4 flex-col justify-center text-gray-700 text-sm font-medium leading-6 tracking-[0.01rem]",
-          children: (customStyle == null || (_customStyle$hintText = customStyle.hintText) == null ? void 0 : _customStyle$hintText.saveCardConsentHint) || t('FORCE_SAVE_CARD')
-        }), !forceSaveCard && showSaveCard && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-          children: /*#__PURE__*/(0,jsx_runtime.jsx)(CheckboxViewTwo_Checkbox, {
-            label: (customStyle == null || (_customStyle$labelTex2 = customStyle.labelText) == null ? void 0 : _customStyle$labelTex2.saveCardConsentLabel) || t('SAVE_CARD'),
-            name: "save_card",
-            checked: saveCard,
-            onChange: e => setSaveCard(e.target.checked),
-            customStyle: customStyle == null ? void 0 : customStyle.label
-          })
-        }), !disablePay && integrationType === constants_INTEGRATION_TYPE.DIRECT_PAYMENT && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-          className: Card_card_module['action-btn'],
-          children: /*#__PURE__*/(0,jsx_runtime.jsx)(Button_Button, {
-            id: 'pay-button',
-            loading: loading || isLoading,
-            disabled: loading || !isCardValid || isLoading,
-            label: /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-              children: [(customStyle == null || (_customStyle$buttonTe2 = customStyle.buttonText) == null ? void 0 : _customStyle$buttonTe2.payBtn) || t('CARD_ACTION_BTN'), ' ', /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-                style: {
-                  fontFamily: currencyFontFamily
-                },
-                children: displayCurrency
-              }), ' ', totalAmount || amount, totalAmount && /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-                className: "opacity-50 ml-2 text-white text-sm font-semibold leading-6 tracking-[0.16px]",
-                style: {
-                  textDecoration: 'line-through'
-                },
-                children: amount
-              })]
-            }),
-            onClick: () => setShouldSubmitData(true),
-            customStyle: customStyle == null ? void 0 : customStyle.button,
-            className: "w-full"
-          })
-        }), showPaymobLogo && integrationType === constants_INTEGRATION_TYPE.DIRECT_PAYMENT && /*#__PURE__*/(0,jsx_runtime.jsx)(CopyrightsViewTwo_Copyrights, {
-          isElements: true
-        })]
-      })]
-    }), savedCards && !showCardModal && /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-      children: [!!(discounts != null && discounts.count) && /*#__PURE__*/(0,jsx_runtime.jsx)(Discounts, {
-        customStyle: customStyle == null ? void 0 : customStyle.discount,
-        discounts: discounts.data
-      }), /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-        style: customStyle == null ? void 0 : customStyle.label,
-        children: (customStyle == null || (_customStyle$labelTex3 = customStyle.labelText) == null ? void 0 : _customStyle$labelTex3.savedCardsLabel) || t('SAVED_CARDS_TITLE')
-      }), savedCards.map(card => {
-        var _customStyle$discount4, _customStyle$discount5;
-        return /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-          children: [/*#__PURE__*/(0,jsx_runtime.jsx)(SavedCardElements, {
-            card: card,
-            selectedCardId: selectedCard == null ? void 0 : selectedCard.id,
-            showCvvInput: showCvvInput,
-            selectedCardCVV: selectedCardCVV,
-            setSelectedCardCVV: setSelectedCardCVV,
-            onCardSelect: handleSelectCard,
-            onDeleteCard: handleSelectDeleteCard,
-            environment: environment_environment,
-            height: height,
-            customStyle: customStyle,
-            baseURL: baseUrl,
-            ref: el => {
-              if (el) {
-                iframeCVVRefs.current[card.id] = el;
-              }
-            }
-          }, card.id), !showCardModal && discountErrorMessage && card.id === selectedCardId && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-            className: "text-orange-700 text-sm leading-[1.125rem] track-[0.01rem]",
-            style: customStyle == null || (_customStyle$discount4 = customStyle.discount) == null ? void 0 : _customStyle$discount4.validationMessage,
-            children: discountErrorMessage
-          }), !showCardModal && discountAppliedMessage && card.id === selectedCardId && /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-            className: "text-green-600 text-sm leading-[1.125rem] track-[0.01rem]",
-            style: customStyle == null || (_customStyle$discount5 = customStyle.discount) == null ? void 0 : _customStyle$discount5.successMessage,
-            children: discountAppliedMessage
-          }), orderDetailsContent]
-        });
-      }), /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-        onClick: handleShowNewCardForm,
-        className: `${loading ? 'opacity-75' : 'cursor-pointer'} mt-4 w-full flex h-[4.5rem] p-4 justify-center items-center gap-3 rounded-xl border border-dashed border-blue-200 bg-white`,
-        children: /*#__PURE__*/(0,jsx_runtime.jsxs)("button", {
-          disabled: loading,
-          className: "flex justify-center items-center gap-2 text-blue-500",
-          children: [/*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-            className: "text-base",
-            children: "+"
-          }), ' ', /*#__PURE__*/(0,jsx_runtime.jsx)("p", {
-            className: "text-center text-sm font-semibold leading-6 tracking-[.01rem]",
-            children: (customStyle == null || (_customStyle$buttonTe3 = customStyle.buttonText) == null ? void 0 : _customStyle$buttonTe3.addNewCardBtn) || t('ADD_NEW_CARD_BTN')
-          })]
-        })
-      }), !disablePay && !!savedCards.length && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
-        className: "mt-auto",
-        children: /*#__PURE__*/(0,jsx_runtime.jsx)(Button_Button, {
-          id: "pay-button",
-          disabled: loading || shouldDisablePayBtn || isLoading,
-          loading: loading || isLoading,
-          color: 'primary',
-          onClick: handleSavedCardSubmit,
-          label: /*#__PURE__*/(0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-            children: [(customStyle == null || (_customStyle$buttonTe4 = customStyle.buttonText) == null ? void 0 : _customStyle$buttonTe4.payBtn) || t('CARD_ACTION_BTN'), ' ', /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-              style: {
-                fontFamily: currencyFontFamily
-              },
-              children: displayCurrency
-            }), ' ', totalAmount || amount, totalAmount && /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
-              className: "opacity-50 ml-2 text-white text-sm font-semibold leading-6 tracking-[0.16px]",
-              style: {
-                textDecoration: 'line-through'
-              },
-              children: amount
-            })]
-          }),
-          customStyle: customStyle == null ? void 0 : customStyle.button,
-          className: "w-full"
-        })
-      })]
-    })]
-  });
-});
-/* harmony default export */ const components_Payments_Card = (Card_CardElement);
-;// ../../apps/elements/src/services/knetService.ts
-
-const knetService_payWithKnet = (token, amount) => {
-  return lib_axios.post(`/api/acceptance/payments/pay`, {
-    source: {
-      identifier: 'KnetCard',
-      amount_cents: amount,
-      subtype: 'KNET'
-    },
-    payment_token: token,
-    api_source: " PIXEL"
-  }).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-;// ../../apps/elements/src/components/Payments/Knet/index.tsx
-
-
-
-
-
-function Knet_KnetElement({
-  payment,
-  customStyle,
-  paymentMethodsCount,
-  disablePay,
-  onPaymentStart,
-  onPaymentEnd
-}) {
-  const [loading, setLoading] = (0,react.useState)(false);
-  const {
-    amount,
-    currency,
-    KnetEquivalentAmountCents,
-    KnetCurrency,
-    KnetMinTransactionAmount
-  } = payment;
-  let KnetEquivalentAmount = null;
-  if (KnetEquivalentAmountCents) {
-    KnetEquivalentAmount = CURRENCIES_WITH_THOUSAND_DIVISOR.includes(KnetCurrency) ? KnetEquivalentAmountCents / 1000 : KnetEquivalentAmountCents / 100;
-  }
-  const amountInCents = getAmountInCentsBasedOnCurrency_getAmountInCentsBasedOnCurrency(amount, currency);
-  const handlePay = async () => {
-    try {
-      var _res$data, _res$data2;
-      onPaymentStart == null || onPaymentStart(payment.type);
-      setLoading(true);
-      const res = await knetService_payWithKnet(payment == null ? void 0 : payment.token, String(amountInCents));
-      const redirectionUrl = ((_res$data = res.data) == null ? void 0 : _res$data.redirection_url) || ((_res$data2 = res.data) == null ? void 0 : _res$data2.redirect_url);
-      if (res.status === 200 && redirectionUrl) {
-        window.location.href = redirectionUrl;
-      }
-    } catch (error) {
-      console.error('Payment error:', error);
-      onPaymentEnd == null || onPaymentEnd();
-    } finally {
-      setLoading(false);
-    }
-  };
-  return /*#__PURE__*/(0,jsx_runtime.jsx)(Knet, {
-    minAmount: KnetMinTransactionAmount,
-    onPaySubmit: handlePay,
-    loading: loading,
-    paymentMethodsCount: paymentMethodsCount,
-    amount: amount,
-    currency: currency,
-    customStyle: customStyle,
-    EquivalentAmount: KnetEquivalentAmount !== null ? String(KnetEquivalentAmount) : undefined,
-    KnetCurrency: KnetCurrency,
-    disablePay: disablePay
-  });
-}
-/* harmony default export */ const components_Payments_Knet = (Knet_KnetElement);
-;// ../../apps/elements/src/services/knetApplePayServices.ts
-
-const knetApplePayServices_validatemerchant = async (appleURL, integrationId) => {
-  return lib_axios.post(`/api/auth/merchant/validate`, {
-    appleURL,
-    integrationId
-  }).then(res => res.data.api_response).catch(err => err == null ? void 0 : err.response);
-};
-const knetApplePayServices_knetApplePayPayment = async (applePaytoken, paymentToken, clientData) => {
-  var _clientData$name$trim, _clientData$name$trim2, _clientData$name$trim3, _clientData$name$trim4;
-  return lib_axios.post(`/api/acceptance/payments/pay`, Object.assign({
-    payment_token: paymentToken,
-    api_source: "PIXEL",
-    source: {
-      identifier: applePaytoken,
-      subtype: 'KNET_APPLE_PAY'
-    }
-  }, clientData && {
-    billing: {
-      apartment: 'NA',
-      floor: 'NA',
-      first_name: (_clientData$name$trim = clientData.name.trim().split(' ')) != null && _clientData$name$trim[0] ? (_clientData$name$trim2 = clientData.name.trim().split(' ')) == null ? void 0 : _clientData$name$trim2[0] : 'NA',
-      last_name: (_clientData$name$trim3 = clientData.name.trim().split(' ')) != null && _clientData$name$trim3[clientData.name.trim().split(' ').length - 1] ? (_clientData$name$trim4 = clientData.name.trim().split(' ')) == null ? void 0 : _clientData$name$trim4[clientData.name.trim().split(' ').length - 1] : 'NA',
-      street: 'NA',
-      building: 'NA',
-      phone_number: clientData.phone,
-      shipping_method: 'NA',
-      city: 'NA',
-      country: 'NA',
-      state: 'NA',
-      email: clientData.email,
-      postal_code: 'NA'
-    }
-  })).then(res => res).catch(err => err == null ? void 0 : err.response);
-};
-;// ../../apps/elements/src/components/Payments/KnetApplePay/index.tsx
-
-const Payments_KnetApplePay_excluded = ["payment", "customStyle", "onBeforePaymentComplete", "onAfterPaymentComplete", "onPaymentCancel", "isLoading", "country", "paymentMethodsCount", "onPaymentStart", "onPaymentEnd"];
-
-
-
-
-function KnetApplePay_KnetApplePayElement(_ref) {
-  var _amount$toString;
-  let {
-      payment,
-      customStyle,
-      onBeforePaymentComplete,
-      onAfterPaymentComplete,
-      onPaymentCancel,
-      isLoading,
-      country,
-      paymentMethodsCount,
-      onPaymentStart,
-      onPaymentEnd
-    } = _ref,
-    restProps = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(_ref, Payments_KnetApplePay_excluded);
-  const {
-    amount,
-    currency,
-    KnetEquivalentAmountCents,
-    KnetCurrency,
-    merchantName,
-    KnetMinTransactionAmount
-  } = payment;
-  const applePay = payment;
-  let KnetEquivalentAmount = null;
-  if (KnetEquivalentAmountCents) {
-    KnetEquivalentAmount = CURRENCIES_WITH_THOUSAND_DIVISOR.includes(KnetCurrency) ? KnetEquivalentAmountCents / 1000 : KnetEquivalentAmountCents / 100;
-  }
-  const handleSubmit = (status, resData) => {
-    window.location.href = resData.redirection_url;
-  };
-  return /*#__PURE__*/(0,jsx_runtime.jsx)(KnetApplePay, {
-    country: country,
-    paymentMethodsCount: paymentMethodsCount,
-    countryCode: currency == null ? void 0 : currency.slice(0, 2),
-    currency: currency,
-    amount: (_amount$toString = amount.toString()) == null ? void 0 : _amount$toString.replace(/,/g, ''),
-    merchantName: merchantName,
-    paymentToken: (applePay == null ? void 0 : applePay.token) || '',
-    integrationId: (applePay == null ? void 0 : applePay.id) || '',
-    validatemerchant: knetApplePayServices_validatemerchant,
-    knetApplePayPayment: knetApplePayServices_knetApplePayPayment,
-    onSubmit: handleSubmit,
-    onBeforePaymentComplete: data => {
-      onPaymentStart == null || onPaymentStart(payment.type);
-      return onBeforePaymentComplete == null ? void 0 : onBeforePaymentComplete(data);
-    },
-    onAfterPaymentComplete: onAfterPaymentComplete,
-    onPaymentCancel: () => {
-      onPaymentEnd == null || onPaymentEnd();
-      onPaymentCancel == null || onPaymentCancel();
-    },
-    customStyle: customStyle,
-    isLoading: isLoading,
-    paymentName: payment.name,
-    EquivalentAmount: KnetEquivalentAmount !== null ? String(KnetEquivalentAmount) : undefined,
-    KnetCurrency: KnetCurrency,
-    minAmount: KnetMinTransactionAmount
-  });
-}
-/* harmony default export */ const components_Payments_KnetApplePay = (KnetApplePay_KnetApplePayElement);
-;// ../../apps/elements/src/utils/renderSelectedPaymentMethod.tsx
-
-
-
-
-const renderSelectedPaymentMethod_renderSelectedPaymentMethod = (selectedPaymentMethod, restProps = {}) => {
-  if (selectedPaymentMethod) {
-    switch (selectedPaymentMethod.type.toUpperCase()) {
-      case 'CARD':
-      case 'CARD-AUTH':
-        return /*#__PURE__*/(0,jsx_runtime.jsx)(components_Payments_Card, Object.assign({}, restProps, {
-          payment: selectedPaymentMethod
-        }));
-      case 'KNET':
-        return /*#__PURE__*/(0,jsx_runtime.jsx)(components_Payments_Knet, Object.assign({}, restProps, {
-          payment: selectedPaymentMethod
-        }));
-      case 'KNET-APPLE-PAY':
-        return /*#__PURE__*/(0,jsx_runtime.jsx)(components_Payments_KnetApplePay, Object.assign({}, restProps, {
-          payment: selectedPaymentMethod
-        }));
-    }
-  }
-  return;
-};
-;// ./src/components/Payments/List/index.tsx
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
-  var _customStyle$containe;
-  const {
-    payments,
-    customStyle,
-    baseUrl,
-    savedCards,
-    forceSaveCard,
-    showSaveCard,
-    disablePay,
-    onBeforePaymentComplete,
-    onAfterPaymentComplete,
-    onPaymentCancel,
-    onCardValidationChanged,
-    showPaymobLogo,
-    hideCardHolderName,
-    publicKey,
-    clientSecret,
-    selectedPaymentMethods,
-    integrationType,
-    discounts,
-    viewMode
-  } = props;
-  const {
-    t
-  } = useTranslation_useTranslation('flash', {
-    keyPrefix: 'paymentsList'
-  });
-  const [paymentList, setPaymentList] = (0,react.useState)(payments);
-  const [savedCardsList, setSavedCardsList] = (0,react.useState)(savedCards);
-  const [errorMessage, setErrorMessage] = (0,react.useState)('');
-  const [isLoading, setIsLoading] = (0,react.useState)(false);
-  const [isPaymentInProgress, setIsPaymentInProgress] = (0,react.useState)(null);
-  const country = getCountryByKeys(publicKey, clientSecret);
-  const cardRef = (0,react.useRef)(null);
-  (0,react.useImperativeHandle)(ref, () => ({
-    getData: async () => {
-      setIsLoading(true);
-      const {
-        res,
-        paymentList,
-        savedCards
-      } = await fetchPayments(publicKey, clientSecret, selectedPaymentMethods);
-      setIsLoading(false);
-      if (res.status === 200) {
-        setPaymentList(paymentList);
-        setSavedCardsList(savedCards);
+  const [isLoading, setIsLoading] = (0,react.useState)(false);
+  const country = getCountryByKeys(publicKey, clientSecret);
+  const cardRef = (0,react.useRef)(null);
+  (0,react.useImperativeHandle)(ref, () => ({
+    getData: async () => {
+      setIsLoading(true);
+      const {
+        res,
+        paymentList,
+        savedCards
+      } = await fetchPayments(publicKey, clientSecret, selectedPaymentMethods);
+      setIsLoading(false);
+      if (res.status === 200) {
+        setPaymentList(paymentList);
+        setSavedCardsList(savedCards);
       }
       return res;
     },
@@ -83887,12 +82624,6 @@ const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
   const handleOnBeforePaymentComplete = async paymentMethod => {
     return await onBeforePaymentComplete(paymentMethod);
   };
-  const handlePaymentStart = paymentMethodType => {
-    setIsPaymentInProgress(paymentMethodType);
-  };
-  const handlePaymentEnd = () => {
-    setIsPaymentInProgress(null);
-  };
   const getFilteredPaymentList = () => {
     return paymentList.filter(method => {
       if (method.name === 'knet-apple-pay' && !isKnetApplePaySupported()) {
@@ -84000,7 +82731,7 @@ const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
       })]
     }), paymentMethods.length >= 1 && /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
       className: list_module['payments-list'],
-      children: paymentMethods.length === 1 ? renderSelectedPaymentMethod_renderSelectedPaymentMethod(paymentMethods[0], {
+      children: paymentMethods.length === 1 ? renderSelectedPaymentMethod(paymentMethods[0], {
         customStyle,
         paymentMethodsCount: paymentMethods.length,
         baseUrl,
@@ -84018,10 +82749,7 @@ const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
         integrationType,
         publicKey,
         ref: cardRef,
-        discounts: discounts == null ? void 0 : discounts.cards,
-        isPaymentInProgress,
-        onPaymentStart: handlePaymentStart,
-        onPaymentEnd: handlePaymentEnd
+        discounts: discounts == null ? void 0 : discounts.cards
       }) : /*#__PURE__*/(0,jsx_runtime.jsx)(jsx_runtime.Fragment, {
         children: viewMode === 'list' ? /*#__PURE__*/(0,jsx_runtime.jsx)(ListView, {
           paymentMethods: paymentMethods,
@@ -84041,10 +82769,7 @@ const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
           integrationType,
           publicKey,
           ref: cardRef,
-          discounts: discounts == null ? void 0 : discounts.cards,
-          isPaymentInProgress,
-          onPaymentStart: handlePaymentStart,
-          onPaymentEnd: handlePaymentEnd
+          discounts: discounts == null ? void 0 : discounts.cards
         }) : /*#__PURE__*/(0,jsx_runtime.jsx)(List_TabView, {
           paymentMethods: paymentMethods,
           customStyle,
@@ -84063,10 +82788,7 @@ const PaymentsList = /*#__PURE__*/(0,react.forwardRef)((props, ref) => {
           integrationType,
           publicKey,
           ref: cardRef,
-          discounts: discounts == null ? void 0 : discounts.cards,
-          isPaymentInProgress,
-          onPaymentStart: handlePaymentStart,
-          onPaymentEnd: handlePaymentEnd
+          discounts: discounts == null ? void 0 : discounts.cards
         })
       })
     })]