@paykka/card-checkout-ui 0.5.17 → 0.7.0

package/dist/es/components/SecuredFieldsProvider/SecuredFieldsProvider.js

@@ -1,222 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-import { w, A, F, y, q, u } from "../../core.js";
-import { SessionMode } from "../../constant.js";
-import { cdnUrl, cdnOrigin, apiUrl } from "../../config.js";
-import { safeParse } from "../../utils/index.js";
-var FieldType = /* @__PURE__ */ ((FieldType2) => {
-  FieldType2["CARD_NUMBER"] = "CARD_NUMBER";
-  FieldType2["CVV"] = "CVV";
-  FieldType2["EXPIRE_DATE"] = "EXPIRE_DATE";
-  return FieldType2;
-})(FieldType || {});
-var MessageAction = /* @__PURE__ */ ((MessageAction2) => {
-  MessageAction2["INIT"] = "init";
-  MessageAction2["FOCUS"] = "focus";
-  MessageAction2["BIN_VALUE"] = "binValue";
-  MessageAction2["VALID_WITH_VALUE"] = "validWithValue";
-  MessageAction2["PAYMENT"] = "payment";
-  MessageAction2["AFTER_PAYMENT"] = "afterPayment";
-  MessageAction2["PAYMENT_ERROR"] = "paymentError";
-  MessageAction2["PAYMENT_TIMEOUT"] = "paymentTimeout";
-  MessageAction2["VALID_STATUS_CHANGED"] = "validStatusChanged";
-  return MessageAction2;
-})(MessageAction || {});
-const SECURED_FILED_ATTR = "data-sf";
-const SECURED_IFRAME_CLASS_NAME = "secured-iframe";
-const HIDDEN_IFRAME_NAME = "hidden-pay-iframe";
-const getFieldElements = (rootNode) => {
-  return rootNode ? Array.prototype.slice.call(rootNode.querySelectorAll(`[${SECURED_FILED_ATTR}]`)) : [];
-};
-const createIframe = (src) => {
-  const iframeEl = document.createElement("iframe");
-  iframeEl.setAttribute("src", src);
-  iframeEl.classList.add(SECURED_IFRAME_CLASS_NAME);
-  iframeEl.setAttribute("allowtransparency", "true");
-  iframeEl.setAttribute("referrerpolicy", "origin");
-  Object.defineProperty(iframeEl, "src", { configurable: false, writable: false });
-  const noIframeElContent = document.createTextNode("<p>Your browser does not support iframes.</p>");
-  iframeEl.appendChild(noIframeElContent);
-  return iframeEl;
-};
-const postMessageToIframe = (data, iframe, targetOrigin = "*") => {
-  if (!iframe) {
-    return;
-  }
-  const dataStr = JSON.stringify(data);
-  iframe.postMessage(dataStr, { targetOrigin });
-};
-class SecuredField {
-  constructor(config) {
-    __publicField(this, "iframe");
-    __publicField(this, "iframeWindow");
-    __publicField(this, "hiddenIframe");
-    __publicField(this, "config");
-    this.config = config;
-    this.init();
-  }
-  /** 初始化表单区域iframe */
-  init() {
-    const { iframeSrc, iframeClassName, fieldNode } = this.config;
-    const iframeEl = createIframe(iframeSrc);
-    iframeEl.width = "100%";
-    iframeEl.height = "100%";
-    iframeEl.style.border = "none";
-    fieldNode.appendChild(iframeEl);
-    const iframe = fieldNode.querySelector(`.${iframeClassName}`);
-    if (!iframe) {
-      return;
-    }
-    this.iframe = iframe;
-    iframe.addEventListener("load", () => this.onFieldIframeLoad());
-  }
-  /** 表单区域iframe加载回调 */
-  onFieldIframeLoad() {
-    this.iframeWindow = this.iframe.contentWindow;
-    const { fieldType, placeholder, style, hiddenIframeName, supportedCardBrands } = this.config;
-    const data = {
-      action: MessageAction.INIT,
-      config: {
-        fieldType,
-        placeholder,
-        style,
-        hiddenIframeName,
-        supportedCardBrands
-      },
-      hidden: false,
-      cdnUrl
-    };
-    postMessageToIframe(data, this.iframeWindow, cdnOrigin);
-  }
-}
-const SecuredFieldsProvider = w((props, ref) => {
-  const { sessionMode, i18n } = props;
-  const rootNodeRef = A(null);
-  const hiddenIframe = A(null);
-  const payment = (formData) => {
-    const data = {
-      action: MessageAction.PAYMENT,
-      formData,
-      locale: props.i18n.locale
-    };
-    postMessageToIframe(data, hiddenIframe.current.contentWindow, cdnOrigin);
-  };
-  F(ref, () => ({
-    payment,
-    reload: () => {
-      if (sessionMode !== SessionMode.EMBEDDED) {
-        return;
-      }
-      window.removeEventListener("message", onReceiveMessage);
-      if (hiddenIframe.current) {
-        document.body.removeChild(hiddenIframe.current);
-      }
-      init();
-    }
-  }));
-  if (sessionMode !== SessionMode.EMBEDDED) {
-    return props.children;
-  }
-  let fieldNodes = [];
-  const securedFieldPlaceholderMap = {
-    [FieldType.CARD_NUMBER]: i18n.get("card.cardNumber.placeholder"),
-    [FieldType.CVV]: i18n.get("card.cardSecurityCode.placeholder"),
-    [FieldType.EXPIRE_DATE]: i18n.get("card.cardExpireDate.placeholder")
-  };
-  y(() => {
-    init();
-  }, []);
-  const init = async () => {
-    fieldNodes = getFieldElements(rootNodeRef.current);
-    if (!fieldNodes.length) {
-      return;
-    }
-    await initHiddenIframe();
-    initAllFieldIframe();
-    window.addEventListener("message", onReceiveMessage);
-  };
-  const initHiddenIframe = async () => {
-    const iframeEl = createIframe(`${cdnUrl}/secured-iframe.html`);
-    iframeEl.name = `${HIDDEN_IFRAME_NAME}-${Date.now()}`;
-    iframeEl.width = "0";
-    iframeEl.height = "0";
-    iframeEl.style.border = "none";
-    hiddenIframe.current = iframeEl;
-    const data = {
-      action: MessageAction.INIT,
-      hidden: true,
-      apiUrl,
-      cdnUrl
-    };
-    iframeEl.addEventListener("load", () => {
-      postMessageToIframe(data, hiddenIframe.current.contentWindow, cdnOrigin);
-    });
-    window.document.body.appendChild(iframeEl);
-  };
-  const initAllFieldIframe = () => {
-    fieldNodes.forEach((fieldNode) => {
-      const fieldType = fieldNode.getAttribute(SECURED_FILED_ATTR);
-      new SecuredField({
-        fieldNode,
-        hiddenIframe: hiddenIframe.current,
-        hiddenIframeName: hiddenIframe.current.name,
-        rootNode: rootNodeRef.current,
-        iframeSrc: `${cdnUrl}/secured-iframe.html`,
-        iframeClassName: SECURED_IFRAME_CLASS_NAME,
-        fieldType,
-        placeholder: securedFieldPlaceholderMap[fieldType],
-        style: {
-          paddingLeft: "12px"
-        },
-        supportedCardBrands: props.supportedCardBrands,
-        onFocus: props.onFocus,
-        onBinValue: props.onBinValue,
-        onAfterPayment: props.onAfterPayment,
-        onPaymentError: props.onPaymentError,
-        onPaymentTimeout: props.onPaymentTimeout,
-        onValidStatusChanged: props.onValidStatusChanged
-      });
-    });
-  };
-  const onReceiveMessage = q((event) => {
-    const { data, origin } = event;
-    if (origin !== cdnOrigin) {
-      return;
-    }
-    const feedbackData = safeParse(data);
-    if (!Reflect.has(feedbackData, "action")) {
-      return;
-    }
-    switch (feedbackData.action) {
-      case MessageAction.FOCUS:
-        props.onFocus(feedbackData);
-        break;
-      case MessageAction.BIN_VALUE:
-        props.onBinValue(feedbackData);
-        break;
-      case MessageAction.AFTER_PAYMENT:
-        props.onAfterPayment(feedbackData);
-        break;
-      case MessageAction.PAYMENT_ERROR:
-        props.onPaymentError(feedbackData);
-        break;
-      case MessageAction.PAYMENT_TIMEOUT:
-        props.onPaymentTimeout(feedbackData);
-        break;
-      case MessageAction.VALID_STATUS_CHANGED:
-        props.onValidStatusChanged(feedbackData);
-        break;
-    }
-  }, []);
-  return /* @__PURE__ */ u("div", { ref: rootNodeRef, children: props.children });
-});
-export {
-  FieldType,
-  MessageAction,
-  SecuredFieldsProvider,
-  postMessageToIframe
-};

