@mirai/core 0.3.133 → 0.3.135-patch

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/FormPaycomet.l10n.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.L10N = void 0;
+const L10N = exports.L10N = {
+  ACTION_PAY: {
+    id: 'payments.action.pay'
+  },
+  LABEL_CARD_NAME: {
+    id: 'payments.label.card_name'
+  },
+  LABEL_CARD_NUMBER_PLACEHOLDER: {
+    id: 'payments.label.card_number_placeholder'
+  },
+  LABEL_CARD_NUMBER: {
+    id: 'payments.label.card_number'
+  },
+  LABEL_CVV: {
+    id: 'payments.label.cvv'
+  },
+  LABEL_EXPIRATION: {
+    id: 'payments.label.expiration'
+  },
+  LABEL_SECURE_PAGE: {
+    id: 'payments.label.secure_page'
+  }
+};
+//# sourceMappingURL=FormPaycomet.l10n.js.map

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/FormPaycomet.l10n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormPaycomet.l10n.js","names":["L10N","exports","ACTION_PAY","id","LABEL_CARD_NAME","LABEL_CARD_NUMBER_PLACEHOLDER","LABEL_CARD_NUMBER","LABEL_CVV","LABEL_EXPIRATION","LABEL_SECURE_PAGE"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormPaycomet/FormPaycomet.l10n.js"],"sourcesContent":["export const L10N = {\n  ACTION_PAY: { id: 'payments.action.pay' },\n  LABEL_CARD_NAME: { id: 'payments.label.card_name' },\n  LABEL_CARD_NUMBER_PLACEHOLDER: { id: 'payments.label.card_number_placeholder' },\n  LABEL_CARD_NUMBER: { id: 'payments.label.card_number' },\n  LABEL_CVV: { id: 'payments.label.cvv' },\n  LABEL_EXPIRATION: { id: 'payments.label.expiration' },\n  LABEL_SECURE_PAGE: { id: 'payments.label.secure_page' },\n};\n"],"mappings":";;;;;;AAAO,MAAMA,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG;EAClBE,UAAU,EAAE;IAAEC,EAAE,EAAE;EAAsB,CAAC;EACzCC,eAAe,EAAE;IAAED,EAAE,EAAE;EAA2B,CAAC;EACnDE,6BAA6B,EAAE;IAAEF,EAAE,EAAE;EAAyC,CAAC;EAC/EG,iBAAiB,EAAE;IAAEH,EAAE,EAAE;EAA6B,CAAC;EACvDI,SAAS,EAAE;IAAEJ,EAAE,EAAE;EAAqB,CAAC;EACvCK,gBAAgB,EAAE;IAAEL,EAAE,EAAE;EAA4B,CAAC;EACrDM,iBAAiB,EAAE;IAAEN,EAAE,EAAE;EAA6B;AACxD,CAAC"}

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/FormPaycomet.module.css

@@ -0,0 +1,26 @@
+.error {
+  margin-top: var(--mirai-ui-space-M);
+}
+
+.inputCVV {
+  margin-left: var(--mirai-ui-space-M);
+}
+
+.inputExpire {
+  border: 0;
+  color: inherit;
+  font-family: inherit;
+  font-size: inherit;
+  outline: 0;
+  width: 22px;
+}
+
+.inputName {
+  border: 0;
+  box-sizing: content-box;
+  color: var(--mirai-ui-input-color);
+  font-family: var(--mirai-ui-input-font);
+  font-size: var(--mirai-ui-input-font-size);
+  height: calc(var(--mirai-ui-input-min-height) - var(--mirai-ui-space-S)) !important;
+  outline: 0;
+}

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/__tests__/__snapshots__/FormPaycomet.test.js.snap

