@mirai/core 0.4.498 → 0.4.499

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

@@ -4,16 +4,26 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FormStripe = void 0;
+var _dataSources = require("@mirai/data-sources");
 var _locale = require("@mirai/locale");
 var _ui = require("@mirai/ui");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _FormStripe = require("./FormStripe.l10n");
 var style = _interopRequireWildcard(require("./FormStripe.module.css"));
+var _herlpes = require("./herlpes");
 var _loadScript = require("../../../../../helpers/loadScript");
-var _trackError = require("../../../../../helpers/trackError");
+var _helpers = require("../../../../helpers");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const AUTO = 'auto';
+const CARD = 'card';
+const DEFAULT_BILLING_DETAILS = {
+  address: {
+    country: 'never'
+  },
+  name: 'never'
+};
 let checkout;
 const FormStripe = _ref => {
   let {
@@ -24,9 +34,12 @@ const FormStripe = _ref => {
     translate
   } = (0, _locale.useLocale)();
   const [busy, setBusy] = (0, _react.useState)();
-  const [error, setError] = (0, _react.useState)();
+  const [country, setCountry] = (0, _react.useState)();
+  const [name, setName] = (0, _react.useState)();
+  const [nameError, setNameError] = (0, _react.useState)();
   const [ready, setReady] = (0, _react.useState)();
   const [stripeReady, setStripeReady] = (0, _react.useState)();
+  const [type, setType] = (0, _react.useState)();
   const refElements = (0, _react.useRef)();
   (0, _react.useEffect)(() => {
     const domain = 'payments';
@@ -36,7 +49,7 @@ const FormStripe = _ref => {
         async: false,
         domain,
         id,
-        src: "https://js.stripe.com/basil/stripe.js",
+        src: "https://js.stripe.com/clover/stripe.js",
         onLoad: handleLoad
       });
     })();
@@ -51,45 +64,86 @@ const FormStripe = _ref => {
     setStripeReady();
     const {
       configuration: {
+        clientCountry,
         clientSecret,
         stripeAccountId: stripeAccount
       } = {}
     } = response;
+    setCountry(clientCountry);
     (async () => {
-      checkout = await window.Stripe(publicKey, {
+      checkout = window.Stripe(publicKey, {
         stripeAccount
       }).initCheckout({
-        fetchClientSecret: () => new Promise(resolve => resolve(clientSecret)),
+        clientSecret,
         elementsOptions: {
           appearance: {
-            theme: 'stripe'
+            theme: 'stripe',
+            variables: (0, _herlpes.getStyle)()
           }
         }
       });
-      const paymentElement = checkout.createPaymentElement();
+      checkout.loadFonts([{
+        cssSrc: 'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap'
+      }]);
+      const paymentElement = checkout.createPaymentElement({
+        layout: 'tabs',
+        fields: {
+          billingDetails: clientCountry ? DEFAULT_BILLING_DETAILS : AUTO
+        }
+      });
       paymentElement.on('ready', () => {
         setStripeReady(true);
       });
+      paymentElement.on('change', event => {
+        const {
+          value = {}
+        } = event;
+        setType(value.type);
+        checkout.getPaymentElement().update({
+          fields: {
+            billingDetails: value.type === CARD && clientCountry ? DEFAULT_BILLING_DETAILS : AUTO
+          }
+        });
+      });
       paymentElement.mount(refElements.current);
     })();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [ready, response]);
+  const handleNameChange = value => {
+    if (value) setNameError();
+    setName(value);
+  };
   const handleLoad = async () => {
     setReady(true);
   };
   const handlePress = async () => {
     if (!checkout) return;
     setBusy(true);
-    setError();
-    const {
-      error
-    } = await checkout.confirm();
-    setBusy(false);
-    if (error) {
-      (0, _trackError.trackError)('Stripe', error instanceof Error ? error.stack : error === null || error === void 0 ? void 0 : error.message);
-      setError(true);
-      return;
+    const loadActionsResult = await checkout.loadActions();
+    if (loadActionsResult.type === 'success') {
+      const session = await loadActionsResult.actions.getSession();
+      if (!name && type === CARD && country) {
+        setNameError(true);
+        if (session.canConfirm) return setBusy(false);
+      }
+      const {
+        error
+      } = await loadActionsResult.actions.confirm(name ? {
+        billingAddress: {
+          name,
+          address: {
+            country
+          }
+        }
+      } : undefined);
+      if (session.canConfirm && error) {
+        _dataSources.Event.publish(_helpers.EVENT.NOTIFICATION, {
+          error: true,
+          defaultMessage: translate(_FormStripe.L10N.NOTIFICATION_ERROR)
+        });
+      }
     }
+    setBusy(false);
   };
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ui.Progress, {
     indeterminate: true,
@@ -98,15 +152,24 @@ const FormStripe = _ref => {
     className: style.container
   }, /*#__PURE__*/_react.default.createElement(_ui.View, {
     ref: refElements
-  }, error && /*#__PURE__*/_react.default.createElement(_ui.Notification, {
-    error: true,
-    large: true,
-    wide: true
-  }, translate(_FormStripe.L10N.NOTIFICATION_ERROR))), !!stripeReady && /*#__PURE__*/_react.default.createElement(_ui.Button, {
+  }), type === CARD && country && /*#__PURE__*/_react.default.createElement(_ui.View, {
+    className: style.form
+  }, /*#__PURE__*/_react.default.createElement(_ui.Text, {
+    action: true,
+    "label-for": "name"
+  }, translate(_FormStripe.L10N.LABEL_CARD_NAME)), /*#__PURE__*/_react.default.createElement(_ui.Input, {
+    name: "name",
+    value: name,
+    onChange: handleNameChange,
+    className: (0, _ui.styles)(style.name, nameError && style.error)
+  }), nameError && /*#__PURE__*/_react.default.createElement(_ui.Text, {
+    action: true,
+    error: true
+  }, translate(_FormStripe.L10N.LABEL_CARD_NAME_ERROR)))), !!stripeReady && /*#__PURE__*/_react.default.createElement(_ui.Button, {
     busy: busy,
     onPress: handlePress,
     className: style.button
-  }, translate(_FormStripe.L10N.ACTION_PAY))));
+  }, translate(_FormStripe.L10N.ACTION_PAY)));
 };
 exports.FormStripe = FormStripe;
 FormStripe.displayName = 'Mirai:Payments:ButtonPayment:FormStripe';

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

