@blocklet/payment-react 1.18.0 → 1.18.2

package/lib/components/payment-beneficiaries.d.ts

@@ -0,0 +1,24 @@
+export interface TBeneficiary {
+    name: string;
+    address: string;
+    avatar?: string;
+    percent: number;
+    amount?: string;
+    url?: string;
+    type?: 'user' | 'dapp';
+}
+interface BenefitsProps {
+    data: TBeneficiary[];
+    currency: {
+        symbol: string;
+        decimal: number;
+    };
+    totalAmount?: string;
+}
+declare function PaymentBeneficiaries({ data, currency, totalAmount }: BenefitsProps): import("react").JSX.Element;
+declare namespace PaymentBeneficiaries {
+    var defaultProps: {
+        totalAmount: string;
+    };
+}
+export default PaymentBeneficiaries;

package/lib/components/payment-beneficiaries.js

@@ -0,0 +1,113 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = PaymentBeneficiaries;
+var _jsxRuntime = require("react/jsx-runtime");
+var _material = require("@mui/material");
+var _util = require("@ocap/util");
+var _context = require("@arcblock/ux/lib/Locale/context");
+PaymentBeneficiaries.defaultProps = {
+  totalAmount: "0"
+};
+function PaymentBeneficiaries({
+  data,
+  currency,
+  totalAmount
+}) {
+  const {
+    t
+  } = (0, _context.useLocaleContext)();
+  return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
+    spacing: 2,
+    children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+      variant: "subtitle2",
+      color: "text.secondary",
+      children: t("benefits.title", {
+        count: data.length
+      })
+    }), data.map(item => {
+      const amount = item.amount || (totalAmount ? new _util.BN(totalAmount).mul(new _util.BN(Number(item.percent))).div(new _util.BN(100)).toString() : "0");
+      return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
+        direction: {
+          xs: "column",
+          sm: "row"
+        },
+        alignItems: "center",
+        justifyContent: "space-between",
+        sx: {
+          px: 0.5,
+          borderRadius: 1,
+          bgcolor: "background.paper",
+          "&:hover": {
+            bgcolor: "action.hover"
+          }
+        },
+        children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
+          direction: "row",
+          spacing: 1.5,
+          alignItems: "center",
+          sx: {
+            width: {
+              xs: "100%",
+              sm: "auto"
+            }
+          },
+          children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Avatar, {
+            src: item.avatar,
+            alt: item.name,
+            sx: {
+              width: 32,
+              height: 32
+            },
+            variant: "square"
+          }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+            children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+              variant: "subtitle2",
+              onClick: () => {
+                if (item.url) {
+                  window.open(item.url, "_blank");
+                }
+              },
+              sx: {
+                cursor: item.url ? "pointer" : "default",
+                "&:hover": {
+                  color: item.url ? "text.link" : "inherit"
+                }
+              },
+              children: item.name
+            }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+              variant: "caption",
+              color: "text.secondary",
+              sx: {
+                cursor: "pointer"
+              },
+              children: item.address
+            })]
+          })]
+        }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Stack, {
+          alignItems: "flex-end",
+          sx: {
+            width: {
+              xs: "100%",
+              sm: "auto"
+            },
+            mt: {
+              xs: 1,
+              sm: 0
+            }
+          },
+          children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Typography, {
+            variant: "subtitle2",
+            children: [(0, _util.fromUnitToToken)(amount, currency.decimal), " ", currency.symbol]
+          }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Typography, {
+            variant: "caption",
+            color: "text.secondary",
+            children: [Number(item.percent), "%"]
+          })]
+        })]
+      }, item.address);
+    })]
+  });
+}

package/lib/index.d.ts

@@ -29,6 +29,7 @@ import TruncatedText from './components/truncated-text';
 import Link from './components/link';
 import { createLazyComponent } from './components/lazy-loader';
 import OverdueInvoicePayment from './components/over-due-invoice-payment';
+import PaymentBeneficiaries from './components/payment-beneficiaries';
 export { PaymentThemeProvider } from './theme';
 export * from './libs/util';
 export * from './libs/connect';
@@ -39,4 +40,4 @@ export * from './hooks/mobile';
 export * from './hooks/table';
 export * from './hooks/scroll';
 export { translations, createTranslator } from './locales';
-export { createLazyComponent, api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, TxLink, TxGas, SafeGuard, PricingItem, CountrySelect, Table, TruncatedText, Link, OverdueInvoicePayment, };
+export { createLazyComponent, api, dayjs, FormInput, PhoneInput, AddressForm, StripeForm, Status, Livemode, Switch, ConfirmDialog, CheckoutForm, CheckoutTable, CheckoutDonate, CurrencySelector, Payment, PaymentSummary, PricingTable, ProductSkeleton, Amount, CustomerInvoiceList, CustomerPaymentList, TxLink, TxGas, SafeGuard, PricingItem, CountrySelect, Table, TruncatedText, Link, OverdueInvoicePayment, PaymentBeneficiaries, };

package/lib/index.js

@@ -35,6 +35,7 @@ var _exportNames = {
   Link: true,
   createLazyComponent: true,
   OverdueInvoicePayment: true,
+  PaymentBeneficiaries: true,
   PaymentThemeProvider: true,
   translations: true,
   createTranslator: true
@@ -129,6 +130,12 @@ Object.defineProperty(exports, "Payment", {
     return _index.default;
   }
 });
