@paykka/card-checkout-ui 0.8.0 → 0.9.2

package/dist/es/types/index.js

@@ -5,6 +5,7 @@ var CardBrandCode = /* @__PURE__ */ ((CardBrandCode2) => {
   CardBrandCode2["AMEX"] = "AMEX";
   CardBrandCode2["DISCOVER"] = "DISCOVER";
   CardBrandCode2["DINERS_CLUB"] = "DINERS_CLUB";
+  CardBrandCode2["CHINA_UNION_PAY"] = "CHINA_UNION_PAY";
   return CardBrandCode2;
 })(CardBrandCode || {});
 const defaultInputStyleConfig = {

package/dist/es/utils/array.js

@@ -0,0 +1,9 @@
+const removeElementFromArray = (array, element) => {
+  const index = array.indexOf(element);
+  if (index !== -1) {
+    array.splice(index, 1);
+  }
+};
+export {
+  removeElementFromArray
+};

package/dist/es/utils/card-brand/brands.js

@@ -7,6 +7,8 @@ import { IconDiscover } from "../../components/internal/icons/IconDiscover.js";
 import { IconJcb } from "../../components/internal/icons/IconJcb.js";
 import { IconMasterCard } from "../../components/internal/icons/IconMasterCard.js";
 import { IconVisa } from "../../components/internal/icons/IconVisa.js";
+import { IconUnionPay } from "../../components/internal/icons/IconUnionPay.js";
+import { luhnCheck } from "./luhn.js";
 const cardBrandCodes = Object.values(CardBrandCode);
 const cardBrands = [
   {
@@ -50,6 +52,13 @@ const cardBrands = [
     pattern: /^3(?:0([0-5]|9)|[689]\d?)\d{0,11}/,
     lengths: [14, 16],
     order: 5
+  },
+  {
+    name: "China UnionPay",
+    code: CardBrandCode.CHINA_UNION_PAY,
+    validator: luhnCheck,
+    lengths: [14, 15, 16, 17, 18, 19],
+    order: 6
   }
 ];
 const getCardBrandIconMap = (code) => {
@@ -59,7 +68,8 @@ const getCardBrandIconMap = (code) => {
     [CardBrandCode.JCB]: IconJcb,
     [CardBrandCode.AMEX]: IconAmex,
     [CardBrandCode.DISCOVER]: IconDiscover,
-    [CardBrandCode.DINERS_CLUB]: IconDinnersClub
+    [CardBrandCode.DINERS_CLUB]: IconDinnersClub,
+    [CardBrandCode.CHINA_UNION_PAY]: IconUnionPay
   }[code];
 };
 [

package/dist/es/utils/card-brand/index.js

@@ -3,16 +3,17 @@ function getSupportedCardBrands(supportedCardBrands) {
   return supportedCardBrands ? cardBrands.filter((brand) => supportedCardBrands.includes(brand.code)).sort((a, b) => a.order - b.order) : [];
 }
 function findCardBrand(number, brands = cardBrands) {
+  var _a, _b;
   for (const item of brands) {
-    if (item.pattern.test(number)) {
+    if (((_a = item.pattern) == null ? void 0 : _a.test(number)) || ((_b = item.validator) == null ? void 0 : _b.call(item, number))) {
       return item;
     }
   }
 }
 function findCardBrandInfo(number, brands = cardBrands) {
-  console.log(number, brands);
+  var _a, _b;
   for (const item of brands) {
-    if (item.pattern.test(number)) {
+    if (((_a = item.pattern) == null ? void 0 : _a.test(number)) || ((_b = item.validator) == null ? void 0 : _b.call(item, number))) {
       return getCardBrandInfo(item);
     }
   }

package/dist/es/utils/card-brand/luhn.js

@@ -0,0 +1,25 @@
+const luhnCheck = (cardNumber) => {
+  const luhnRegex = /^(62[0-9]{14,17})$|^(62[0-9]{4}([ -]?)[0-9]{4}\2[0-9]{4}\2[0-9]{1,7})$/;
+  if (!luhnRegex.test(cardNumber)) {
+    console.log("luhnRegex", cardNumber);
+    return false;
+  }
+  const cleanNum = cardNumber.replace(/\D/g, "");
+  let sum = 0;
+  let isEven = false;
+  for (let i = cleanNum.length - 1; i >= 0; i--) {
+    let digit = parseInt(cleanNum.charAt(i));
+    if (isEven) {
+      digit *= 2;
+      if (digit > 9)
+        digit -= 9;
+    }
+    sum += digit;
+    isEven = !isEven;
+  }
+  console.log("luhnRegex", cardNumber, sum % 10 === 0);
+  return sum % 10 === 0;
+};
+export {
+  luhnCheck
+};

package/dist/es/utils/date.js

@@ -0,0 +1,25 @@
+const DATE_FORMAT = "MM/DD/YYYY";
+const DATE_TIME_FORMAT = `${DATE_FORMAT} HH:mm:ss`;
+const timeTemplateMap = {
+  date: DATE_FORMAT,
+  datetime: DATE_TIME_FORMAT
+};
+const formatTime = (value, template = "datetime") => {
+  if (!value && value !== 0) {
+    return "-";
+  }
+  if (template in timeTemplateMap) {
+    template = timeTemplateMap[template];
+  }
+  let date;
+  if (["number", "string"].includes(typeof value)) {
+    date = new Date(value);
+  } else {
+    date = value;
+  }
+  const pad = (n) => n.toString().padStart(2, "0");
+  return template.replace(/YYYY/g, date.getFullYear().toString()).replace(/MM/g, pad(date.getMonth() + 1)).replace(/DD/g, pad(date.getDate())).replace(/HH/g, pad(date.getHours())).replace(/mm/g, pad(date.getMinutes())).replace(/ss/g, pad(date.getSeconds()));
+};
+export {
+  formatTime
+};

package/dist/es/utils/detect.js

@@ -0,0 +1,6 @@
+const isEventSupported = (eventName, element = document.createElement("div")) => {
+  return "on" + eventName in element;
+};
+export {
+  isEventSupported
+};

package/dist/es/utils/format.js

@@ -36,18 +36,34 @@ function limitedToNumber(val, whitelist = []) {
 function trimAll(str) {
   return str.replace(/\s/g, "");
 }
-function toFixed(num, digits = 2) {
-  if (digits <= 0)
-    return num.toString();
-  const scaledNum = num * Math.pow(10, digits);
-  const roundedNum = Math.round(scaledNum);
-  const fixedNum = roundedNum / Math.pow(10, digits);
-  const [integer, decimal = ""] = fixedNum.toString().split(".");
-  return `${integer}.${decimal.padEnd(digits, "0")}`;
-}
-const formatAmount = (value = 0, digits = 2) => {
-  const RE = /\B(?=(\d{3})+(?!\d))/g;
-  return String(toFixed(value, digits)).replace(RE, ",");
+const formatAmount = ({ amount, digits, currency, symbol }) => {
+  const prefix = amount < 0 ? "-" : "";
+  const fixedNumArr = Number(Math.abs(amount)).toFixed(digits).split(".");
+  const numCommas = formatNumberWithCommas(fixedNumArr[0]);
+  const fixed = fixedNumArr.length === 2 ? [numCommas, fixedNumArr[1]].join(".") : numCommas;
+  function formatNumberWithCommas(number) {
+    let str = String(number).split("").reverse().join("");
+    str = str.replace(/(\d{3})(?=\d)/g, "$1,");
+    return str.split("").reverse().join("");
+  }
+  function fixedAmount() {
+    return `${prefix}${fixed}`;
+  }
+  function jointSymbol() {
+    return `${prefix}${symbol}${fixed}`;
+  }
+  function jointSymbolAndCurrency() {
+    return `${prefix}${symbol}${fixed} ${currency}`;
+  }
+  function jointCurrency() {
+    return `${prefix}${fixed} ${currency}`;
+  }
+  return {
+    fixedAmount,
+    jointSymbol,
+    jointSymbolAndCurrency,
+    jointCurrency
+  };
 };
 function cssVarPrefix(value) {
   return `--${PREFIX}-${value}`;

package/dist/es/utils/index.js

@@ -20,6 +20,13 @@ const safeParse = (dataStr, defaultValue = {}) => {
     return defaultValue;
   }
 };
+const safeStringify = (data, defaultValue = "") => {
+  try {
+    return JSON.stringify(data);
+  } catch (error) {
+    return defaultValue;
+  }
+};
 function isExpired(expireDate) {
   const [month, year] = expireDate.split("/").map(Number);
   const expiryDate = new Date(+`20${year}`, month - 1);
@@ -41,5 +48,6 @@ export {
   getIf,
   intersection,
   isExpired,
-  safeParse
+  safeParse,
+  safeStringify
 };

package/dist/es/utils/location.js

@@ -0,0 +1,37 @@
+const getUrlParam = (paramName) => {
+  if (typeof window === "undefined")
+    return null;
+  const params = new URLSearchParams(window.location.search);
+  return params.get(paramName);
+};
+const createUrlWithParams = (baseUrl, params) => {
+  const url = new URL(baseUrl);
+  Object.entries(params).forEach(([key, value]) => {
+    url.searchParams.append(key, String(value));
+  });
+  return url.toString();
+};
+const parseUrl = (url) => {
+  try {
+    const urlObj = new URL(url);
+    const params = {};
+    urlObj.searchParams.forEach((value, key) => {
+      params[key] = value;
+    });
+    const baseUrl = urlObj.origin + urlObj.pathname;
+    return {
+      baseUrl,
+      params
+    };
+  } catch (error) {
+    return {
+      baseUrl: url,
+      params: {}
+    };
+  }
+};
+export {
+  createUrlWithParams,
+  getUrlParam,
+  parseUrl
+};

package/dist/es/utils/object.js

@@ -0,0 +1,14 @@
+const deepMerge = (target, source) => {
+  const output = { ...target };
+  for (const key in source) {
+    if (Object.prototype.hasOwnProperty.call(source, key) && typeof source[key] === "object" && source[key] !== null && !Array.isArray(source[key]) && typeof output[key] === "object" && output[key] !== null && !Array.isArray(output[key])) {
+      output[key] = deepMerge(output[key], source[key]);
+    } else {
+      output[key] = source[key];
+    }
+  }
+  return output;
+};
+export {
+  deepMerge
+};

package/dist/es/utils/redirect.js

@@ -0,0 +1,32 @@
+import { parseUrl, createUrlWithParams } from "./location.js";
+const redirectToPayment = (payInfo) => {
+  const { request_url: url, request_method: method } = payInfo;
+  if (method === "GET") {
+    redirectByGet(url, {});
+  } else {
+    const { baseUrl, params } = parseUrl(url);
+    redirectByPost(baseUrl, params);
+  }
+};
+const redirectByGet = (baseUrl, params) => {
+  const url = createUrlWithParams(baseUrl, params);
+  window.location.href = url;
+};
+const redirectByPost = (baseUrl, params) => {
+  const form = document.createElement("form");
+  form.method = "POST";
+  form.action = baseUrl;
+  form.style.display = "none";
+  Object.entries(params).forEach(([key, value]) => {
+    const input = document.createElement("input");
+    input.type = "hidden";
+    input.name = key;
+    input.value = value;
+    form.appendChild(input);
+  });
+  document.body.appendChild(form);
+  form.submit();
+};
+export {
+  redirectToPayment
+};

package/dist/es/utils/system-info/get-browser-info.js

@@ -1,4 +1,4 @@
-function IEVersion() {
+const IEVersion = () => {
   const userAgent = navigator.userAgent;
   const isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
   const isEdge = userAgent.indexOf("Edge") > -1 && !isIE;
@@ -19,7 +19,7 @@ function IEVersion() {
   } else {
     return -1;
   }
-}
+};
 const ua = navigator.userAgent;
 const isAndroid = /android/i.test(ua);
 const isIOS = /iphone|ipad|ipod/i.test(ua);
@@ -27,7 +27,7 @@ const isWindows = ua.match(/Windows NT ([\d|\d.\d]*)/i);
 const isMac = /Macintosh|Mac/i.test(ua);
 const isLinux = /Linux|X11/i.test(ua);
 const isIPadOS = isMac && navigator.maxTouchPoints > 0;
-function getBrowserInfo() {
+const getBrowserInfo = () => {
   let language = navigator.language;
   let osname;
   let osversion;
@@ -179,7 +179,7 @@ function getBrowserInfo() {
     osname,
     osversion
   };
-}
+};
 export {
   getBrowserInfo
 };

package/dist/es/utils/system-info/get-system-info.js

@@ -1,13 +1,13 @@
 import { getBrowserInfo } from "./get-browser-info.js";
 let browserInfo;
 let _initBrowserInfo = false;
-function initBrowserInfo() {
+const initBrowserInfo = () => {
   if (_initBrowserInfo)
     return;
   browserInfo = getBrowserInfo();
   _initBrowserInfo = true;
-}
-function getDeviceInfo() {
+};
+const getDeviceInfo = () => {
   initBrowserInfo();
   const {
     deviceBrand,
@@ -31,8 +31,8 @@ function getDeviceInfo() {
     platform,
     system
   };
-}
-function getSystemInfo() {
+};
+const getSystemInfo = () => {
   initBrowserInfo();
   const deviceInfo = getDeviceInfo();
   const { ua, browserName, browserVersion, osname, osversion } = browserInfo;
@@ -46,7 +46,11 @@ function getSystemInfo() {
     ua
   });
   return systemInfo;
-}
+};
+const isMobile = () => {
+  return getDeviceInfo().deviceType === "MOBILE";
+};
 export {
-  getSystemInfo
+  getSystemInfo,
+  isMobile
 };

package/dist/es/utils/system-info/index.js

@@ -1,7 +1,7 @@
 import { getFingerprint } from "./finger-print.js";
 import "./get-browser-info.js";
 import { getSystemInfo } from "./get-system-info.js";
-function getTimeZoneOffset() {
+const getTimeZoneOffset = () => {
   let offsetMinutes = (/* @__PURE__ */ new Date()).getTimezoneOffset();
   const offsetHours = Math.abs(Math.floor(offsetMinutes / 60));
   const offsetSign = offsetMinutes < 0 ? "+" : "-";
@@ -9,8 +9,8 @@ function getTimeZoneOffset() {
   const hour = offsetHours.toString().padStart(2, "0");
   const min = offsetMinutes.toString().padStart(2, "0");
   return `${offsetSign}${hour}:${min}`;
-}
-async function getBrowser() {
+};
+const getBrowser = async () => {
   const { ua, deviceType, osName } = getSystemInfo();
   const { colorDepth, height: screenHeight, width: screenWidth } = window.screen;
   return {
@@ -26,7 +26,7 @@ async function getBrowser() {
     osName,
     deviceFingerprintId: await getFingerprint()
   };
-}
+};
 export {
   getBrowser
 };

package/dist/style.css

@@ -1 +1 @@
-.paykka-card-checkout,.paykka-card-checkout *{box-sizing:border-box}@media (min-width: 480px){.paykka-card-checkout-ali-pay__email{padding-bottom:20px}}.paykka-card-checkout-ali-pay__error{margin-top:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-ali-pay__error{margin-top:20px}}.paykka-card-checkout-ali-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-ali-pay__button{margin-top:20px}}.paykka-card-checkout-address-field__first-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-bottom-right-radius:0;border-bottom-left-radius:0}.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-radius:0;border-top:0}.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper:focus{border-top:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-top-right-radius:0;border-top-left-radius:0;border-top:0}.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper:focus{border-top:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-form-item{font-size:16px}.paykka-card-checkout-form-item__label{margin-bottom:8px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}@media (min-width: 480px){.paykka-card-checkout-form-item__label{margin-bottom:10px}}.paykka-card-checkout-form-item__error-text{margin-top:4px;color:#f53f3f;font-size:14px}.paykka-card-checkout-input{position:relative;box-sizing:border-box;font-size:16px}.paykka-card-checkout-input__input-wrapper{display:flex;align-items:center;height:44px;width:100%;border-radius:8px;border:1px solid #E1E1E5;transition:border .2s cubic-bezier(.4,0,.2,1),box-shadow .2s cubic-bezier(.4,0,.2,1);caret-color:var(--paykka-card-checkout-input-color, #4F43DF) .paykka-card-checkout-input__input-wrapper --error;caret-color-border:1px solid #F53F3F}.paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-input__input-wrapper:focus{border:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-input__input-wrapper-disabled{cursor:not-allowed;background:#f5f5f7}.paykka-card-checkout-input__input-wrapper-disabled:active,.paykka-card-checkout-input__input-wrapper-disabled--focus,.paykka-card-checkout-input__input-wrapper-disabled:focus{border:1px solid #F5F5F7;box-shadow:0 0 0 2px #f5f5f7}.paykka-card-checkout-input__input{outline:none;border:none;height:100%;width:100%;border-radius:8px;caret-color:var(--paykka-card-checkout-input-color, #4F43DF);font-size:16px;padding-left:12px;background-color:transparent}.paykka-card-checkout-input__input::placeholder{color:#c2c2c2}.paykka-card-checkout-input__input:-webkit-autofill,.paykka-card-checkout-input__input:-internal-autofill-selected{background-color:transparent!important}.paykka-card-checkout-input__right-icon{padding-right:12px;display:flex;align-items:center;flex-shrink:0;margin-left:12px}.paykka-card-checkout-input__left-icon{padding-left:12px;display:flex;align-items:center;flex-shrink:0;margin-right:12px}.paykka-card-checkout-select__wrapper{width:100%;position:relative;cursor:pointer}.paykka-card-checkout-select__render-label{position:absolute;top:0;line-height:44px;height:44px;padding:0 16px;display:flex}.paykka-card-checkout-select__render-label--placeholder{color:#c2c2c2}.paykka-card-checkout-select__render-label--hidden{visibility:hidden}.paykka-card-checkout-select__menu{margin-top:4px;width:100%;max-height:260px;background:#fff;box-shadow:0 4px 14px #0000001a;border-radius:4px;border:1px solid #EBEBEF;overflow-y:auto;z-index:999;position:absolute}.paykka-card-checkout-select__menu-item{padding:6px 12px;line-height:32px;color:#626266;cursor:pointer;display:flex;justify-content:space-between}.paykka-card-checkout-select__menu-item:hover,.paykka-card-checkout-select__menu-item:active,.paykka-card-checkout-select__menu-item--selected,.paykka-card-checkout-select__menu-item:focus{color:#1f1f1f;background:#f3f3f5}.paykka-card-checkout-select__menu-item-icon{margin-left:10px;display:flex;align-items:center}.paykka-card-checkout-select__menu-no-data{height:200px;display:flex;justify-content:center;align-items:center;color:#c2c2c2}.paykka-card-checkout-info{display:flex;align-items:center;padding:10px 14px;border-radius:4px}.paykka-card-checkout-info--error{background-color:#ffece8}.paykka-card-checkout-info__icon{margin-right:8px;height:1.3em;display:flex;align-items:center}.paykka-card-checkout-info__content{text-align:justify;word-break:break-all}.paykka-card-checkout-recurring-tip{display:flex;color:#a9a9a9}.paykka-card-checkout-recurring-tip__icon{width:20px;display:flex;padding-top:4px;padding-right:4px}.paykka-card-checkout-submit-button--success{opacity:1!important;background-color:#00b42a!important}.paykka-card-checkout-submit-button__text{line-height:1}.paykka-card-checkout-submit-button__text--not-verified{color:#fff9}.paykka-card-checkout-button{display:flex;align-items:center;justify-content:center;width:100%;height:44px;padding:0 14px;border-radius:8px;border:0;background-color:var(--paykka-card-checkout-button-bg-color, #4F43DF);color:var(--paykka-card-checkout-button-text-color, #fff);font-size:16px;cursor:pointer;text-decoration:none;transition:background-color .3s cubic-bezier(.4,0,.2,1)}.paykka-card-checkout-button:not(.paykka-card-checkout-button--loading).paykka-card-checkout-button:not(.paykka-card-checkout-button--disabled).paykka-card-checkout-button:not(.paykka-card-checkout-button--dashed):hover{background-color:var(--paykka-card-checkout-button-bg-color-hover, #3f33bb)}.paykka-card-checkout-button:not(.paykka-card-checkout-button--loading).paykka-card-checkout-button:not(.paykka-card-checkout-button--disabled).paykka-card-checkout-button:not(.paykka-card-checkout-button--dashed):active{background-color:var(--paykka-card-checkout-button-bg-color-active, #312498)}.paykka-card-checkout-button--loading{cursor:wait}.paykka-card-checkout-button--disabled{cursor:not-allowed;opacity:.5}.paykka-card-checkout-button--dashed{border:1px dashed #DFDFE5;color:#1f1f1f;background-color:transparent}.paykka-card-checkout-button__icon{display:flex;align-items:center;margin-right:12px}.paykka-card-checkout-loading-check{display:inline-flex;align-items:center;overflow:hidden;--circle-transition-time: .3s;--check-dashoffset: 50}.paykka-card-checkout-loading-check__circle{transition:stroke-dasharray var(--circle-transition-time) linear}.paykka-card-checkout-loading-check__circle--loading{animation:spin 1s infinite linear;transform-origin:center}.paykka-card-checkout-loading-check__check{stroke-dasharray:var(--check-dashoffset);stroke-dashoffset:var(--check-dashoffset);animation:tick .5s ease-out;animation-fill-mode:forwards;animation-delay:var(--circle-transition-time)}@keyframes tick{0%{stroke-dashoffset:var(--check-dashoffset)}to{stroke-dashoffset:0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.paykka-card-checkout-card{min-width:280px}.paykka-card-checkout-card__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__field{margin-bottom:20px}}.paykka-card-checkout-card__center{display:flex;justify-content:space-between}.paykka-card-checkout-card__center>div{width:calc((100% - 20px)/2);transition:width .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-card__center>div{width:calc((100% - 32px)/2)}}.paykka-card-checkout-card__card-info{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__card-info{margin-bottom:20px}}.paykka-card-checkout-card__holder-name{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__holder-name{margin-bottom:20px}}.paykka-card-checkout-card__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-card__button{margin-top:20px}}.paykka-card-checkout-card__card-brands{margin-top:8px}.paykka-card-checkout-card__card-number-wrapper{position:relative}.paykka-card-checkout-card__change-box{display:flex;align-items:center;color:#4f43df;font-size:14px;position:absolute;top:0;right:0;cursor:pointer}.paykka-card-checkout-card__card-selector-wrapper{display:flex;justify-content:space-between}.paykka-card-checkout-card__address{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__address{margin-bottom:20px}}.paykka-card-checkout-card__store-checkbox{margin-top:16px}@media (min-width: 480px){.paykka-card-checkout-card__store-checkbox{margin-top:20px}}.paykka-card-checkout-card-brands{display:flex;flex-wrap:wrap;gap:6px}.paykka-card-checkout-card-brands__more{line-height:32px;font-size:13px;color:#687282}.paykka-card-checkout-card-selector__action{padding:8px 12px}.paykka-card-checkout-card-selector__label{display:flex;align-items:center}.paykka-card-checkout-card-selector__card-no{margin-left:12px}.paykka-card-checkout-card-selector__change{display:flex;align-items:center;color:#4f43df;font-size:14px}.paykka-card-checkout-card-no__wrapper{display:flex;align-items:center}.paykka-card-checkout-card-no__dot{width:4px;height:4px;background:currentColor;margin-right:4px;border-radius:50%}.paykka-card-checkout-card-no__card-no{margin-left:4px}.paykka-card-checkout-check-box{display:inline-flex;align-items:center;font-size:14px;background-color:transparent;cursor:pointer}.paykka-card-checkout-check-box:hover .paykka-card-checkout-check-box__inner{border-color:#4f43df}.paykka-card-checkout-check-box--checked .paykka-card-checkout-check-box__inner{border-color:#4f43df;background-color:#4f43df}.paykka-card-checkout-check-box__inner{width:14px;height:14px;border:1px solid #E1E1E5;border-radius:2px;margin-right:8px;transition:border-color .2s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.paykka-card-checkout-modal{position:fixed;left:0;right:0;top:0;bottom:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center}.paykka-card-checkout-modal__mask{position:fixed;left:0;right:0;top:0;bottom:0;background-color:#0006}.paykka-card-checkout-modal__content{position:relative;z-index:9999;border-radius:8px;background-color:#fff;box-shadow:0 8px 16px -8px #00000014,0 12px 32px #0000000f,0 16px 48px 16px #0000000a;display:flex;flex-direction:column}.paykka-card-checkout-modal__close{cursor:pointer;right:0;position:absolute;transform:translateY(-150%);color:#d2d2d2}.paykka-card-checkout-modal__close:hover{color:#fff}.paykka-card-checkout-modal__body{flex:1;padding:36px 28px 24px}.paykka-card-checkout-three-ds-auth__content{height:100%}.paykka-card-checkout-three-ds-auth__last-three-ds{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.paykka-card-checkout-three-ds-auth__last-three-ds-title{margin-top:20px;margin-bottom:40px;color:#1f1f1f;font-size:20px;font-weight:700;text-align:center}.paykka-card-checkout-combined-card-info{width:100%;height:100%;display:flex}.paykka-card-checkout-combined-card-info__card-number{flex:1}.paykka-card-checkout-combined-card-info__expire-date{width:100px}.paykka-card-checkout-combined-card-info__cvv{width:60px}.paykka-card-checkout-combined-card-info__blank-icon{width:16px;height:16px}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__email{padding-bottom:20px}}.paykka-card-checkout-wechat-pay__error{margin-top:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__error{margin-top:20px}}.paykka-card-checkout-wechat-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__button{margin-top:20px}}.paykka-card-checkout-apple-pay__error{margin-bottom:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-apple-pay__error{margin-bottom:20px}}.paykka-card-checkout-apple-pay__button{width:100%;display:flex;align-items:center;justify-content:center;height:44px;--apple-pay-button-width: 100%;--apple-pay-button-height: 44px;--apple-pay-button-border-radius: 8px;--apple-pay-button-padding: 0px 0px;--apple-pay-button-box-sizing: border-box}.paykka-card-checkout-google-pay__error{margin-bottom:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-google-pay__error{margin-bottom:20px}}.paykka-card-checkout-sepa{min-width:280px}.paykka-card-checkout-sepa__field{margin-bottom:24px}.paykka-card-checkout-sepa__holder-name{padding-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-sepa__holder-name{padding-bottom:20px}}.paykka-card-checkout-sepa__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-sepa__button{margin-top:20px}}.paykka-card-checkout-payment-tabs{display:flex;flex-wrap:nowrap;justify-content:start;column-gap:6px}.paykka-card-checkout-payment-tabs__tab{border:2px solid #E1E1E5;padding:12px;border-radius:12px;width:calc((100% - 12px) / 3)}@media (min-width: 480px){.paykka-card-checkout-payment-tabs__tab{padding:16px}}.paykka-card-checkout-payment-tabs__name{color:#626266}::-webkit-scrollbar{height:6px;width:6px}::-webkit-scrollbar-thumb{background-color:#00000040;border-radius:4px}::-webkit-scrollbar-button{display:none!important}::-moz-scrollbar-button{display:none!important}.paykka-card-checkout-drop-in__header-payment{margin-bottom:10px}.paykka-card-checkout-drop-in__other{display:flex;justify-content:center;align-items:center;margin-top:14px}@media (min-width: 480px){.paykka-card-checkout-drop-in__other{margin-top:30px}}.paykka-card-checkout-drop-in__other-text{margin:0 14px;color:#6e6e7e}.paykka-card-checkout-drop-in__other-line{background-color:#dfdfe5;flex-grow:.5;height:1px}.paykka-card-checkout-drop-in__tabs-wrapper{margin-top:16px;margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-drop-in__tabs-wrapper{margin-top:24px;margin-bottom:24px}}
+.paykka-card-checkout,.paykka-card-checkout *{box-sizing:border-box}@media (min-width: 480px){.paykka-card-checkout-ali-pay__email{padding-bottom:20px}}.paykka-card-checkout-ali-pay__error{margin-top:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-ali-pay__error{margin-top:20px}}.paykka-card-checkout-ali-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-ali-pay__button{margin-top:20px}}.paykka-card-checkout-address-field__first-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-bottom-right-radius:0;border-bottom-left-radius:0}.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-radius:0;border-top:0}.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-address-field__mid-item .paykka-card-checkout-input__input-wrapper:focus{border-top:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper{padding:8px 0;border-top-right-radius:0;border-top-left-radius:0;border-top:0}.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-address-field__last-item .paykka-card-checkout-input__input-wrapper:focus{border-top:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-form-item{font-size:16px}.paykka-card-checkout-form-item__label{margin-bottom:8px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none}@media (min-width: 480px){.paykka-card-checkout-form-item__label{margin-bottom:10px}}.paykka-card-checkout-form-item__error-text{margin-top:4px;color:#f53f3f;font-size:14px}.paykka-card-checkout-input{position:relative;box-sizing:border-box;font-size:16px}.paykka-card-checkout-input__input-wrapper{display:flex;align-items:center;height:44px;width:100%;border-radius:8px;border:1px solid #E1E1E5;transition:border .2s cubic-bezier(.4,0,.2,1),box-shadow .2s cubic-bezier(.4,0,.2,1);caret-color:var(--paykka-card-checkout-input-color, #4F43DF) .paykka-card-checkout-input__input-wrapper --error;caret-color-border:1px solid #F53F3F}.paykka-card-checkout-input__input-wrapper:active,.paykka-card-checkout-input__input-wrapper--focus,.paykka-card-checkout-input__input-wrapper:focus{border:1px solid var(--paykka-card-checkout-input-color, #4F43DF);box-shadow:0 0 0 1px var(--paykka-card-checkout-input-color, #4F43DF)}.paykka-card-checkout-input__input-wrapper-disabled{cursor:not-allowed;background:#f5f5f7}.paykka-card-checkout-input__input-wrapper-disabled:active,.paykka-card-checkout-input__input-wrapper-disabled--focus,.paykka-card-checkout-input__input-wrapper-disabled:focus{border:1px solid #F5F5F7;box-shadow:0 0 0 2px #f5f5f7}.paykka-card-checkout-input__input{outline:none;border:none;height:100%;width:100%;border-radius:8px;caret-color:var(--paykka-card-checkout-input-color, #4F43DF);font-size:16px;padding-left:12px;background-color:transparent}.paykka-card-checkout-input__input::placeholder{color:#c2c2c2}.paykka-card-checkout-input__input:-webkit-autofill,.paykka-card-checkout-input__input:-internal-autofill-selected{background-color:transparent!important}.paykka-card-checkout-input__right-icon{padding-right:12px;display:flex;align-items:center;flex-shrink:0;margin-left:12px}.paykka-card-checkout-input__left-icon{padding-left:12px;display:flex;align-items:center;flex-shrink:0;margin-right:12px}.paykka-card-checkout-select__wrapper{width:100%;position:relative;cursor:pointer}.paykka-card-checkout-select__render-label{position:absolute;top:0;line-height:44px;height:44px;padding:0 16px;display:flex}.paykka-card-checkout-select__render-label--placeholder{color:#c2c2c2}.paykka-card-checkout-select__render-label--hidden{visibility:hidden}.paykka-card-checkout-select__menu{margin-top:4px;width:100%;max-height:260px;background:#fff;box-shadow:0 4px 14px #0000001a;border-radius:4px;border:1px solid #EBEBEF;overflow-y:auto;z-index:999;position:absolute}.paykka-card-checkout-select__menu-item{padding:6px 12px;line-height:32px;color:#626266;cursor:pointer;display:flex;justify-content:space-between}.paykka-card-checkout-select__menu-item:hover,.paykka-card-checkout-select__menu-item:active,.paykka-card-checkout-select__menu-item--selected,.paykka-card-checkout-select__menu-item:focus{color:#1f1f1f;background:#f3f3f5}.paykka-card-checkout-select__menu-item-icon{margin-left:10px;display:flex;align-items:center}.paykka-card-checkout-select__menu-no-data{height:200px;display:flex;justify-content:center;align-items:center;color:#c2c2c2}.paykka-card-checkout-info{display:flex;align-items:center;padding:10px 14px;border-radius:4px}.paykka-card-checkout-info--error{background-color:#ffece8}.paykka-card-checkout-info__icon{margin-right:8px;height:1.3em;display:flex;align-items:center}.paykka-card-checkout-info__content{text-align:justify;word-break:break-all}.paykka-card-checkout-recurring-tip{display:flex;color:#a9a9a9}.paykka-card-checkout-recurring-tip__icon{width:20px;display:flex;padding-top:4px;padding-right:4px}.paykka-card-checkout-submit-button--success{opacity:1!important;background-color:#00b42a!important}.paykka-card-checkout-submit-button__text{line-height:1}.paykka-card-checkout-submit-button__text--not-verified{color:#fff9}.paykka-card-checkout-button{display:flex;align-items:center;justify-content:center;width:100%;height:44px;padding:0 14px;border-radius:8px;border:0;background-color:var(--paykka-card-checkout-button-bg-color, #4F43DF);color:var(--paykka-card-checkout-button-text-color, #fff);font-size:16px;cursor:pointer;text-decoration:none;transition:background-color .3s cubic-bezier(.4,0,.2,1)}.paykka-card-checkout-button:not(.paykka-card-checkout-button--loading).paykka-card-checkout-button:not(.paykka-card-checkout-button--disabled).paykka-card-checkout-button:not(.paykka-card-checkout-button--dashed):hover{background-color:var(--paykka-card-checkout-button-bg-color-hover, #3f33bb)}.paykka-card-checkout-button:not(.paykka-card-checkout-button--loading).paykka-card-checkout-button:not(.paykka-card-checkout-button--disabled).paykka-card-checkout-button:not(.paykka-card-checkout-button--dashed):active{background-color:var(--paykka-card-checkout-button-bg-color-active, #312498)}.paykka-card-checkout-button--loading{cursor:wait}.paykka-card-checkout-button--disabled{cursor:not-allowed;opacity:.5}.paykka-card-checkout-button--dashed{border:1px dashed #DFDFE5;color:#1f1f1f;background-color:transparent}.paykka-card-checkout-button__icon{display:flex;align-items:center;margin-right:12px}.paykka-card-checkout-loading-check{display:inline-flex;align-items:center;overflow:hidden;--circle-transition-time: .3s;--check-dashoffset: 50}.paykka-card-checkout-loading-check__circle{transition:stroke-dasharray var(--circle-transition-time) linear}.paykka-card-checkout-loading-check__circle--loading{animation:spin 1s infinite linear;transform-origin:center}.paykka-card-checkout-loading-check__check{stroke-dasharray:var(--check-dashoffset);stroke-dashoffset:var(--check-dashoffset);animation:tick .5s ease-out;animation-fill-mode:forwards;animation-delay:var(--circle-transition-time)}@keyframes tick{0%{stroke-dashoffset:var(--check-dashoffset)}to{stroke-dashoffset:0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.paykka-card-checkout-card{min-width:280px}.paykka-card-checkout-card__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__field{margin-bottom:20px}}.paykka-card-checkout-card__center{display:flex;justify-content:space-between}.paykka-card-checkout-card__center>div{width:calc((100% - 20px)/2);transition:width .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-card__center>div{width:calc((100% - 32px)/2)}}.paykka-card-checkout-card__card-info{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__card-info{margin-bottom:20px}}.paykka-card-checkout-card__holder-name{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__holder-name{margin-bottom:20px}}.paykka-card-checkout-card__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-card__button{margin-top:20px}}.paykka-card-checkout-card__card-brands{margin-top:8px}.paykka-card-checkout-card__card-number-wrapper{position:relative}.paykka-card-checkout-card__change-box{display:flex;align-items:center;color:#4f43df;font-size:14px;position:absolute;top:0;right:0;cursor:pointer}.paykka-card-checkout-card__card-selector-wrapper{display:flex;justify-content:space-between}.paykka-card-checkout-card__address{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-card__address{margin-bottom:20px}}.paykka-card-checkout-card__store-checkbox{margin-top:16px}@media (min-width: 480px){.paykka-card-checkout-card__store-checkbox{margin-top:20px}}.paykka-card-checkout-card-brands{display:flex;flex-wrap:wrap;gap:6px}.paykka-card-checkout-card-brands__more{line-height:32px;font-size:13px;color:#687282}.paykka-card-checkout-card-selector__action{padding:8px 12px}.paykka-card-checkout-card-selector__label{display:flex;align-items:center}.paykka-card-checkout-card-selector__card-no{margin-left:12px}.paykka-card-checkout-card-selector__change{display:flex;align-items:center;color:#4f43df;font-size:14px}.paykka-card-checkout-card-no__wrapper{display:flex;align-items:center}.paykka-card-checkout-card-no__dot{width:4px;height:4px;background:currentColor;margin-right:4px;border-radius:50%}.paykka-card-checkout-card-no__card-no{margin-left:4px}.paykka-card-checkout-check-box{display:inline-flex;align-items:center;font-size:14px;background-color:transparent;cursor:pointer}.paykka-card-checkout-check-box:hover .paykka-card-checkout-check-box__inner{border-color:#4f43df}.paykka-card-checkout-check-box--checked .paykka-card-checkout-check-box__inner{border-color:#4f43df;background-color:#4f43df}.paykka-card-checkout-check-box__inner{width:14px;height:14px;border:1px solid #E1E1E5;border-radius:2px;margin-right:8px;transition:border-color .2s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.paykka-card-checkout-modal{position:fixed;left:0;right:0;top:0;bottom:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center}.paykka-card-checkout-modal__mask{position:fixed;left:0;right:0;top:0;bottom:0;background-color:#0006}.paykka-card-checkout-modal__content{position:relative;z-index:9999;border-radius:8px;background-color:#fff;box-shadow:0 8px 16px -8px #00000014,0 12px 32px #0000000f,0 16px 48px 16px #0000000a;display:flex;flex-direction:column}.paykka-card-checkout-modal__close{cursor:pointer;right:0;position:absolute;transform:translateY(-150%);color:#d2d2d2}.paykka-card-checkout-modal__close:hover{color:#fff}.paykka-card-checkout-modal__body{flex:1;padding:36px 28px 24px}.paykka-card-checkout-three-ds-auth__content{height:100%}.paykka-card-checkout-three-ds-auth__last-three-ds{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}.paykka-card-checkout-three-ds-auth__last-three-ds-title{margin-top:20px;margin-bottom:40px;color:#1f1f1f;font-size:20px;font-weight:700;text-align:center}.paykka-card-checkout-combined-card-info{width:100%;height:100%;display:flex}.paykka-card-checkout-combined-card-info__card-number{flex:1}.paykka-card-checkout-combined-card-info__expire-date{width:100px}.paykka-card-checkout-combined-card-info__cvv{width:60px}.paykka-card-checkout-combined-card-info__blank-icon{width:16px;height:16px}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__email{padding-bottom:20px}}.paykka-card-checkout-wechat-pay__error{margin-top:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__error{margin-top:20px}}.paykka-card-checkout-wechat-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-wechat-pay__button{margin-top:20px}}.paykka-card-checkout-apple-pay__error{margin-bottom:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-apple-pay__error{margin-bottom:20px}}.paykka-card-checkout-apple-pay__button{width:100%;display:flex;align-items:center;justify-content:center;height:44px;--apple-pay-button-width: 100%;--apple-pay-button-height: 44px;--apple-pay-button-border-radius: 8px;--apple-pay-button-padding: 0px 0px;--apple-pay-button-box-sizing: border-box}.paykka-card-checkout-google-pay__error{margin-bottom:16px;transition:margin-bottom .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-google-pay__error{margin-bottom:20px}}.paykka-card-checkout-sepa{min-width:280px}.paykka-card-checkout-sepa__field{margin-bottom:24px}.paykka-card-checkout-sepa__holder-name{padding-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-sepa__holder-name{padding-bottom:20px}}.paykka-card-checkout-sepa__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-sepa__button{margin-top:20px}}.paykka-card-checkout-boost{min-width:280px}.paykka-card-checkout-boost__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-boost__field{margin-bottom:20px}}.paykka-card-checkout-boost__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-boost__button{margin-top:20px}}.paykka-card-checkout-guide-card{border:1px solid #E1E1E5;border-radius:12px;padding:14px;margin-bottom:24px}@media (min-width: 480px){.paykka-card-checkout-guide-card{padding:16px;margin-bottom:32px}}.paykka-card-checkout-guide-card__content{display:flex;align-items:center}.paykka-card-checkout-guide-card__icon{margin-left:6px}.paykka-card-checkout-guide-card__description{color:#a3a3a7;font-size:14px;margin-left:12px}.paykka-card-checkout-nine-pay{min-width:280px}.paykka-card-checkout-nine-pay__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-nine-pay__field{margin-bottom:20px}}.paykka-card-checkout-nine-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-nine-pay__button{margin-top:20px}}.paykka-card-checkout-line-pay{min-width:280px}.paykka-card-checkout-line-pay__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-line-pay__field{margin-bottom:20px}}.paykka-card-checkout-line-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-line-pay__button{margin-top:20px}}.paykka-card-checkout-tng-wallet{min-width:280px}.paykka-card-checkout-tng-wallet__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-tng-wallet__field{margin-bottom:20px}}.paykka-card-checkout-tng-wallet__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-tng-wallet__button{margin-top:20px}}.paykka-card-checkout-may-bank-qr-pay{min-width:280px}.paykka-card-checkout-may-bank-qr-pay__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-may-bank-qr-pay__field{margin-bottom:20px}}.paykka-card-checkout-may-bank-qr-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-may-bank-qr-pay__button{margin-top:20px}}.paykka-card-checkout-shopee-pay{min-width:280px}.paykka-card-checkout-shopee-pay__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-shopee-pay__field{margin-bottom:20px}}.paykka-card-checkout-shopee-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-shopee-pay__button{margin-top:20px}}.paykka-card-checkout-grab-pay{min-width:280px}.paykka-card-checkout-grab-pay__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-grab-pay__field{margin-bottom:20px}}.paykka-card-checkout-grab-pay__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-grab-pay__button{margin-top:20px}}.paykka-card-checkout-qr-code-modal{padding-top:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}.paykka-card-checkout-qr-code-modal__container{width:208px}.paykka-card-checkout-qr-code-modal__title{font-size:18px;font-weight:550;text-align:center}.paykka-card-checkout-qr-code-modal__body{margin:20px 0;padding:16px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center}.paykka-card-checkout-qr-code-modal__icon{height:22px}.paykka-card-checkout-qr-code-modal__qr-code{margin-top:16px;width:176px;height:176px;border-radius:4px;background-color:#fff;overflow:hidden}.paykka-card-checkout-qr-code-modal__expired-time{margin-top:16px;color:#fff;font-size:14px;text-align:center}.paykka-card-checkout-qr-code-modal__expired-time-text{color:#fff;font-size:14px;text-align:center}.paykka-card-checkout-qr-code-modal__amount{font-size:22px;color:#1f1f1f;font-weight:550}.paykka-card-checkout-gcash{min-width:280px}.paykka-card-checkout-gcash__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-gcash__field{margin-bottom:20px}}.paykka-card-checkout-gcash__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-gcash__button{margin-top:20px}}.paykka-card-checkout-paymaya{min-width:280px}.paykka-card-checkout-paymaya__field{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-paymaya__field{margin-bottom:20px}}.paykka-card-checkout-paymaya__button{margin-top:16px;transition:margin-top .1s cubic-bezier(.4,0,.2,1)}@media (min-width: 480px){.paykka-card-checkout-paymaya__button{margin-top:20px}}.paykka-card-checkout-payment-tabs{display:flex;flex-wrap:nowrap;justify-content:flex-start;column-gap:6px}.paykka-card-checkout-payment-tabs__tab{border:2px solid #E1E1E5;padding:12px;border-radius:12px;width:calc((100% - 12px) / 3)}@media (min-width: 480px){.paykka-card-checkout-payment-tabs__tab{padding:16px}}.paykka-card-checkout-payment-tabs__name{color:#626266}.paykka-card-checkout-drop-in__header-payment{margin-bottom:10px}.paykka-card-checkout-drop-in__other{display:flex;justify-content:center;align-items:center;margin-top:14px;margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-drop-in__other{margin-top:30px;margin-bottom:24px}}.paykka-card-checkout-drop-in__accordion-icon{display:flex;align-items:center}.paykka-card-checkout-drop-in__other-text{margin:0 14px;color:#6e6e7e}.paykka-card-checkout-drop-in__other-line{background-color:#dfdfe5;flex-grow:.5;height:1px}.paykka-card-checkout-drop-in__tabs-wrapper{margin-bottom:16px}@media (min-width: 480px){.paykka-card-checkout-drop-in__tabs-wrapper{margin-bottom:24px}}.paykka-card-checkout-drop-in__accordion-icon{margin-right:10px}::-webkit-scrollbar{height:6px;width:6px}::-webkit-scrollbar-thumb{background-color:#00000040;border-radius:4px}::-webkit-scrollbar-button{display:none!important}::-moz-scrollbar-button{display:none!important}.paykka-card-checkout-accordion-item{border:1px solid #E1E1E5;border-radius:8px;margin-bottom:10px;padding:0 16px;transition:all .3s linear}@media (min-width: 480px){.paykka-card-checkout-accordion-item{padding:0 14px}}.paykka-card-checkout-accordion-item--disabled{cursor:not-allowed;opacity:.4}.paykka-card-checkout-accordion-item__header{cursor:pointer;display:flex;align-items:center;padding-top:14px;padding-bottom:16px;font-size:14px;line-height:20px;transition:all .3s linear}@media (min-width: 480px){.paykka-card-checkout-accordion-item__header{padding-top:16px;padding-bottom:16px;font-size:16px;line-height:22px}}.paykka-card-checkout-accordion-item__title{font-size:16px;line-height:22px;color:#626266}.paykka-card-checkout-accordion-item__title--active{color:#4f43df}.paykka-card-checkout-accordion-item__content{max-height:0;opacity:0;overflow:hidden}.paykka-card-checkout-accordion-item__content--active{opacity:1;padding-bottom:14px}@media (min-width: 480px){.paykka-card-checkout-accordion-item__content--active{padding-bottom:16px}}

package/dist/types/api/http.d.ts

@@ -6,15 +6,9 @@ export interface RequestOptions {
 export declare enum EHttpCode {
     INTERNAL_SERVER_ERROR = "500"
 }
-export declare function request(method: 'get' | 'post', url: string, params?: Recordable, { timeout, headers, locale }?: RequestOptions): Promise<any>;
-declare function get<T = any>(url: string, params?: Recordable, options?: RequestOptions): Promise<T>;
-declare function post<T = any>(url: string, params?: Recordable, options?: RequestOptions): Promise<T>;
+export declare const request: <T = any, P = any>(method: 'get' | 'post', url: string, params?: P, { timeout, headers, locale }?: RequestOptions) => Promise<T>;
 export declare const http: {
-    get: typeof get;
-    post: typeof post;
+    get: <T = any, P = any>(url: string, params?: P, options?: RequestOptions) => Promise<T>;
+    post: <T_1 = any, P_1 = any>(url: string, params?: P_1 | undefined, options?: RequestOptions) => Promise<T_1>;
 };
-export declare class TimeoutError extends Error {
-    constructor(message: string);
-}
-export declare function isTimeoutError(error: any): boolean;
-export {};
+export declare const isTimeoutError: (error: any) => boolean;

package/dist/types/api/modules/ali-pay/index.d.ts

@@ -1,3 +1,4 @@
+import type { PayKKaCheckout } from '../../../core';
 import { type RequestOptions } from '../../http';
 export declare function aliPay({ sessionId, clientKey, bill }: {
     sessionId: string;
@@ -12,7 +13,7 @@ export declare function aliPay({ sessionId, clientKey, bill }: {
         address1?: string | null;
         address2?: string | null;
     };
-}, options?: RequestOptions): Promise<import("..").PayRes>;
+}, core: PayKKaCheckout, options?: RequestOptions): Promise<import("..").PayRes>;
 export declare function getAliPayInfo({ sessionId, clientKey }: {
     sessionId: string;
     clientKey?: string;

package/dist/types/api/modules/apple-pay/index.d.ts

@@ -1,3 +1,4 @@
+import type { PayKKaCheckout } from '../../../core';
 import { type RequestOptions } from '../../http';
 import type { PayBill } from '../type';
 export declare function getMerchantSession(options?: RequestOptions): Promise<any>;
@@ -7,7 +8,7 @@ export declare function applePay({ sessionId, clientKey, token, bill, browser }:
     token: string;
     bill: PayBill;
     browser: Recordable;
-}, options?: RequestOptions): Promise<import("../type").PayRes>;
+}, core: PayKKaCheckout, options?: RequestOptions): Promise<import("../type").PayRes>;
 export declare function getApplePayInfo({ sessionId, clientKey }: {
     sessionId: string;
     clientKey?: string;

package/dist/types/api/modules/boost/index.d.ts

@@ -0,0 +1,24 @@
+import type { PayKKaCheckout } from '../../../core';
+import { type RequestOptions } from '../../http';
+export declare const boostPay: ({ sessionId, clientKey, payment, bill, browser }: {
+    sessionId: string;
+    clientKey?: string;
+    payment: {
+        paymentMethod: string;
+    };
+    bill: {
+        email: string;
+        country?: string | null;
+        province?: string | null;
+        city?: string | null;
+        area?: string | null;
+        postCode?: string | null;
+        address1?: string | null;
+        address2?: string | null;
+    };
+    browser: Recordable;
+}, core: PayKKaCheckout, options?: RequestOptions) => Promise<import("..").PayRes>;
+export declare const getBoostPayInfo: ({ sessionId, clientKey }: {
+    sessionId: string;
+    clientKey?: string;
+}, options?: RequestOptions) => Promise<import("..").PayRes>;

package/dist/types/api/modules/card/index.d.ts

@@ -24,7 +24,7 @@ export declare function cardPay({ sessionId, clientKey, payment, bill, browser }
         address2?: string | null;
     };
     browser: Recordable;
-}, options?: RequestOptions): Promise<import("..").PayRes>;
+}, extraParams?: Recordable, options?: RequestOptions): Promise<import("..").PayRes>;
 export declare function getCardPayInfo({ sessionId, clientKey }: {
     sessionId: string;
     clientKey?: string;

package/dist/types/api/modules/checkout/index.d.ts

@@ -2,5 +2,5 @@ import { type RequestOptions } from '../../http';
 import type { CheckoutRes, QueryCheckoutParams } from './type';
 export * from './type';
 export * from './map';
-export declare function getCheckoutInfo({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions): Promise<CheckoutRes>;
-export declare function onceGetCheckoutInfo({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions): Promise<CheckoutRes>;
+export declare const getCheckoutInfo: ({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions) => Promise<CheckoutRes>;
+export declare const onceGetCheckoutInfo: ({ sessionId, clientKey }: QueryCheckoutParams, options?: RequestOptions) => Promise<CheckoutRes>;

package/dist/types/api/modules/checkout/type.d.ts

@@ -36,9 +36,18 @@ export interface CardTokenInfo {
     last4: string;
     billingAddressFilled: boolean;
 }
+export interface WalletChannelParams {
+    neededToCompute?: boolean;
+    fee?: Amount;
+    totalAmount?: Amount;
+    percentageFee?: number;
+    transactionFee?: number;
+}
 export interface ChannelParams {
     applePay?: ChannelApplePay;
     googlePay?: ChannelGooglePay;
+    wechatPay?: WalletChannelParams;
+    aliPay?: WalletChannelParams;
 }
 export interface CheckoutRes {
     merchantId: string;

package/dist/types/api/modules/gcash/index.d.ts

@@ -0,0 +1,24 @@
+import type { PayKKaCheckout } from '../../../core';
+import { type RequestOptions } from '../../http';
+export declare const gcashPay: ({ sessionId, clientKey, payment, bill, browser }: {
+    sessionId: string;
+    clientKey?: string;
+    payment: {
+        paymentMethod: string;
+    };
+    bill: {
+        email: string;
+        country?: string | null;
+        province?: string | null;
+        city?: string | null;
+        area?: string | null;
+        postCode?: string | null;
+        address1?: string | null;
+        address2?: string | null;
+    };
+    browser: Recordable;
+}, core: PayKKaCheckout, options?: RequestOptions) => Promise<import("..").PayRes>;
+export declare const getGcashPayInfo: ({ sessionId, clientKey }: {
+    sessionId: string;
+    clientKey?: string;
+}, options?: RequestOptions) => Promise<import("..").PayRes>;

package/dist/types/api/modules/get-browser-params.d.ts

@@ -1,6 +1,6 @@
-export declare function getBrowserParams(params?: {
+export declare const getBrowserParams: (params?: {
     fraudDetectionId?: string;
-}): Promise<{
+}) => Promise<{
     user_agent: string;
     color_depth: number;
     language: string;

package/dist/types/api/modules/google-pay/index.d.ts

@@ -1,3 +1,4 @@
+import type { PayKKaCheckout } from '../../../core';
 import { type RequestOptions } from '../../http';
 import type { PayBill } from '../type';
 export declare function googlePay({ sessionId, clientKey, token, bill, browser }: {
@@ -6,7 +7,7 @@ export declare function googlePay({ sessionId, clientKey, token, bill, browser }
     token: string;
     bill: PayBill;
     browser: Recordable;
-}, options?: RequestOptions): Promise<import("../type").PayRes>;
+}, core: PayKKaCheckout, options?: RequestOptions): Promise<import("../type").PayRes>;
 export declare function getGooglePayInfo({ sessionId, clientKey }: {
     sessionId: string;
     clientKey?: string;