@paykka/card-checkout-ui 0.13.17 → 0.14.0

package/dist/es/components/SecuredIframe/index.js

@@ -199,6 +199,7 @@ const FieldIframe = (props) => {
   const inputRef = A(null);
   const { initSecuredInput, getConfigByFieldType, getCurrCardBrand, cardBin, value, brand } = useSecuredInput();
   const [hasInit, setHasInit] = h(false);
+  const [disabled, setDisabled] = h(false);
   const inputId = "securedInput";
   const initInput = () => {
     initSecuredInput({
@@ -294,6 +295,11 @@ const FieldIframe = (props) => {
         processValidStatusChanged("error", error);
         sendValidateMessage("error");
       }
+    } else if (feedbackData.action === MessageAction.SET_CONFIG) {
+      const data2 = feedbackData;
+      if (data2.disabled !== void 0) {
+        setDisabled(data2.disabled);
+      }
     }
   };
   y(() => {
@@ -367,9 +373,8 @@ const FieldIframe = (props) => {
       checkoutId
     };
     postMessageToIframe(validData, window.parent);
-    if (status !== "success") {
+    if (status !== "success")
       return;
-    }
     sendValidWithValueMessage();
   };
   const sendValidWithValueMessage = () => {
@@ -405,7 +410,7 @@ const FieldIframe = (props) => {
       ref: inputRef,
       placeholder: props.placeholder,
       autocomplete: "off",
-      disabled: !hasInit
+      disabled: !hasInit || disabled
     }
   );
 };
@@ -419,49 +424,52 @@ const HiddenIframe = ({ checkoutId }) => {
     cpf: void 0
   };
   const onReceiveMessage = async (event) => {
-    const { data } = event;
-    const parsedData = safeParse(data);
-    if (!Reflect.has(parsedData, "action")) {
+    const { data, origin } = event;
+    const feedbackData = safeParse(data);
+    if (!Reflect.has(feedbackData, "action"))
       return;
-    }
-    if (parsedData.checkoutId !== checkoutId) {
+    if (feedbackData.checkoutId !== checkoutId)
       return;
-    }
-    if (parsedData.action === MessageAction.VALID_WITH_VALUE) {
-      const feedbackData = parsedData;
-      switch (feedbackData.fieldType) {
+    if (feedbackData.action === MessageAction.VALID_WITH_VALUE) {
+      const data2 = feedbackData;
+      switch (data2.fieldType) {
         case EFieldType.CVV: {
-          formData.cvv = feedbackData.value;
+          formData.cvv = data2.value;
           break;
         }
         case EFieldType.CARD_NUMBER: {
-          formData.cardNo = trimAll(feedbackData.value);
+          formData.cardNo = trimAll(data2.value);
           break;
         }
         case EFieldType.EXPIRE_DATE: {
-          const [expMonth, expYear] = feedbackData.value.split("/");
+          const [expMonth, expYear] = data2.value.split("/");
           formData.expMonth = expMonth;
           formData.expYear = `20${expYear}`;
           break;
         }
         case EInternalFieldType.CPF: {
-          formData.cpf = limitedToNumber(trimAll(feedbackData.value));
+          formData.cpf = limitedToNumber(trimAll(data2.value));
           break;
         }
       }
-    } else if (parsedData.action === MessageAction.PAYMENT) {
-      const feedbackData = parsedData;
-      pay(feedbackData.formData, feedbackData.locale, feedbackData.extraParams);
-    } else if (parsedData.action === MessageAction.ENCRYPT_CARD) {
-      const feedbackData = parsedData;
+    } else if (feedbackData.action === MessageAction.PAYMENT) {
+      const data2 = feedbackData;
+      pay(data2.formData, data2.locale, data2.extraParams);
+    } else if (feedbackData.action === MessageAction.ENCRYPT_CARD) {
+      const data2 = feedbackData;
       try {
-        const res = await encryptCard({ ...feedbackData, ...formData });
+        const res = await encryptCard({ ...data2, ...formData });
         sendCardEncryptedMessage(res);
       } catch (error) {
         console.log("error", error);
         sendCardEncryptionFailedMessage(error);
       }
-    }
+    } else if (feedbackData.action === MessageAction.DDC_CARD_BIN) {
+      if (origin !== cdnOrigin)
+        return;
+      sendDDCCardBinMessage(event.source);
+    } else
+      ;
   };
   y(() => {
     window.addEventListener("message", onReceiveMessage);
@@ -500,6 +508,14 @@ const HiddenIframe = ({ checkoutId }) => {
       }
     });
   };
+  const sendDDCCardBinMessage = (target) => {
+    const data = {
+      action: MessageAction.DDC_CARD_BIN,
+      checkoutId,
+      bin: limitedToNumber(formData.cardNo).slice(0, 9)
+    };
+    postMessageToIframe(data, target);
+  };
   const sendAfterPaymentMessage = (response, requestInfo) => {
     const data = {
       action: MessageAction.AFTER_PAYMENT,
@@ -541,6 +557,7 @@ const HiddenIframe = ({ checkoutId }) => {
   const sendHiddenIframeReadyMessage = () => {
     const data = {
       action: MessageAction.HIDDEN_IFRAME_READY,
+      name: window.name,
       checkoutId
     };
     postMessageToIframe(data, window.parent);

package/dist/es/components/SubmitButton/index.js

@@ -51,7 +51,7 @@ const SubmitButton = (props) => {
       className: normalizedClass(bem({ success: status === "success" }), className),
       style,
       loading: status === "loading",
-      disabled: props.disabled || status === "success",
+      disabled: (props.disabled || status === "success") && status !== "loading",
       children: /* @__PURE__ */ u("span", { class: bem("text", { "not-verified": !props.verified }), children: content })
     }
   );

package/dist/es/components/ThreeDS/index.js

@@ -9,6 +9,7 @@ import { useBEM } from "../../hooks/useBEM.js";
 import { useI18n } from "../../hooks/useI18n.js";
 import { safeParse } from "../../utils/index.js";
 import { cdnOrigin } from "../../config.js";
+import { noticeThreeDSOperate, ThreeDSAuthOperate } from "../../api/modules/threeDS/index.js";
 import { MessageAction } from "../../types/message.js";
 import { ThreeDSEventType } from "../../types/event.js";
 import { useBreakpoints } from "../../hooks/useBreakpoints.js";
@@ -28,26 +29,31 @@ const ThreeDSAuth = (props) => {
     checkoutId
   } = props;
   const breakpoints = useBreakpoints();
-  const [continueThreeDs, setContinueThreeDs] = h(false);
+  const [continueThreeDS, setContinueThreeDS] = h(false);
   const messageHandler = A();
   const iframeRef = A(null);
   const [iframeName] = h(`${THREE_DS_IFRAME_NAME}-${checkoutId}-${Date.now()}`);
+  const innerChannelLoaded = A(false);
+  const authId = A(void 0);
   const { i18n } = useI18n();
   const { core } = x(CoreContext) ?? {};
-  const handleLastThreeDs = () => {
-    setContinueThreeDs(true);
+  const handleLastThreeDS = () => {
+    setContinueThreeDS(true);
   };
   const onChange = (status) => {
     var _a, _b;
     if (!status) {
       (_b = (_a = core == null ? void 0 : core.config) == null ? void 0 : _a.onEvent) == null ? void 0 : _b.call(_a, ThreeDSEventType.THREE_DS_CANCELLED);
       onClose == null ? void 0 : onClose();
+      console.log("onChange", innerChannelLoaded.current, authId.current);
+      if (innerChannelLoaded.current && authId.current) {
+        noticeThreeDSOperate(authId.current, ThreeDSAuthOperate.CANCEL);
+      }
     }
   };
   const modalWidth = T(() => {
-    if (!show) {
+    if (!show)
       return "0";
-    }
     return width || (breakpoints.smaller("sm") ? "90vw" : "600px");
   }, [show, width, breakpoints.matches]);
   y(() => {
@@ -62,16 +68,14 @@ const ThreeDSAuth = (props) => {
         window.removeEventListener("message", messageHandler.current);
       }
       messageHandler.current = (event) => {
-        var _a2, _b2, _c2, _d2;
+        var _a2, _b2, _c2, _d2, _e, _f;
         const { data, origin } = event;
-        if (origin !== cdnOrigin) {
+        if (origin !== cdnOrigin)
           return;
-        }
         const feedbackData = safeParse(data);
         console.log(feedbackData, checkoutId);
-        if (feedbackData.checkoutId !== checkoutId) {
+        if (feedbackData.checkoutId !== checkoutId)
           return;
-        }
         switch (feedbackData.action) {
           case MessageAction.CHECK_THREE_DS: {
             onClose == null ? void 0 : onClose();
@@ -79,13 +83,26 @@ const ThreeDSAuth = (props) => {
             break;
           }
           case MessageAction.THREE_DS_AUTH_LOADED: {
+            const data2 = feedbackData;
             (_d2 = (_c2 = core == null ? void 0 : core.config) == null ? void 0 : _c2.onEvent) == null ? void 0 : _d2.call(_c2, ThreeDSEventType.THREE_DS_AUTH);
+            authId.current = data2.authId;
+            console.log("认证id", authId.current);
+            break;
+          }
+          case MessageAction.THREE_DS_INNER_CHANNEL_LOADED: {
+            (_f = (_e = core == null ? void 0 : core.config) == null ? void 0 : _e.onEvent) == null ? void 0 : _f.call(_e, ThreeDSEventType.THREE_DS_INNER_CHANNEL);
+            innerChannelLoaded.current = true;
+            console.log("innerChannelLoaded", innerChannelLoaded.current, authId.current);
+            if (authId.current) {
+              noticeThreeDSOperate(authId.current, ThreeDSAuthOperate.OPEN);
+            }
             break;
           }
         }
       };
       window.addEventListener("message", messageHandler.current);
     } else {
+      innerChannelLoaded.current = false;
       messageHandler.current && window.removeEventListener("message", messageHandler.current);
     }
   }, [show]);
@@ -101,7 +118,7 @@ const ThreeDSAuth = (props) => {
         maxHeight: "calc(100vh - 100px)",
         minWidth: "300px"
       },
-      children: /* @__PURE__ */ u("div", { className: bem("content"), children: !incomplete || continueThreeDs ? /* @__PURE__ */ u(
+      children: /* @__PURE__ */ u("div", { className: bem("content"), children: !incomplete || continueThreeDS ? /* @__PURE__ */ u(
         "iframe",
         {
           ref: iframeRef,
@@ -125,7 +142,7 @@ const ThreeDSAuth = (props) => {
               backgroundColor: theme == null ? void 0 : theme.payButtonBackgroundColor,
               color: theme == null ? void 0 : theme.payButtonTextColor
             },
-            onClick: handleLastThreeDs,
+            onClick: handleLastThreeDS,
             children: i18n.get("common.confirm")
           }
         ) })

package/dist/es/components/WechatPay/index.js

@@ -3,7 +3,7 @@ import { isTimeoutError } from "../../api/http.js";
 import "../../utils/card-brand/brands.js";
 import "../../utils/system-info/get-browser-info.js";
 import { normalizedClass, formatAmount } from "../../utils/format.js";
-import { formatPaymentResult } from "../../utils/payment.js";
+import { processPaymentStatus, formatPaymentResult } from "../../utils/payment.js";
 import { getBrowserParams } from "../../api/modules/get-browser-params.js";
 import { PaymentMethod, COMMON_CLASS_NAME, PaymentType, SessionMode } from "../../constant.js";
 import { getWechatPayInfo, wechatPay } from "../../api/modules/wechat-pay/index.js";
@@ -13,7 +13,7 @@ import "../../out/worldpay-jsc-origin.js";
 import { useBEM } from "../../hooks/useBEM.js";
 import { usePayState } from "../../hooks/usePayState.js";
 import { useRetry } from "../../hooks/useRetry.js";
-import { AddressField } from "../AddressField/index.js";
+import { DEFAULT_ADDRESS, AddressField } from "../AddressField/index.js";
 import { createEmailCore, EmailField } from "../EmailField/EmailField.js";
 import "../internal/Form/type.js";
 import "../internal/Form/context.js";
@@ -27,7 +27,7 @@ const { bem } = useBEM("wechat-pay");
 const fieldClassNames = bem("field");
 const WechatPay = w((props, ref) => {
   var _a;
-  const { session, core, showEmail = false, showAddress = false } = props;
+  const { session, core, showEmail = false, showAddress = false, autoQuery = true } = props;
   const addressCore = core.getAddressCore();
   const emailState = createEmailCore();
   const emailFieldRef = A(null);
@@ -38,43 +38,34 @@ const WechatPay = w((props, ref) => {
     },
     startRetry: (timeout) => {
       setSubmitButtonStatus("loading");
-      startReFetchPayInfo({
-        timeout
-      });
+      startReFetchPayInfo({ timeout });
     },
     updateAddress: () => {
       var _a2;
       if (!(fieldStatus == null ? void 0 : fieldStatus.address.show))
         return;
-      const newForm = Object.assign(form, { address: addressCore.getAddressState() });
-      setForm(newForm);
-      (_a2 = addressFieldRef.current) == null ? void 0 : _a2.update(addressCore.getAddressState());
-      validateForm();
+      const address = addressCore.getAddressState();
+      form.address = address;
+      setForm(form);
+      (_a2 = addressFieldRef.current) == null ? void 0 : _a2.update(address);
+      validateFormSilently();
     },
     updateEmail: () => {
       var _a2;
       if (!(fieldStatus == null ? void 0 : fieldStatus.email.show))
         return;
-      const newForm = Object.assign(form, { email: emailState.email });
-      setForm(newForm);
+      form.email = emailState.email;
+      setForm(form);
       (_a2 = emailFieldRef.current) == null ? void 0 : _a2.update(emailState.email);
-      validateForm();
+      validateFormSilently();
     }
   }));
-  const { setErrorMsg, fraudDetection, i18n, errorMsg, sessionReady } = usePayState(session, props.core);
+  const { setErrorMsg, fraudDetection, i18n, errorMsg, sessionReady, disabled } = usePayState(session, props.core);
   const [submitButtonStatus, setSubmitButtonStatus] = h("unSubmit");
   const formRef = A(null);
   const [form, setForm] = h({
     email: "",
-    address: {
-      country: void 0,
-      province: void 0,
-      city: void 0,
-      area: void 0,
-      postCode: void 0,
-      address1: void 0,
-      address2: void 0
-    }
+    address: { ...DEFAULT_ADDRESS }
   });
   const [validated, setValidated] = h(false);
   const [fieldStatus, setFieldStatus] = h();
@@ -85,14 +76,10 @@ const WechatPay = w((props, ref) => {
       paymentMethod: CURR_PAYMENT_METHOD
     };
   };
-  function validateForm() {
+  const validateFormSilently = () => {
     var _a2;
-    (_a2 = formRef.current) == null ? void 0 : _a2.validate(void 0, false).then(() => {
-      setValidated(true);
-    }).catch(() => {
-      setValidated(false);
-    });
-  }
+    (_a2 = formRef.current) == null ? void 0 : _a2.validate(void 0, false).then(() => setValidated(true)).catch(() => setValidated(false));
+  };
   const initFieldStatus = () => {
     const { field, sessionMode } = session.checkout;
     const { email, address } = field;
@@ -107,7 +94,7 @@ const WechatPay = w((props, ref) => {
     setFieldStatus({ ...field });
   };
   y(() => {
-    validateForm();
+    validateFormSilently();
   }, [form]);
   const processOnSuccess = (res) => {
     var _a2, _b;
@@ -119,11 +106,12 @@ const WechatPay = w((props, ref) => {
     (_b = props.onSuccess) == null ? void 0 : _b.call(props, result, getPaymentMethodContext());
   };
   y(() => {
+    var _a2;
     if (!sessionReady) {
       return;
     }
     const { bill = {}, supportMethods = [], country } = (session == null ? void 0 : session.checkout) || {};
-    if (!supportMethods.includes(PaymentMethod.WECHAT_PAY)) {
+    if (!supportMethods.includes(CURR_PAYMENT_METHOD)) {
       return;
     }
     initFieldStatus();
@@ -131,10 +119,15 @@ const WechatPay = w((props, ref) => {
     country && addressCore.setCountry(country);
     form.email = bill.email ?? "";
     form.address.country = country;
+    if (autoQuery && ((_a2 = core.payment) == null ? void 0 : _a2.currPaymentMethod.value) === CURR_PAYMENT_METHOD) {
+      setSubmitButtonStatus("loading");
+      startReFetchPayInfo();
+    }
   }, [sessionReady]);
   const onTimeout = q(
     (message) => {
       var _a2;
+      core.payment.resetCurrPaymentMethod();
       setErrorMsg(message || i18n.get("common.payTimeout"));
       setSubmitButtonStatus("unSubmit");
       (_a2 = props.onTimeout) == null ? void 0 : _a2.call(props, "retry", getPaymentMethodContext());
@@ -167,7 +160,7 @@ const WechatPay = w((props, ref) => {
       },
       channelUserId: await ((_a2 = props.onGetOpenId) == null ? void 0 : _a2.call(props)),
       payment: {
-        paymentMethod: PaymentMethod.WECHAT_PAY
+        paymentMethod: CURR_PAYMENT_METHOD
       },
       browser: await getBrowserParams({
         fraudDetectionId: await (fraudDetection == null ? void 0 : fraudDetection.getFraudDetectionId())
@@ -175,65 +168,70 @@ const WechatPay = w((props, ref) => {
     };
   };
   async function pay(search = false, timeout) {
-    var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+    var _a2, _b, _c, _d, _e, _f;
     try {
+      core.payment.currPaymentMethod.value = CURR_PAYMENT_METHOD;
       const requestOptions = { locale: i18n.locale, timeout };
       let res = null;
       if (search) {
-        const extraParams = (_b = (_a2 = core.config)._getExtraParams) == null ? void 0 : _b.call(_a2, "query", PaymentMethod.WECHAT_PAY);
+        const extraParams = (_b = (_a2 = core.config)._getExtraParams) == null ? void 0 : _b.call(_a2, "query", CURR_PAYMENT_METHOD);
         res = await getWechatPayInfo(
           {
             sessionId: session.sessionId,
             clientKey: session.clientKey,
-            paymentMethod: PaymentMethod.WECHAT_PAY
+            paymentMethod: CURR_PAYMENT_METHOD
           },
           extraParams,
           requestOptions
         );
       } else {
-        const extraParams = (_d = (_c = core.config)._getExtraParams) == null ? void 0 : _d.call(_c, "payment", PaymentMethod.WECHAT_PAY);
+        const extraParams = (_d = (_c = core.config)._getExtraParams) == null ? void 0 : _d.call(_c, "payment", CURR_PAYMENT_METHOD);
         res = await wechatPay(await getPaymentParams(), extraParams, requestOptions);
       }
-      const { status, orderStatus, errorMessage, payInfo, errorCode, sessionId } = res;
+      const { errorMessage, payInfo, errorCode, sessionId } = res;
       sessionId && (session.sessionId = sessionId);
       !search && ((_e = props.onSubmitResponse) == null ? void 0 : _e.call(props, res, getPaymentMethodContext()));
-      if (status === "PROCESSING") {
-        if (!orderStatus) {
-          setSubmitButtonStatus("unSubmit");
-          return { end: true };
-        } else if (orderStatus === "SUCCESS") {
+      let end = true;
+      await processPaymentStatus(res, {
+        onProcessing: async () => {
+          var _a3;
+          if (!search) {
+            await ((_a3 = props.onCallWxPayBox) == null ? void 0 : _a3.call(props, payInfo));
+            startReFetchPayInfo();
+          }
+          end = false;
+        },
+        onSuccess: () => {
           processOnSuccess(res);
-          return { end: true };
-        } else if (orderStatus === "FAILURE") {
+        },
+        onFailure: () => {
+          var _a3;
+          core.payment.resetCurrPaymentMethod();
           errorMessage && setErrorMsg(errorMessage);
           setSubmitButtonStatus("unSubmit");
-          (_f = props.onError) == null ? void 0 : _f.call(
+          (_a3 = props.onError) == null ? void 0 : _a3.call(
             props,
             new PayKKaError("API_ERROR", errorMessage, { code: errorCode }),
             getPaymentMethodContext()
           );
-          return { end: true };
-        } else if (orderStatus === "PROCESSING") {
-          if (!search) {
-            await ((_g = props.onCallWxPayBox) == null ? void 0 : _g.call(props, payInfo));
-            startReFetchPayInfo();
-          }
-          return { end: false };
-        } else if (orderStatus === "CANCELED") {
+        },
+        onCanceled: () => {
+          var _a3;
+          core.payment.resetCurrPaymentMethod();
+          setSubmitButtonStatus("unSubmit");
+          (_a3 = props.onTimeout) == null ? void 0 : _a3.call(props, "channel", getPaymentMethodContext());
+        },
+        onExpired: () => {
+          var _a3;
+          setSubmitButtonStatus("unSubmit");
+          (_a3 = props.onExpired) == null ? void 0 : _a3.call(props, getPaymentMethodContext());
+        },
+        onDefault: () => {
+          core.payment.resetCurrPaymentMethod();
           setSubmitButtonStatus("unSubmit");
-          (_h = props.onTimeout) == null ? void 0 : _h.call(props, "channel", getPaymentMethodContext());
-          return { end: true };
         }
-      } else if (status === "SUCCESS") {
-        processOnSuccess(res);
-        return { end: true };
-      } else if (status === "EXPIRED") {
-        setSubmitButtonStatus("unSubmit");
-        (_i = props.onExpired) == null ? void 0 : _i.call(props, getPaymentMethodContext());
-        return { end: true };
-      }
-      setSubmitButtonStatus("unSubmit");
-      return { end: true };
+      });
+      return { end };
     } catch (error) {
       if (isTimeoutError(error)) {
         if (search) {
@@ -243,9 +241,10 @@ const WechatPay = w((props, ref) => {
           return { end: true };
         }
       } else {
+        core.payment.resetCurrPaymentMethod();
         const message = error.i18nKey ? i18n.get(error.i18nKey) : error.message;
         message && setErrorMsg(message);
-        (_j = props.onError) == null ? void 0 : _j.call(
+        (_f = props.onError) == null ? void 0 : _f.call(
           props,
           new PayKKaError("API_ERROR", message, { code: error.code, cause: error }),
           getPaymentMethodContext()
@@ -282,6 +281,7 @@ const WechatPay = w((props, ref) => {
       {
         className: bem("button"),
         status: submitButtonStatus,
+        disabled,
         text,
         loadingText: i18n.get("common.payProcessing"),
         successText: i18n.get("common.paySuccess"),
@@ -292,7 +292,7 @@ const WechatPay = w((props, ref) => {
   };
   const setFormRef = (dom) => {
     formRef.current = dom;
-    dom && validateForm();
+    dom && validateFormSilently();
   };
   const Email = () => {
     return /* @__PURE__ */ u(b, { children: (fieldStatus == null ? void 0 : fieldStatus.email.show) && /* @__PURE__ */ u("div", { className: fieldClassNames, children: /* @__PURE__ */ u(
@@ -300,7 +300,7 @@ const WechatPay = w((props, ref) => {
       {
         ref: emailFieldRef,
         value: form.email,
-        disabled: fieldStatus == null ? void 0 : fieldStatus.email.disabled
+        disabled: (fieldStatus == null ? void 0 : fieldStatus.email.disabled) || disabled
       }
     ) }) });
   };
@@ -310,6 +310,7 @@ const WechatPay = w((props, ref) => {
       {
         ref: addressFieldRef,
         value: form.address,
+        disabled,
         onChange: (value) => setForm(Object.assign(form, { address: value }))
       }
     ) }) });

package/dist/es/components/business/PhoneField/PhoneField.js

@@ -98,6 +98,7 @@ const PhoneField = (props) => {
             options: phoneList,
             filterable: false,
             inputClassName: bem("areaCode-input"),
+            disabled,
             onSelect: (v) => {
               formContext == null ? void 0 : formContext.setForm((prev) => ({ ...prev, areaCode: String(v) }));
             }

package/dist/es/components/index.js

@@ -29,13 +29,13 @@ import "./Sepa/index.js";
 import "./EncryptedCard/index.js";
 import "./CombinedCardInfo/index.js";
 import "./DropIn/index.js";
-import "./Boost/index.js";
-import "./LinePay/index.js";
-import "./MayBankQRPay/index.js";
-import "./NinePay/index.js";
-import "./GrabPay/index.js";
-import "./TNGWallet/index.js";
-import "./ShopeePay/index.js";
+import "./wallets/Boost/Boost.js";
+import "./wallets/GrabPay/GrabPay.js";
+import "./wallets/LinePay/LinePay.js";
+import "./wallets/NinePay/NinePay.js";
+import "./wallets/MayBankQRPay/MayBankQRPay.js";
+import "./wallets/ShopeePay/ShopeePay.js";
+import "./wallets/TNGWallet/TNGWallet.js";
 import "./wallets/GCash/GCash.js";
 import "./wallets/Paymaya/Paymaya.js";
 import "./wallets/Zalopay/Zalopay.js";

package/dist/es/components/internal/CheckBox/CheckBox.js

@@ -10,14 +10,14 @@ import "../../../out/worldpay-jsc-origin.js";
 import { IconChecked } from "../icons/iconChecked.js";
 const { bem } = useBEM("check-box");
 const CheckBox = (props) => {
-  const { checked, onChange, label, style } = props;
+  const { checked, onChange, label, style, disabled } = props;
   const handleChange = () => {
     onChange == null ? void 0 : onChange(!checked);
   };
   return /* @__PURE__ */ u(
     "div",
     {
-      className: normalizedClass(COMMON_CLASS_NAME, bem({ checked })),
+      className: normalizedClass(COMMON_CLASS_NAME, bem({ checked, disabled })),
       onClick: handleChange,
       style,
       children: [

package/dist/es/components/internal/Input/Input.js

@@ -108,7 +108,7 @@ const Input = w((props, ref) => {
         autocomplete: "off"
       }
     ),
-    !!rightIcon && /* @__PURE__ */ u("div", { class: inputBEM.bem("right-icon"), children: rightIcon })
+    !!rightIcon && /* @__PURE__ */ u("div", { class: inputBEM.bem("right-icon", { disabled }), children: rightIcon })
   ] }) });
 });
 export {

package/dist/es/components/internal/Select/Select.js

@@ -16,6 +16,7 @@ import { SelectMenu } from "./SelectMenu.js";
 import { SelectMenuItem } from "./SelectMenuItem.js";
 const { bem } = useBEM("select");
 const Select = w((props, ref) => {
+  const { disabled } = props;
   const formItemContext = x(FormItemContext);
   let status = props.status ?? (formItemContext == null ? void 0 : formItemContext.validationResult.status);
   if (status === "unValidate")
@@ -160,6 +161,7 @@ const Select = w((props, ref) => {
     /* @__PURE__ */ u(FormItemContext.Provider, { value: null, children: /* @__PURE__ */ u(
       Input,
       {
+        disabled,
         ref: inputRef,
         value: inputValue,
         status,
@@ -180,7 +182,8 @@ const Select = w((props, ref) => {
         class: bem("render-label", [
           {
             placeholder: isFocus,
-            hidden: isInputChange
+            hidden: isInputChange,
+            disabled
           }
         ]),
         onClick: onClickDisplay,

package/dist/es/components/internal/icons/IconArrowDown.js

@@ -4,7 +4,7 @@ import { isUndefined } from "../../../utils/is.js";
 import "../../../utils/card-brand/brands.js";
 import "../../../utils/system-info/get-browser-info.js";
 import { normalizedClass } from "../../../utils/format.js";
-function IconArrowDown({ size, style, className }) {
+const IconArrowDown = ({ size, style, className }) => {
   const computedSize = !isUndefined(size) ? `${size}px` : "1em";
   return /* @__PURE__ */ u(
     "svg",
@@ -12,17 +12,17 @@ function IconArrowDown({ size, style, className }) {
       width: computedSize,
       height: computedSize,
       viewBox: "0 0 16 16",
-      fill: "none",
+      fill: "currentColor",
       xmlns: "http://www.w3.org/2000/svg",
       style,
       className: normalizedClass(COMMON_CLASS_NAME, className),
       children: [
-        /* @__PURE__ */ u("g", { id: "icon-wrapper", "clip-path": "url(#clip0_543_1600)", children: /* @__PURE__ */ u("g", { id: "direction/down", children: /* @__PURE__ */ u("path", { id: "Vector", "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6719 6.28589L12.7291 5.34308L8.01502 10.0571L3.30098 5.34308L2.35817 6.28589L7.54358 11.4713C7.54358 11.4713 7.54362 11.4713 8.01502 10.9999L7.54358 11.4713L8.01502 11.9427L13.6719 6.28589Z", fill: "#1F1F1F" }) }) }),
+        /* @__PURE__ */ u("g", { id: "icon-wrapper", "clip-path": "url(#clip0_543_1600)", children: /* @__PURE__ */ u("g", { id: "direction/down", children: /* @__PURE__ */ u("path", { id: "Vector", "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6719 6.28589L12.7291 5.34308L8.01502 10.0571L3.30098 5.34308L2.35817 6.28589L7.54358 11.4713C7.54358 11.4713 7.54362 11.4713 8.01502 10.9999L7.54358 11.4713L8.01502 11.9427L13.6719 6.28589Z", fill: "currentColor" }) }) }),
         /* @__PURE__ */ u("defs", { children: /* @__PURE__ */ u("clipPath", { id: "clip0_543_1600", children: /* @__PURE__ */ u("rect", { width: "16", height: "16", fill: "white" }) }) })
       ]
     }
   );
-}
+};
 export {
   IconArrowDown
 };