@@ -1 +1 @@
-{"version":3,"file":"FormStripe.js","names":["_locale","require","_ui","_propTypes","_interopRequireDefault","_react","_interopRequireWildcard","_FormStripe","style","_loadScript","_trackError","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","checkout","FormStripe","_ref","publicKey","response","translate","useLocale","busy","setBusy","useState","error","setError","ready","setReady","stripeReady","setStripeReady","refElements","useRef","useEffect","domain","id","loadScript","async","src","onLoad","handleLoad","el","document","getElementById","concat","parentNode","removeChild","configuration","clientSecret","stripeAccountId","stripeAccount","window","Stripe","initCheckout","fetchClientSecret","Promise","resolve","elementsOptions","appearance","theme","paymentElement","createPaymentElement","on","mount","current","handlePress","confirm","trackError","Error","stack","message","createElement","Fragment","Progress","indeterminate","visible","View","className","container","ref","Notification","large","wide","L10N","NOTIFICATION_ERROR","Button","onPress","button","ACTION_PAY","exports","displayName","propTypes","PropTypes","string","isRequired","object"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormStripe/FormStripe.jsx"],"sourcesContent":["import { useLocale } from '@mirai/locale';\nimport { Button, Notification, Progress, View } from '@mirai/ui';\nimport PropTypes from 'prop-types';\nimport React, { useEffect, useState, useRef } from 'react';\n\nimport { L10N } from './FormStripe.l10n';\nimport * as style from './FormStripe.module.css';\nimport { loadScript } from '../../../../../helpers/loadScript';\nimport { trackError } from '../../../../../helpers/trackError';\n\nlet checkout;\n\nexport const FormStripe = ({ publicKey, response }) => {\n  const { translate } = useLocale();\n\n  const [busy, setBusy] = useState();\n  const [error, setError] = useState();\n  const [ready, setReady] = useState();\n  const [stripeReady, setStripeReady] = useState();\n\n  const refElements = useRef();\n\n  useEffect(() => {\n    const domain = 'payments';\n    const id = 'stripeScript';\n    (async () => {\n      await loadScript({\n        async: false,\n        domain,\n        id,\n        src: `https://js.stripe.com/basil/stripe.js`,\n        onLoad: handleLoad,\n      });\n    })();\n\n    return () => {\n      const el = document.getElementById(`${domain}-${id}`);\n      el && el.parentNode.removeChild(el);\n    };\n  }, [response]);\n\n  useEffect(() => {\n    if (!response || !ready) return;\n\n    setBusy();\n    setStripeReady();\n\n    const { configuration: { clientSecret, stripeAccountId: stripeAccount } = {} } = response;\n\n    (async () => {\n      checkout = await window.Stripe(publicKey, { stripeAccount }).initCheckout({\n        fetchClientSecret: () => new Promise((resolve) => resolve(clientSecret)),\n        elementsOptions: { appearance: { theme: 'stripe' } },\n      });\n      const paymentElement = checkout.createPaymentElement();\n\n      paymentElement.on('ready', () => {\n        setStripeReady(true);\n      });\n      paymentElement.mount(refElements.current);\n    })();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ready, response]);\n\n  const handleLoad = async () => {\n    setReady(true);\n  };\n\n  const handlePress = async () => {\n    if (!checkout) return;\n\n    setBusy(true);\n    setError();\n    const { error } = await checkout.confirm();\n\n    setBusy(false);\n    if (error) {\n      trackError('Stripe', error instanceof Error ? error.stack : error?.message);\n      setError(true);\n      return;\n    }\n  };\n\n  return (\n    <>\n      <Progress indeterminate visible={!stripeReady} />\n      <View className={style.container}>\n        <View ref={refElements}>\n          {error && (\n            <Notification error large wide>\n              {translate(L10N.NOTIFICATION_ERROR)}\n            </Notification>\n          )}\n        </View>\n        {!!stripeReady && (\n          <Button busy={busy} onPress={handlePress} className={style.button}>\n            {translate(L10N.ACTION_PAY)}\n          </Button>\n        )}\n      </View>\n    </>\n  );\n};\n\nFormStripe.displayName = 'Mirai:Payments:ButtonPayment:FormStripe';\n\nFormStripe.propTypes = {\n  publicKey: PropTypes.string.isRequired,\n  response: PropTypes.object,\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FormStripe.js","names":["_dataSources","require","_locale","_ui","_propTypes","_interopRequireDefault","_react","_interopRequireWildcard","_FormStripe","style","_herlpes","_loadScript","_helpers","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","AUTO","CARD","DEFAULT_BILLING_DETAILS","address","country","name","checkout","FormStripe","_ref","publicKey","response","translate","useLocale","busy","setBusy","useState","setCountry","setName","nameError","setNameError","ready","setReady","stripeReady","setStripeReady","type","setType","refElements","useRef","useEffect","domain","id","loadScript","async","src","onLoad","handleLoad","el","document","getElementById","concat","parentNode","removeChild","configuration","clientCountry","clientSecret","stripeAccountId","stripeAccount","window","Stripe","initCheckout","elementsOptions","appearance","theme","variables","getStyle","loadFonts","cssSrc","paymentElement","createPaymentElement","layout","fields","billingDetails","on","event","value","getPaymentElement","update","mount","current","handleNameChange","handlePress","loadActionsResult","loadActions","session","actions","getSession","canConfirm","error","confirm","billingAddress","undefined","Event","publish","EVENT","NOTIFICATION","defaultMessage","L10N","NOTIFICATION_ERROR","createElement","Fragment","Progress","indeterminate","visible","View","className","container","ref","form","Text","action","LABEL_CARD_NAME","Input","onChange","styles","LABEL_CARD_NAME_ERROR","Button","onPress","button","ACTION_PAY","exports","displayName","propTypes","PropTypes","string","isRequired","object"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormStripe/FormStripe.jsx"],"sourcesContent":["import { Event } from '@mirai/data-sources';\nimport { useLocale } from '@mirai/locale';\nimport { Button, Input, Progress, styles, Text, View } from '@mirai/ui';\nimport PropTypes from 'prop-types';\nimport React, { useEffect, useState, useRef } from 'react';\n\nimport { L10N } from './FormStripe.l10n';\nimport * as style from './FormStripe.module.css';\nimport { getStyle } from './herlpes';\nimport { loadScript } from '../../../../../helpers/loadScript';\nimport { EVENT } from '../../../../helpers';\n\nconst AUTO = 'auto';\nconst CARD = 'card';\nconst DEFAULT_BILLING_DETAILS = { address: { country: 'never' }, name: 'never' };\n\nlet checkout;\n\nexport const FormStripe = ({ publicKey, response }) => {\n  const { translate } = useLocale();\n\n  const [busy, setBusy] = useState();\n  const [country, setCountry] = useState();\n  const [name, setName] = useState();\n  const [nameError, setNameError] = useState();\n  const [ready, setReady] = useState();\n  const [stripeReady, setStripeReady] = useState();\n  const [type, setType] = useState();\n\n  const refElements = useRef();\n\n  useEffect(() => {\n    const domain = 'payments';\n    const id = 'stripeScript';\n    (async () => {\n      await loadScript({\n        async: false,\n        domain,\n        id,\n        src: `https://js.stripe.com/clover/stripe.js`,\n        onLoad: handleLoad,\n      });\n    })();\n\n    return () => {\n      const el = document.getElementById(`${domain}-${id}`);\n      el && el.parentNode.removeChild(el);\n    };\n  }, [response]);\n\n  useEffect(() => {\n    if (!response || !ready) return;\n\n    setBusy();\n    setStripeReady();\n\n    const { configuration: { clientCountry, clientSecret, stripeAccountId: stripeAccount } = {} } = response;\n    setCountry(clientCountry);\n\n    (async () => {\n      checkout = window\n        .Stripe(publicKey, { stripeAccount })\n        .initCheckout({ clientSecret, elementsOptions: { appearance: { theme: 'stripe', variables: getStyle() } } });\n      checkout.loadFonts([\n        { cssSrc: 'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;700&display=swap' },\n      ]);\n\n      const paymentElement = checkout.createPaymentElement({\n        layout: 'tabs',\n        fields: { billingDetails: clientCountry ? DEFAULT_BILLING_DETAILS : AUTO },\n      });\n\n      paymentElement.on('ready', () => {\n        setStripeReady(true);\n      });\n\n      paymentElement.on('change', (event) => {\n        const { value = {} } = event;\n        setType(value.type);\n\n        checkout.getPaymentElement().update({\n          fields: { billingDetails: value.type === CARD && clientCountry ? DEFAULT_BILLING_DETAILS : AUTO },\n        });\n      });\n\n      paymentElement.mount(refElements.current);\n    })();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ready, response]);\n\n  const handleNameChange = (value) => {\n    if (value) setNameError();\n    setName(value);\n  };\n\n  const handleLoad = async () => {\n    setReady(true);\n  };\n\n  const handlePress = async () => {\n    if (!checkout) return;\n\n    setBusy(true);\n\n    const loadActionsResult = await checkout.loadActions();\n    if (loadActionsResult.type === 'success') {\n      const session = await loadActionsResult.actions.getSession();\n      if (!name && type === CARD && country) {\n        setNameError(true);\n        if (session.canConfirm) return setBusy(false);\n      }\n\n      const { error } = await loadActionsResult.actions.confirm(\n        name ? { billingAddress: { name, address: { country } } } : undefined,\n      );\n\n      if (session.canConfirm && error) {\n        Event.publish(EVENT.NOTIFICATION, {\n          error: true,\n          defaultMessage: translate(L10N.NOTIFICATION_ERROR),\n        });\n      }\n    }\n\n    setBusy(false);\n  };\n\n  return (\n    <>\n      <Progress indeterminate visible={!stripeReady} />\n      <View className={style.container}>\n        <View ref={refElements} />\n        {type === CARD && country && (\n          <View className={style.form}>\n            <Text action label-for=\"name\">\n              {translate(L10N.LABEL_CARD_NAME)}\n            </Text>\n            <Input\n              name=\"name\"\n              value={name}\n              onChange={handleNameChange}\n              className={styles(style.name, nameError && style.error)}\n            />\n            {nameError && (\n              <Text action error>\n                {translate(L10N.LABEL_CARD_NAME_ERROR)}\n              </Text>\n            )}\n          </View>\n        )}\n      </View>\n      {!!stripeReady && (\n        <Button busy={busy} onPress={handlePress} className={style.button}>\n          {translate(L10N.ACTION_PAY)}\n        </Button>\n      )}\n    </>\n  );\n};\n\nFormStripe.displayName = 'Mirai:Payments:ButtonPayment:FormStripe';\n\nFormStripe.propTypes = {\n  publicKey: PropTypes.string.isRequired,\n  response: PropTypes.object,\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -8,6 +8,12 @@ const L10N = exports.L10N = {
   ACTION_PAY: {
     id: 'core.action.pay'
   },
+  LABEL_CARD_NAME: {
+    id: 'core.label.card_name'
+  },
+  LABEL_CARD_NAME_ERROR: {
+    id: 'core.label.card_name_error'
+  },
   NOTIFICATION_ERROR: {
     id: 'common.notification.error_unknown'
   }

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

@@ -1 +1 @@
-{"version":3,"file":"FormStripe.l10n.js","names":["L10N","exports","ACTION_PAY","id","NOTIFICATION_ERROR"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormStripe/FormStripe.l10n.js"],"sourcesContent":["export const L10N = {\n  ACTION_PAY: { id: 'core.action.pay' },\n\n  NOTIFICATION_ERROR: { id: 'common.notification.error_unknown' },\n};\n"],"mappings":";;;;;;AAAO,MAAMA,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG;EAClBE,UAAU,EAAE;IAAEC,EAAE,EAAE;EAAkB,CAAC;EAErCC,kBAAkB,EAAE;IAAED,EAAE,EAAE;EAAoC;AAChE,CAAC","ignoreList":[]}
+{"version":3,"file":"FormStripe.l10n.js","names":["L10N","exports","ACTION_PAY","id","LABEL_CARD_NAME","LABEL_CARD_NAME_ERROR","NOTIFICATION_ERROR"],"sources":["../../../../../../src/components/__shared__/ButtonPayment/components/FormStripe/FormStripe.l10n.js"],"sourcesContent":["export const L10N = {\n  ACTION_PAY: { id: 'core.action.pay' },\n\n  LABEL_CARD_NAME: { id: 'core.label.card_name' },\n  LABEL_CARD_NAME_ERROR: { id: 'core.label.card_name_error' },\n\n  NOTIFICATION_ERROR: { id: 'common.notification.error_unknown' },\n};\n"],"mappings":";;;;;;AAAO,MAAMA,IAAI,GAAAC,OAAA,CAAAD,IAAA,GAAG;EAClBE,UAAU,EAAE;IAAEC,EAAE,EAAE;EAAkB,CAAC;EAErCC,eAAe,EAAE;IAAED,EAAE,EAAE;EAAuB,CAAC;EAC/CE,qBAAqB,EAAE;IAAEF,EAAE,EAAE;EAA6B,CAAC;EAE3DG,kBAAkB,EAAE;IAAEH,EAAE,EAAE;EAAoC;AAChE,CAAC","ignoreList":[]}

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

@@ -1,9 +1,38 @@
 .container {
+  gap: var(--mirai-ui-space-M);
+  max-height: calc(100vh - calc(var(--mirai-ui-space-XL) * 4));
   min-height: calc(var(--mirai-ui-space-L) * 4.75);
+  overflow: auto;
   padding: var(--mirai-ui-space-XS);
-  gap: var(--mirai-ui-space-S);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.form input.name {
+  border-radius: var(--mirai-ui-border-radius);
+  border-width: var(--mirai-ui-border-width);
+  border: var(--mirai-ui-input-text-border);
+  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02);
+  line-height: 42.3984px;
+  min-height: 42.3984px;
+  padding: 0 var(--mirai-ui-space-S) 0 var(--mirai-ui-space-S);
+}
+
+.form input.name:focus {
+  border-color: var(--mirai-ui-accent);
+  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02), 0 0 0 3px hsla(204, 64%, 40%, 25%),
+    0 1px 1px 0 rgba(0, 0, 0, 0.08);
+  outline: 0px;
+}
+
+.form input.name.error {
+  color: var(--mirai-ui-error);
+  border-color: var(--mirai-ui-error);
+  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.03), 0px 3px 6px rgba(0, 0, 0, 0.02), 0 0 0 1px var(--mirai-ui-error);
+  margin-bottom: calc(var(--mirai-ui-space-XXS) / 2);
 }
 
 .button {
   align-self: center;
+  margin: var(--mirai-ui-space-XS) 0 var(--mirai-ui-space-S) 0;
 }

package/build/components/__shared__/ButtonPayment/components/FormStripe/herlpes/getStyle.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getStyle = void 0;
+var _ui = require("@mirai/ui");
+const getStyle = () => {
+  const theme = _ui.Theme.get();
+  const {
+    accent,
+    base,
+    borderColor,
+    borderRadius,
+    content,
+    error,
+    font,
+    fontBoldWeight,
+    fontSizeAction,
+    fontSizeHeadline2,
+    fontSizeHeadline3,
+    fontSizeHeadlinee1,
+    fontSizeParagraph,
+    fontWeight
+  } = theme;
+  return {
+    borderRadius: "".concat(borderRadius, "px"),
+    colorBackground: base,
+    colorBorder: borderColor,
+    colorDanger: error,
+    colorPrimary: accent,
+    colorText: content,
+    fontFamily: font,
+    fontSize2Xs: "".concat(fontSizeHeadline3, "px"),
+    fontSize3Xs: "".concat(fontSizeHeadline2, "px"),
+    fontSizeBase: "".concat(fontSizeParagraph, "px"),
+    fontSizeLg: "".concat(fontSizeHeadlinee1, "px"),
+    fontSizeSm: "".concat(fontSizeAction, "px"),
+    fontSizeXs: "".concat(fontSizeParagraph, "px"),
+    fontWeightBold: fontBoldWeight,
+    fontWeightNormal: "".concat(fontWeight, "px")
+  };
+};
+exports.getStyle = getStyle;
+//# sourceMappingURL=getStyle.js.map

package/build/components/__shared__/ButtonPayment/components/FormStripe/herlpes/getStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getStyle.js","names":["_ui","require","getStyle","theme","Theme","get","accent","base","borderColor","borderRadius","content","error","font","fontBoldWeight","fontSizeAction","fontSizeHeadline2","fontSizeHeadline3","fontSizeHeadlinee1","fontSizeParagraph","fontWeight","concat","colorBackground","colorBorder","colorDanger","colorPrimary","colorText","fontFamily","fontSize2Xs","fontSize3Xs","fontSizeBase","fontSizeLg","fontSizeSm","fontSizeXs","fontWeightBold","fontWeightNormal","exports"],"sources":["../../../../../../../src/components/__shared__/ButtonPayment/components/FormStripe/herlpes/getStyle.js"],"sourcesContent":["import { Theme } from '@mirai/ui';\n\nexport const getStyle = () => {\n  const theme = Theme.get();\n\n  const {\n    accent,\n    base,\n    borderColor,\n    borderRadius,\n    content,\n    error,\n    font,\n    fontBoldWeight,\n    fontSizeAction,\n    fontSizeHeadline2,\n    fontSizeHeadline3,\n    fontSizeHeadlinee1,\n    fontSizeParagraph,\n    fontWeight,\n  } = theme;\n\n  return {\n    borderRadius: `${borderRadius}px`,\n    colorBackground: base,\n    colorBorder: borderColor,\n    colorDanger: error,\n    colorPrimary: accent,\n    colorText: content,\n    fontFamily: font,\n    fontSize2Xs: `${fontSizeHeadline3}px`,\n    fontSize3Xs: `${fontSizeHeadline2}px`,\n    fontSizeBase: `${fontSizeParagraph}px`,\n    fontSizeLg: `${fontSizeHeadlinee1}px`,\n    fontSizeSm: `${fontSizeAction}px`,\n    fontSizeXs: `${fontSizeParagraph}px`,\n    fontWeightBold: fontBoldWeight,\n    fontWeightNormal: `${fontWeight}px`,\n  };\n};\n"],"mappings":";;;;;;AAAA,IAAAA,GAAA,GAAAC,OAAA;AAEO,MAAMC,QAAQ,GAAGA,CAAA,KAAM;EAC5B,MAAMC,KAAK,GAAGC,SAAK,CAACC,GAAG,CAAC,CAAC;EAEzB,MAAM;IACJC,MAAM;IACNC,IAAI;IACJC,WAAW;IACXC,YAAY;IACZC,OAAO;IACPC,KAAK;IACLC,IAAI;IACJC,cAAc;IACdC,cAAc;IACdC,iBAAiB;IACjBC,iBAAiB;IACjBC,kBAAkB;IAClBC,iBAAiB;IACjBC;EACF,CAAC,GAAGhB,KAAK;EAET,OAAO;IACLM,YAAY,KAAAW,MAAA,CAAKX,YAAY,OAAI;IACjCY,eAAe,EAAEd,IAAI;IACrBe,WAAW,EAAEd,WAAW;IACxBe,WAAW,EAAEZ,KAAK;IAClBa,YAAY,EAAElB,MAAM;IACpBmB,SAAS,EAAEf,OAAO;IAClBgB,UAAU,EAAEd,IAAI;IAChBe,WAAW,KAAAP,MAAA,CAAKJ,iBAAiB,OAAI;IACrCY,WAAW,KAAAR,MAAA,CAAKL,iBAAiB,OAAI;IACrCc,YAAY,KAAAT,MAAA,CAAKF,iBAAiB,OAAI;IACtCY,UAAU,KAAAV,MAAA,CAAKH,kBAAkB,OAAI;IACrCc,UAAU,KAAAX,MAAA,CAAKN,cAAc,OAAI;IACjCkB,UAAU,KAAAZ,MAAA,CAAKF,iBAAiB,OAAI;IACpCe,cAAc,EAAEpB,cAAc;IAC9BqB,gBAAgB,KAAAd,MAAA,CAAKD,UAAU;EACjC,CAAC;AACH,CAAC;AAACgB,OAAA,CAAAjC,QAAA,GAAAA,QAAA","ignoreList":[]}

package/build/components/__shared__/ButtonPayment/components/FormStripe/herlpes/index.js

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

package/build/components/__shared__/ButtonPayment/components/FormStripe/herlpes/index.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirai/core",
-  "version": "0.4.498",
+  "version": "0.4.499",
   "source": "src/index.js",
   "repository": "https://gitlab.com/miraicorp/dev/frontend/core",
   "author": "JΛVI <hello@soyjavi.com>",