@blocklet/payment-react/lib/checkout-v2/components/left/staking-breakdown.js

Reusable react components for payment kit v2

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
module.exports = StakingBreakdown;
var _jsxRuntime = require("react/jsx-runtime");
var _HelpOutline = _interopRequireDefault(require("@mui/icons-material/HelpOutline"));
var _material = require("@mui/material");
var _context = require("@arcblock/ux/lib/Locale/context");
var _format = require("../../utils/format");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function StakingBreakdown({
  staking,
  paymentAmount,
  trialActive,
  trialDays,
  afterTrialInterval
}) {
  const {
    t
  } = (0, _context.useLocaleContext)();
  return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
    spacing: 1,
    sx: {
      mb: 1
    },
    children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
      direction: "row",
      justifyContent: "space-between",
      alignItems: "center",
      children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
        direction: "row",
        spacing: 0.5,
        alignItems: "center",
        children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
          sx: {
            color: "text.secondary",
            fontSize: 14
          },
          children: t("payment.checkout.paymentRequired")
        }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Tooltip, {
          title: t("payment.checkout.stakingConfirm"),
          placement: "top",
          arrow: true,
          slotProps: {
            popper: {
              sx: _format.whiteTooltipSx
            }
          },
          children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_HelpOutline.default, {
            sx: {
              fontSize: 16,
              color: "text.disabled"
            }
          })
        })]
      }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
        children: trialActive ? (0, _format.formatTrialText)(t, trialDays, afterTrialInterval || "day") : paymentAmount
      })]
    }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
      direction: "row",
      justifyContent: "space-between",
      alignItems: "center",
      children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
        direction: "row",
        spacing: 0.5,
        alignItems: "center",
        children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
          sx: {
            color: "text.secondary",
            fontSize: 14
          },
          children: t("payment.checkout.staking.title")
        }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Tooltip, {
          title: t("payment.checkout.staking.tooltip"),
          placement: "top",
          arrow: true,
          slotProps: {
            popper: {
              sx: _format.whiteTooltipSx
            }
          },
          children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_HelpOutline.default, {
            sx: {
              fontSize: 16,
              color: "text.disabled"
            }
          })
        })]
      }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
        children: staking
      })]
    })]
  });
}