package/dist/es/out/radar.js

@@ -1,123 +0,0 @@
-var __accessCheck = (obj, member, msg) => {
-  if (!member.has(obj))
-    throw TypeError("Cannot " + msg);
-};
-var __privateGet = (obj, member, getter) => {
-  __accessCheck(obj, member, "read from private field");
-  return getter ? getter.call(obj) : member.get(obj);
-};
-var __privateAdd = (obj, member, value) => {
-  if (member.has(obj))
-    throw TypeError("Cannot add the same private member more than once");
-  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-};
-var __privateSet = (obj, member, value, setter) => {
-  __accessCheck(obj, member, "write to private field");
-  setter ? setter.call(obj, value) : member.set(obj, value);
-  return value;
-};
-var __privateMethod = (obj, member, method) => {
-  __accessCheck(obj, member, "access private method");
-  return method;
-};
-var _PayKKaRadar, _collMap, _p, _realMode, _keyMap, _transferRes, transferRes_fn, _stripeRadarColl, stripeRadarColl_fn;
-import { ECollMode } from "../types/radar.js";
-var define_import_meta_env_default = { VITE_API_URL: "https://checkout.aq.paykka.com", VITE_CDN_ORIGIN: "https://checkout.aq.paykka.com", VITE_CDN_DIR: "/cp", BASE_URL: "/", MODE: "production", DEV: false, PROD: true, SSR: false };
-const stripeKeyMap = {
-  eu: "pk_live_51QSXl2G2tOepMLcRVNu0S2T6MxyB1AIgCP5g7qMQvAviQS37v0wkPhJRKqfcbTql6ZkCkGktux4ixfXuZtFy6ZpP00awbGlLEq",
-  hk: "pk_live_51QSXh9Azq7GQL5iqwZNLz3KJ896MIUnai4H7H0z9DtlklJkgoH1VAlHKy382vWPqDm80nTy8MKUdJIKs0fFbTlKx006WcKWEDu",
-  us: define_import_meta_env_default.VITE_STRIPE_KEY
-};
-const DEFAULT_ENV = "eu";
-let instance = null;
-function getPayKKaRadarInstance(env, mode) {
-  if (!instance) {
-    instance = new PayKKaRadar(env, mode);
-  }
-  return instance;
-}
-class PayKKaRadar {
-  constructor(env = DEFAULT_ENV, mode = [ECollMode.STRIPE_RADAR]) {
-    /** 获取 stripe 返回的 radar session id，组件直接调，有没有返回值都直接调，传给后端 */
-    __privateAdd(this, _transferRes);
-    __privateAdd(this, _stripeRadarColl);
-    __privateAdd(this, _PayKKaRadar, { s: "" });
-    __privateAdd(this, _collMap, {
-      [ECollMode.STRIPE_RADAR]: () => __privateMethod(this, _stripeRadarColl, stripeRadarColl_fn).call(this)
-    });
-    __privateAdd(this, _p, void 0);
-    __privateAdd(this, _realMode, []);
-    __privateAdd(this, _keyMap, {
-      [ECollMode.STRIPE_RADAR]: ""
-    });
-    __privateSet(this, _realMode, mode);
-    if (mode.includes(ECollMode.STRIPE_RADAR)) {
-      if (typeof env === "string") {
-        __privateGet(this, _keyMap)[ECollMode.STRIPE_RADAR] = stripeKeyMap[env];
-      } else {
-        __privateGet(this, _keyMap)[ECollMode.STRIPE_RADAR] = env[ECollMode.STRIPE_RADAR];
-      }
-    }
-  }
-  get radarId() {
-    return __privateMethod(this, _transferRes, transferRes_fn).call(this);
-  }
-  /** 创建获取 radar session id 的 promise，缓存单例 */
-  async createPayKKaRadar() {
-    if (!__privateGet(this, _p)) {
-      __privateSet(this, _p, Promise.all(
-        __privateGet(this, _realMode).map(async (item) => {
-          if (__privateGet(this, _collMap)[item]) {
-            return await __privateGet(this, _collMap)[item]();
-          } else {
-            throw new Error(`Unsupported collection mode: ${item}`);
-          }
-        })
-      ));
-    }
-    await __privateGet(this, _p);
-  }
-}
-_PayKKaRadar = new WeakMap();
-_collMap = new WeakMap();
-_p = new WeakMap();
-_realMode = new WeakMap();
-_keyMap = new WeakMap();
-_transferRes = new WeakSet();
-transferRes_fn = function() {
-  try {
-    const s = JSON.stringify(__privateGet(this, _PayKKaRadar));
-    return btoa(s);
-  } catch (error) {
-    console.log("[PayKKa Checkout Session SDK]:", error);
-    return "";
-  }
-};
-_stripeRadarColl = new WeakSet();
-stripeRadarColl_fn = function() {
-  return new Promise((resolve, reject) => {
-    const script = document.createElement("script");
-    script.type = "text/javascript";
-    script.src = "https://js.stripe.com/v3/";
-    script.async = true;
-    script.onload = async () => {
-      const stripe = window.Stripe(__privateGet(this, _keyMap)[ECollMode.STRIPE_RADAR]);
-      const { radarSession, error } = await stripe.createRadarSession();
-      if (error) {
-        console.error(error);
-        reject(error);
-      } else {
-        __privateGet(this, _PayKKaRadar).s = radarSession == null ? void 0 : radarSession.id;
-        resolve(radarSession);
-      }
-    };
-    script.onerror = function() {
-      reject();
-    };
-    script.crossOrigin = "";
-    document.getElementsByTagName("head")[0].appendChild(script);
-  });
-};
-export {
-  getPayKKaRadarInstance
-};

package/dist/types/out/radar.d.ts

@@ -1,14 +0,0 @@
-import { type CollModeType, type envType } from '../types';
-export default function getPayKKaRadarInstance(env?: envType | {
-    [k in CollModeType]?: string;
-}, mode?: CollModeType[]): PayKKaRadar;
-declare class PayKKaRadar {
-    #private;
-    constructor(env?: envType | {
-        [k in CollModeType]?: string;
-    }, mode?: CollModeType[]);
-    get radarId(): string;
-    /** 创建获取 radar session id 的 promise，缓存单例 */
-    createPayKKaRadar(): Promise<void>;
-}
-export {};