@@ -0,0 +1,148 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component:<FormCheckout> renders 1`] = `
+<DocumentFragment>
+  <div
+    class="view"
+  >
+    <span
+      class="text action"
+    >
+      payments.label.secure_page
+    </span>
+    <form
+      action="javascript:void(0)"
+      id="paycometPaymentForm"
+    >
+      <input
+        name="amount"
+        type="hidden"
+        value="1025"
+      />
+      <input
+        data-paycomet="jetID"
+        type="hidden"
+        value=""
+      />
+      <input
+        id="paytpvToken"
+        name="paytpvToken"
+        type="hidden"
+        value=""
+      />
+      <div
+        class="view"
+      >
+        <div
+          class="view"
+        >
+          <span
+            class="text small"
+          >
+            payments.label.card_name
+          </span>
+          <input
+            data-paycomet="cardHolderName"
+          />
+        </div>
+      </div>
+      <div
+        class="view"
+      >
+        <div
+          class="view"
+        >
+          <span
+            class="text small"
+          >
+            payments.label.card_number
+          </span>
+          <div
+            id="paycomet-pan"
+          />
+          <input
+            paycomet-name="pan"
+            paycomet-placeholder="payments.label.card_number_placeholder"
+            paycomet-style="border:0px;background-image:none;color:undefined;font-family:undefined;font-size:undefined;height:undefined;outline: 0;padding:0!important;"
+          />
+        </div>
+      </div>
+      <div
+        class="view row"
+      >
+        <div
+          class="view"
+        >
+          <div
+            class="view"
+          >
+            <span
+              class="text small"
+            >
+              payments.label.expiration
+            </span>
+            <div
+              class="view row"
+            >
+              <input
+                data-paycomet="dateMonth"
+                maxlength="2"
+                name="month"
+                value=""
+              />
+              /
+              <input
+                data-paycomet="dateYear"
+                maxlength="2"
+                name="year"
+                value=""
+              />
+            </div>
+          </div>
+        </div>
+        <div
+          class="view"
+        >
+          <div
+            class="view"
+          >
+            <span
+              class="text small"
+            >
+              payments.label.cvv
+            </span>
+            <div
+              data-paycomet="cvc2"
+              id="paycomet-cvc2"
+            />
+            <input
+              paycomet-name="cvc2"
+              paycomet-style="border:0px;color:undefined;font-family:undefined;font-size:undefined;height:undefined;padding:0!important;"
+            />
+          </div>
+        </div>
+      </div>
+      <button
+        class="pressable button large wide"
+      >
+        <div
+          class="view busyContainer"
+        >
+          <div
+            class="view spinner"
+          />
+        </div>
+        <div
+          class="view row children"
+        >
+          payments.action.pay
+        </div>
+      </button>
+    </form>
+    <div
+      id="paymentErrorMsg"
+      style="display: none;"
+    />
+  </div>
+</DocumentFragment>
+`;

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _useMutationObserver = require("./useMutationObserver");
+Object.keys(_useMutationObserver).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useMutationObserver[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useMutationObserver[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_useMutationObserver","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../../../../src/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/index.js"],"sourcesContent":["export * from './useMutationObserver';\n"],"mappings":";;;;;AAAA,IAAAA,oBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,oBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,oBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,oBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/useMutationObserver.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMutationObserver = void 0;
+var _react = require("react");
+const DEFAULT = {
+  attributes: true,
+  childList: true,
+  subtree: true
+};
+const useMutationObserver = function (element, callback) {
+  let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : DEFAULT;
+  (0, _react.useEffect)(() => {
+    if (!element) return;
+    const observer = new MutationObserver(callback);
+    observer.observe(element, options);
+    return () => observer.disconnect();
+  }, [callback, element, options]);
+};
+exports.useMutationObserver = useMutationObserver;
+//# sourceMappingURL=useMutationObserver.js.map

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/useMutationObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMutationObserver.js","names":["_react","require","DEFAULT","attributes","childList","subtree","useMutationObserver","element","callback","options","arguments","length","undefined","useEffect","observer","MutationObserver","observe","disconnect","exports"],"sources":["../../../../../../../src/components/__shared__/ButtonPayment/components/FormPaycomet/helpers/useMutationObserver.jsx"],"sourcesContent":["import { useEffect } from 'react';\n\nconst DEFAULT = { attributes: true, childList: true, subtree: true };\n\nexport const useMutationObserver = (element, callback, options = DEFAULT) => {\n  useEffect(() => {\n    if (!element) return;\n\n    const observer = new MutationObserver(callback);\n    observer.observe(element, options);\n\n    return () => observer.disconnect();\n  }, [callback, element, options]);\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,MAAMC,OAAO,GAAG;EAAEC,UAAU,EAAE,IAAI;EAAEC,SAAS,EAAE,IAAI;EAAEC,OAAO,EAAE;AAAK,CAAC;AAE7D,MAAMC,mBAAmB,GAAG,SAAAA,CAACC,OAAO,EAAEC,QAAQ,EAAwB;EAAA,IAAtBC,OAAO,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGR,OAAO;EACtE,IAAAW,gBAAS,EAAC,MAAM;IACd,IAAI,CAACN,OAAO,EAAE;IAEd,MAAMO,QAAQ,GAAG,IAAIC,gBAAgB,CAACP,QAAQ,CAAC;IAC/CM,QAAQ,CAACE,OAAO,CAACT,OAAO,EAAEE,OAAO,CAAC;IAElC,OAAO,MAAMK,QAAQ,CAACG,UAAU,CAAC,CAAC;EACpC,CAAC,EAAE,CAACT,QAAQ,EAAED,OAAO,EAAEE,OAAO,CAAC,CAAC;AAClC,CAAC;AAACS,OAAA,CAAAZ,mBAAA,GAAAA,mBAAA"}

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _FormPaycomet = require("./FormPaycomet");
+Object.keys(_FormPaycomet).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _FormPaycomet[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _FormPaycomet[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/build/components/__shared__/ButtonPayment/components/FormPaycomet/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_FormPaycomet","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormPaycomet/index.js"],"sourcesContent":["export * from './FormPaycomet';\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,aAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,aAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,aAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.constants.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SCRIPT_ID = exports.BUTTON_PROPS = void 0;
+const BUTTON_PROPS = exports.BUTTON_PROPS = {
+  id: 'button-sipay',
+  ['data-notab']: 1,
+  ['data-cardholdername']: 'true',
+  ['data-theme']: 'blue',
+  ['data-hiddenprice']: 'true',
+  ['data-template']: 'embedded',
+  ['data-autosave']: 'true',
+  type: 'button'
+};
+const SCRIPT_ID = exports.SCRIPT_ID = 'script-sipay';
+//# sourceMappingURL=FormSipay.constants.js.map

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSipay.constants.js","names":["BUTTON_PROPS","exports","id","type","SCRIPT_ID"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.constants.js"],"sourcesContent":["const BUTTON_PROPS = {\n  id: 'button-sipay',\n  ['data-notab']: 1,\n  ['data-cardholdername']: 'true',\n  ['data-theme']: 'blue',\n  ['data-hiddenprice']: 'true',\n  ['data-template']: 'embedded',\n  ['data-autosave']: 'true',\n  type: 'button',\n};\n\nconst SCRIPT_ID = 'script-sipay';\n\nexport { BUTTON_PROPS, SCRIPT_ID };\n"],"mappings":";;;;;;AAAA,MAAMA,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG;EACnBE,EAAE,EAAE,cAAc;EAClB,CAAC,YAAY,GAAG,CAAC;EACjB,CAAC,qBAAqB,GAAG,MAAM;EAC/B,CAAC,YAAY,GAAG,MAAM;EACtB,CAAC,kBAAkB,GAAG,MAAM;EAC5B,CAAC,eAAe,GAAG,UAAU;EAC7B,CAAC,eAAe,GAAG,MAAM;EACzBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,SAAS,GAAAH,OAAA,CAAAG,SAAA,GAAG,cAAc"}

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.js

@@ -0,0 +1,119 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FormSipay = void 0;
+var _locale = require("@mirai/locale");
+var _ui = require("@mirai/ui");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
+var _FormSipay = require("./FormSipay.constants");
+var _FormSipay2 = require("./FormSipay.l10n");
+var style = _interopRequireWildcard(require("./FormSipay.module.css"));
+var _helpers = require("./helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const FormSipay = _ref => {
+  let {
+    currencyDecimals = 2,
+    info: {
+      cardValidation = false,
+      amount = 0
+    } = {},
+    publicKey = process.env.PROVIDER_SIPAY_PUBLICKEY,
+    onError = () => {},
+    onSuccess = () => {},
+    ...others
+  } = _ref;
+  const {
+    currency,
+    translate
+  } = (0, _locale.useLocale)();
+  const [ready, setReady] = (0, _react.useState)(false);
+  const [success, setSuccess] = (0, _react.useState)({});
+  (0, _react.useEffect)(() => {
+    const exists = document.getElementById(_FormSipay.SCRIPT_ID);
+    const script = exists || document.createElement('script');
+    script.id = _FormSipay.SCRIPT_ID;
+    script.src = process.env.PROVIDER_SIPAY_SCRIPT;
+    script.onload = handleLoad;
+    document.head.appendChild(script);
+    return () => {
+      const el = document.getElementById(_FormSipay.SCRIPT_ID);
+      el.parentNode.removeChild(el);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(() => {
+    window.FastpayCallback = handleSuccess;
+    return () => window.FastpayCallback = undefined;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [ready, success]);
+  (0, _react.useEffect)(() => {
+    const {
+      name,
+      token,
+      type
+    } = success || {};
+    if (type === 'success') onSuccess({
+      name,
+      token
+    });else onError({});
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [success]);
+  const handleLoad = () => {
+    const el = document.getElementById(_FormSipay.BUTTON_PROPS.id);
+    window.Fastpay.loadButton(el);
+    window.Fastpay.customize((0, _helpers.getStyle)());
+    el.click();
+    setReady(true);
+  };
+  const handleSuccess = _ref2 => {
+    let {
+      type,
+      request_id: token,
+      payload: {
+        cadholder_name: name
+      } = {}
+    } = _ref2;
+    return setSuccess({
+      name,
+      token,
+      type
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_ui.View, _extends({}, others, {
+    className: (0, _ui.styles)(style.container, ready && style.ready, others.className)
+  }), ready ? /*#__PURE__*/_react.default.createElement(_ui.Text, {
+    action: true
+  }, translate(_FormSipay2.L10N.LABEL_SECURE_PAGE)) : /*#__PURE__*/_react.default.createElement(_ui.Notification, {
+    inline: true,
+    large: true,
+    warning: true,
+    wide: true
+  }, translate(_FormSipay2.L10N.NOTIFICATION_LOADING)), /*#__PURE__*/_react.default.createElement("button", _extends({}, _FormSipay.BUTTON_PROPS, {
+    "data-amount": cardValidation ? 1 : (amount * Math.pow(10, currencyDecimals)).toFixed(),
+    "data-currency": currency,
+    "data-callback": "FastpayCallback",
+    "data-paymentbutton": translate(cardValidation ? _FormSipay2.L10N.ACTION_AUTHORIZE : _FormSipay2.L10N.ACTION_PAY),
+    "data-key": publicKey,
+    className: style.button
+  })));
+};
+exports.FormSipay = FormSipay;
+FormSipay.displayName = 'Mirai:Payments:ButtonPayment:FormSipay';
+FormSipay.propTypes = {
+  currencyDecimals: _propTypes.default.number,
+  info: _propTypes.default.shape({
+    amount: _propTypes.default.number,
+    cardValidation: _propTypes.default.bool,
+    date: _propTypes.default.instanceOf(Date)
+  }),
+  publicKey: _propTypes.default.string,
+  onError: _propTypes.default.func,
+  onSuccess: _propTypes.default.func
+};
+//# sourceMappingURL=FormSipay.js.map

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSipay.js","names":["_locale","require","_ui","_propTypes","_interopRequireDefault","_react","_interopRequireWildcard","_FormSipay","_FormSipay2","style","_helpers","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","FormSipay","_ref","currencyDecimals","info","cardValidation","amount","publicKey","process","env","PROVIDER_SIPAY_PUBLICKEY","onError","onSuccess","others","currency","translate","useLocale","ready","setReady","useState","success","setSuccess","useEffect","exists","document","getElementById","SCRIPT_ID","script","createElement","id","src","PROVIDER_SIPAY_SCRIPT","onload","handleLoad","head","appendChild","el","parentNode","removeChild","window","FastpayCallback","handleSuccess","undefined","name","token","type","BUTTON_PROPS","Fastpay","loadButton","customize","getStyle","click","_ref2","request_id","payload","cadholder_name","View","className","styles","container","Text","action","L10N","LABEL_SECURE_PAGE","Notification","inline","large","warning","wide","NOTIFICATION_LOADING","Math","pow","toFixed","ACTION_AUTHORIZE","ACTION_PAY","button","exports","displayName","propTypes","PropTypes","number","shape","bool","date","instanceOf","Date","string","func"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.jsx"],"sourcesContent":["import { useLocale } from '@mirai/locale';\nimport { Notification, styles, Text, View } from '@mirai/ui';\nimport PropTypes from 'prop-types';\nimport React, { useEffect, useState } from 'react';\n\nimport { BUTTON_PROPS, SCRIPT_ID } from './FormSipay.constants';\nimport { L10N } from './FormSipay.l10n';\nimport * as style from './FormSipay.module.css';\nimport { getStyle } from './helpers';\n\nexport const FormSipay = ({\n  currencyDecimals = 2,\n  info: { cardValidation = false, amount = 0 } = {},\n  publicKey = process.env.PROVIDER_SIPAY_PUBLICKEY,\n  onError = () => {},\n  onSuccess = () => {},\n  ...others\n}) => {\n  const { currency, translate } = useLocale();\n\n  const [ready, setReady] = useState(false);\n  const [success, setSuccess] = useState({});\n\n  useEffect(() => {\n    const exists = document.getElementById(SCRIPT_ID);\n    const script = exists || document.createElement('script');\n    script.id = SCRIPT_ID;\n    script.src = process.env.PROVIDER_SIPAY_SCRIPT;\n    script.onload = handleLoad;\n\n    document.head.appendChild(script);\n\n    return () => {\n      const el = document.getElementById(SCRIPT_ID);\n      el.parentNode.removeChild(el);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    window.FastpayCallback = handleSuccess;\n\n    return () => (window.FastpayCallback = undefined);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ready, success]);\n\n  useEffect(() => {\n    const { name, token, type } = success || {};\n\n    if (type === 'success') onSuccess({ name, token });\n    else onError({});\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [success]);\n\n  const handleLoad = () => {\n    const el = document.getElementById(BUTTON_PROPS.id);\n\n    window.Fastpay.loadButton(el);\n\n    window.Fastpay.customize(getStyle());\n\n    el.click();\n\n    setReady(true);\n  };\n\n  const handleSuccess = ({ type, request_id: token, payload: { cadholder_name: name } = {} }) =>\n    setSuccess({ name, token, type });\n\n  return (\n    <View {...others} className={styles(style.container, ready && style.ready, others.className)}>\n      {ready ? (\n        <Text action>{translate(L10N.LABEL_SECURE_PAGE)}</Text>\n      ) : (\n        <Notification inline large warning wide>\n          {translate(L10N.NOTIFICATION_LOADING)}\n        </Notification>\n      )}\n\n      <button\n        {...BUTTON_PROPS}\n        data-amount={cardValidation ? 1 : (amount * Math.pow(10, currencyDecimals)).toFixed()}\n        data-currency={currency}\n        data-callback=\"FastpayCallback\"\n        data-paymentbutton={translate(cardValidation ? L10N.ACTION_AUTHORIZE : L10N.ACTION_PAY)}\n        data-key={publicKey}\n        className={style.button}\n      />\n    </View>\n  );\n};\n\nFormSipay.displayName = 'Mirai:Payments:ButtonPayment:FormSipay';\n\nFormSipay.propTypes = {\n  currencyDecimals: PropTypes.number,\n  info: PropTypes.shape({\n    amount: PropTypes.number,\n    cardValidation: PropTypes.bool,\n    date: PropTypes.instanceOf(Date),\n  }),\n  publicKey: PropTypes.string,\n  onError: PropTypes.func,\n  onSuccess: PropTypes.func,\n};\n"],"mappings":"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"}

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.l10n.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.L10N = void 0;
+const L10N = exports.L10N = {
+  ACTION_AUTHORIZE: {
+    id: 'payments.action.authorize'
+  },
+  ACTION_PAY: {
+    id: 'payments.action.pay'
+  },
+  LABEL_SECURE_PAGE: {
+    id: 'payments.label.secure_page'
+  },
+  NOTIFICATION_LOADING: {
+    id: 'payments.notification.loading'
+  }
+};
+//# sourceMappingURL=FormSipay.l10n.js.map

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.l10n.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSipay.l10n.js","names":["L10N","exports","ACTION_AUTHORIZE","id","ACTION_PAY","LABEL_SECURE_PAGE","NOTIFICATION_LOADING"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.l10n.js"],"sourcesContent":["export const L10N = {\n  ACTION_AUTHORIZE: { id: 'payments.action.authorize' },\n  ACTION_PAY: { id: 'payments.action.pay' },\n  LABEL_SECURE_PAGE: { id: 'payments.label.secure_page' },\n  NOTIFICATION_LOADING: { id: 'payments.notification.loading' },\n};\n"],"mappings":";;;;;;AAAO,MAAMA,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG;EAClBE,gBAAgB,EAAE;IAAEC,EAAE,EAAE;EAA4B,CAAC;EACrDC,UAAU,EAAE;IAAED,EAAE,EAAE;EAAsB,CAAC;EACzCE,iBAAiB,EAAE;IAAEF,EAAE,EAAE;EAA6B,CAAC;EACvDG,oBAAoB,EAAE;IAAEH,EAAE,EAAE;EAAgC;AAC9D,CAAC"}

package/build/components/__shared__/ButtonPayment/components/FormSipay/FormSipay.module.css

@@ -0,0 +1,17 @@
+.container {
+}
+
+.container > iframe {
+  border: 0px;
+  height: 0px;
+  margin: 0px;
+  padding: 0px;
+}
+
+.container.ready > iframe {
+  height: 460px;
+}
+
+.button {
+  display: none;
+}

package/build/components/__shared__/ButtonPayment/components/FormSipay/__tests__/__snapshots__/FormSipay.test.js.snap

@@ -0,0 +1,149 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`component:<FormSipay> inherit:className 1`] = `
+<DocumentFragment>
+  <div
+    class="view mirai"
+  >
+    <div
+      class="view row notification warning inline inline large wide"
+    >
+      <span
+        class="icon headline-1 icon"
+      >
+        <svg
+          fill="currentColor"
+          height="1em"
+          stroke="currentColor"
+          stroke-width="0"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M12 5.99 19.53 19H4.47L12 5.99M12 2 1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"
+          />
+        </svg>
+      </span>
+      <span
+        class="text paragraph text warning"
+      >
+        payments.notification.loading
+      </span>
+    </div>
+    <button
+      data-amount="0"
+      data-autosave="true"
+      data-callback="FastpayCallback"
+      data-cardholdername="true"
+      data-currency="EUR"
+      data-hiddenprice="true"
+      data-notab="1"
+      data-paymentbutton="payments.action.pay"
+      data-template="embedded"
+      data-theme="blue"
+      id="button-sipay"
+      type="button"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<FormSipay> renders 1`] = `
+<DocumentFragment>
+  <div
+    class="view"
+  >
+    <div
+      class="view row notification warning inline inline large wide"
+    >
+      <span
+        class="icon headline-1 icon"
+      >
+        <svg
+          fill="currentColor"
+          height="1em"
+          stroke="currentColor"
+          stroke-width="0"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M12 5.99 19.53 19H4.47L12 5.99M12 2 1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"
+          />
+        </svg>
+      </span>
+      <span
+        class="text paragraph text warning"
+      >
+        payments.notification.loading
+      </span>
+    </div>
+    <button
+      data-amount="0"
+      data-autosave="true"
+      data-callback="FastpayCallback"
+      data-cardholdername="true"
+      data-currency="EUR"
+      data-hiddenprice="true"
+      data-notab="1"
+      data-paymentbutton="payments.action.pay"
+      data-template="embedded"
+      data-theme="blue"
+      id="button-sipay"
+      type="button"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`component:<FormSipay> testID 1`] = `
+<DocumentFragment>
+  <div
+    class="view"
+    data-testid="mirai"
+  >
+    <div
+      class="view row notification warning inline inline large wide"
+    >
+      <span
+        class="icon headline-1 icon"
+      >
+        <svg
+          fill="currentColor"
+          height="1em"
+          stroke="currentColor"
+          stroke-width="0"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M12 5.99 19.53 19H4.47L12 5.99M12 2 1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"
+          />
+        </svg>
+      </span>
+      <span
+        class="text paragraph text warning"
+      >
+        payments.notification.loading
+      </span>
+    </div>
+    <button
+      data-amount="0"
+      data-autosave="true"
+      data-callback="FastpayCallback"
+      data-cardholdername="true"
+      data-currency="EUR"
+      data-hiddenprice="true"
+      data-notab="1"
+      data-paymentbutton="payments.action.pay"
+      data-template="embedded"
+      data-theme="blue"
+      id="button-sipay"
+      type="button"
+    />
+  </div>
+</DocumentFragment>
+`;