+Object.defineProperty(exports, "PaymentBeneficiaries", {
+  enumerable: true,
+  get: function () {
+    return _paymentBeneficiaries.default;
+  }
+});
 Object.defineProperty(exports, "PaymentSummary", {
   enumerable: true,
   get: function () {
@@ -274,6 +281,7 @@ var _truncatedText = _interopRequireDefault(require("./components/truncated-text
 var _link = _interopRequireDefault(require("./components/link"));
 var _lazyLoader = require("./components/lazy-loader");
 var _overDueInvoicePayment = _interopRequireDefault(require("./components/over-due-invoice-payment"));
+var _paymentBeneficiaries = _interopRequireDefault(require("./components/payment-beneficiaries"));
 var _theme = require("./theme");
 var _util = require("./libs/util");
 Object.keys(_util).forEach(function (key) {

package/lib/locales/en.js

@@ -38,6 +38,8 @@ module.exports = (0, _flat.default)({
     upload: "Upload",
     change: "Change",
     cancel: "Cancel",
+    close: "Close",
+    back: "Back",
     every: "every",
     per: "per {interval}",
     slash: "/ {interval}",
@@ -132,7 +134,14 @@ module.exports = (0, _flat.default)({
         custom: "Custom Amount",
         select: "Select Amount",
         summary: "{total} supporters {totalAmount} {symbol}",
-        empty: "No supporters yet"
+        empty: "No supporters yet",
+        gaveTips: "{count} people gave tips",
+        tipAmount: "Tip Amount",
+        benefits: {
+          one: "{name} will receive all tips",
+          multiple: "Tips will be distributed to {count} beneficiaries",
+          view: "Click to view details"
+        }
       },
       cardPay: "{action} with card",
       empty: "No thing to pay",
@@ -354,5 +363,8 @@ module.exports = (0, _flat.default)({
   },
   empty: {
     records: "No matching records found"
+  },
+  benefits: {
+    title: "{count} Beneficiaries"
   }
 });

package/lib/locales/zh.js

@@ -38,6 +38,8 @@ module.exports = (0, _flat.default)({
     change: "\u66F4\u6362",
     confirm: "\u786E\u8BA4",
     cancel: "\u53D6\u6D88",
+    close: "\u5173\u95ED",
+    back: "\u8FD4\u56DE",
     every: "\u6BCF",
     per: "\u6BCF{interval}",
     slash: "\u6BCF{interval}",
@@ -132,7 +134,14 @@ module.exports = (0, _flat.default)({
         custom: "\u8F93\u5165\u91D1\u989D",
         select: "\u9009\u62E9\u91D1\u989D",
         summary: "\u5171\u6709 {total} \u4EBA\u652F\u6301 {totalAmount} {symbol}",
-        empty: "\u2764\uFE0F \u652F\u6301\u4E00\u4E0B"
+        empty: "\u2764\uFE0F \u652F\u6301\u4E00\u4E0B",
+        gaveTips: "\u5DF2\u6709 {count} \u4EBA\u6253\u8D4F",
+        tipAmount: "\u6253\u8D4F\u91D1\u989D",
+        benefits: {
+          one: "{name} \u5C06\u83B7\u5F97\u5168\u90E8\u6253\u8D4F",
+          multiple: "\u6253\u8D4F\u5C06\u6309\u6BD4\u4F8B\u5206\u914D\u7ED9 {count} \u4F4D\u53D7\u76CA\u4EBA",
+          view: "\u70B9\u51FB\u67E5\u770B\u8BE6\u60C5"
+        }
       },
       cardPay: "\u4F7F\u7528\u5361\u7247{action}",
       empty: "\u6CA1\u6709\u53EF\u652F\u4ED8\u7684\u9879\u76EE",
@@ -354,5 +363,8 @@ module.exports = (0, _flat.default)({
   },
   empty: {
     records: "\u6CA1\u6709\u627E\u5230\u5339\u914D\u7684\u8BB0\u5F55"
+  },
+  benefits: {
+    title: "{count} \u4F4D\u53D7\u76CA\u4EBA"
   }
 });

package/lib/payment/donation-form.d.ts

@@ -0,0 +1,24 @@
+import { type BoxProps } from '@mui/material';
+import type { LiteralUnion } from 'type-fest';
+import type { CheckoutCallbacks, CheckoutContext } from '../types';
+type Props = CheckoutContext & CheckoutCallbacks & {
+    completed?: boolean;
+    error?: any;
+    showCheckoutSummary?: boolean;
+    formRender?: Record<string, any>;
+    id: string;
+};
+declare function DonationForm({ checkoutSession, paymentMethods, paymentIntent, paymentLink, customer, completed, error, mode, onPaid, onError, onChange, goBack, action, showCheckoutSummary, formRender, id, }: Props): import("react").JSX.Element;
+declare namespace DonationForm {
+    var defaultProps: {
+        completed: boolean;
+        error: null;
+        showCheckoutSummary: boolean;
+        formRender: {};
+    };
+}
+export default DonationForm;
+type RootProps = {
+    mode: LiteralUnion<'standalone' | 'inline' | 'popup', string>;
+} & BoxProps;
+export declare const Root: React.FC<RootProps>;