@blocklet/payment-react 1.18.8 → 1.18.10

package/es/checkout/donate.d.ts

@@ -49,6 +49,7 @@ export type DonateProps = Pick<CheckoutProps, 'onPaid' | 'onError'> & {
     theme?: 'default' | 'inherit' | PaymentThemeOptions;
     children?: (openDialog: () => void, donateTotalAmount: string, supporters: DonateHistory, loading?: boolean, donateSettings?: DonationSettings) => React.ReactNode;
 };
+export declare function DonateDetails({ supporters, currency, method }: DonateHistory): import("react").JSX.Element;
 declare function CheckoutDonate(props: DonateProps): import("react").JSX.Element;
 declare namespace CheckoutDonate {
     var defaultProps: {

package/es/checkout/donate.js

@@ -60,7 +60,7 @@ const fetchSupporters = (target, livemode = true) => {
 const emojiFont = {
   fontFamily: 'Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
 };
-function DonateDetails({ supporters = [], currency, method }) {
+export function DonateDetails({ supporters = [], currency, method }) {
   const { locale } = useLocaleContext();
   return /* @__PURE__ */ jsx(
     Stack,
@@ -180,22 +180,33 @@ function SupporterAvatar({
   if (customersNum === 0)
     return null;
   return /* @__PURE__ */ jsxs(Stack, { flexDirection: "row", justifyContent: "center", alignItems: "center", children: [
-    /* @__PURE__ */ jsx(AvatarGroup, { max: 5, children: customers.slice(0, 5).map((supporter) => /* @__PURE__ */ jsx(
-      Avatar,
+    /* @__PURE__ */ jsx(
+      AvatarGroup,
       {
-        src: getCustomerAvatar(
-          supporter.customer?.did,
-          supporter?.updated_at ? new Date(supporter.updated_at).toISOString() : "",
-          24
-        ),
-        alt: supporter.customer?.name,
+        max: 5,
         sx: {
-          width: "24px",
-          height: "24px"
-        }
-      },
-      supporter.customer?.id
-    )) }),
+          "& .MuiAvatar-root": {
+            backgroundColor: "background.paper"
+          }
+        },
+        children: customers.slice(0, 5).map((supporter) => /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            src: getCustomerAvatar(
+              supporter.customer?.did,
+              supporter?.updated_at ? new Date(supporter.updated_at).toISOString() : "",
+              24
+            ),
+            alt: supporter.customer?.name,
+            sx: {
+              width: "24px",
+              height: "24px"
+            }
+          },
+          supporter.customer?.id
+        ))
+      }
+    ),
     /* @__PURE__ */ jsx(
       Box,
       {

package/es/index.d.ts

@@ -1,4 +1,4 @@
-import CheckoutDonate from './checkout/donate';
+import CheckoutDonate, { DonateDetails } from './checkout/donate';
 import CheckoutForm from './checkout/form';
 import CheckoutTable from './checkout/table';
 import TxGas from './components/blockchain/gas';
@@ -43,4 +43,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, PaymentBeneficiaries, LoadingButton, };
+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, LoadingButton, DonateDetails, };

package/es/index.js

@@ -1,4 +1,4 @@
-import CheckoutDonate from "./checkout/donate.js";
+import CheckoutDonate, { DonateDetails } from "./checkout/donate.js";
 import CheckoutForm from "./checkout/form.js";
 import CheckoutTable from "./checkout/table.js";
 import TxGas from "./components/blockchain/gas.js";
@@ -76,5 +76,6 @@ export {
   Link,
   OverdueInvoicePayment,
   PaymentBeneficiaries,
-  LoadingButton
+  LoadingButton,
+  DonateDetails
 };

package/lib/checkout/donate.d.ts

@@ -49,6 +49,7 @@ export type DonateProps = Pick<CheckoutProps, 'onPaid' | 'onError'> & {
     theme?: 'default' | 'inherit' | PaymentThemeOptions;
     children?: (openDialog: () => void, donateTotalAmount: string, supporters: DonateHistory, loading?: boolean, donateSettings?: DonationSettings) => React.ReactNode;
 };
+export declare function DonateDetails({ supporters, currency, method }: DonateHistory): import("react").JSX.Element;
 declare function CheckoutDonate(props: DonateProps): import("react").JSX.Element;
 declare namespace CheckoutDonate {
     var defaultProps: {

package/lib/checkout/donate.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.DonateDetails = DonateDetails;
 module.exports = CheckoutDonate;
 var _jsxRuntime = require("react/jsx-runtime");
 var _Dialog = _interopRequireDefault(require("@arcblock/ux/lib/Dialog"));
@@ -180,6 +181,11 @@ function SupporterAvatar({
     alignItems: "center",
     children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.AvatarGroup, {
       max: 5,
+      sx: {
+        "& .MuiAvatar-root": {
+          backgroundColor: "background.paper"
+        }
+      },
       children: customers.slice(0, 5).map(supporter => /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Avatar, {
         src: (0, _util.getCustomerAvatar)(supporter.customer?.did, supporter?.updated_at ? new Date(supporter.updated_at).toISOString() : "", 24),
         alt: supporter.customer?.name,

package/lib/index.d.ts

@@ -1,4 +1,4 @@
-import CheckoutDonate from './checkout/donate';
+import CheckoutDonate, { DonateDetails } from './checkout/donate';
 import CheckoutForm from './checkout/form';
 import CheckoutTable from './checkout/table';
 import TxGas from './components/blockchain/gas';
@@ -43,4 +43,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, PaymentBeneficiaries, LoadingButton, };
+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, LoadingButton, DonateDetails, };

package/lib/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {
   CheckoutDonate: true,
+  DonateDetails: true,
   CheckoutForm: true,
   CheckoutTable: true,
   TxGas: true,
@@ -101,6 +102,12 @@ Object.defineProperty(exports, "CustomerPaymentList", {
     return _list2.default;
   }
 });
+Object.defineProperty(exports, "DonateDetails", {
+  enumerable: true,
+  get: function () {
+    return _donate.DonateDetails;
+  }
+});
 Object.defineProperty(exports, "FormInput", {
   enumerable: true,
   get: function () {
@@ -257,7 +264,7 @@ Object.defineProperty(exports, "translations", {
     return _locales.translations;
   }
 });
-var _donate = _interopRequireDefault(require("./checkout/donate"));
+var _donate = _interopRequireWildcard(require("./checkout/donate"));
 var _form = _interopRequireDefault(require("./checkout/form"));
 var _table = _interopRequireDefault(require("./checkout/table"));
 var _gas = _interopRequireDefault(require("./components/blockchain/gas"));
@@ -412,4 +419,6 @@ Object.keys(_scroll).forEach(function (key) {
   });
 });
 var _locales = require("./locales");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/payment-react",
-  "version": "1.18.8",
+  "version": "1.18.10",
   "description": "Reusable react components for payment kit v2",
   "keywords": [
     "react",
@@ -53,10 +53,10 @@
     }
   },
   "dependencies": {
-    "@arcblock/did-connect": "^2.11.44",
-    "@arcblock/ux": "^2.11.44",
+    "@arcblock/did-connect": "^2.11.48",
+    "@arcblock/ux": "^2.11.48",
     "@arcblock/ws": "^1.19.10",
-    "@blocklet/ui-react": "^2.11.44",
+    "@blocklet/ui-react": "^2.11.48",
     "@mui/icons-material": "^5.16.6",
     "@mui/lab": "^5.0.0-alpha.173",
     "@mui/material": "^5.16.6",
@@ -92,7 +92,7 @@
     "@babel/core": "^7.25.2",
     "@babel/preset-env": "^7.25.2",
     "@babel/preset-react": "^7.24.7",
-    "@blocklet/payment-types": "1.18.8",
+    "@blocklet/payment-types": "1.18.10",
     "@storybook/addon-essentials": "^7.6.20",
     "@storybook/addon-interactions": "^7.6.20",
     "@storybook/addon-links": "^7.6.20",
@@ -123,5 +123,5 @@
     "vite-plugin-babel": "^1.2.0",
     "vite-plugin-node-polyfills": "^0.21.0"
   },
-  "gitHead": "0815493ffd53c977d2d14779703d85f2e0e34299"
+  "gitHead": "942a9f4057f0cb1e7b3409d469b20c54ab7924a0"
 }

package/src/checkout/donate.tsx

@@ -145,7 +145,7 @@ const emojiFont = {
     'Avenir, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
 };
 
-function DonateDetails({ supporters = [], currency, method }: DonateHistory) {
+export function DonateDetails({ supporters = [], currency, method }: DonateHistory) {
   const { locale } = useLocaleContext();
   return (
     <Stack
@@ -249,7 +249,13 @@ function SupporterAvatar({
   if (customersNum === 0) return null;
   return (
     <Stack flexDirection="row" justifyContent="center" alignItems="center">
-      <AvatarGroup max={5}>
+      <AvatarGroup
+        max={5}
+        sx={{
+          '& .MuiAvatar-root': {
+            backgroundColor: 'background.paper',
+          },
+        }}>
         {customers.slice(0, 5).map((supporter) => (
           <Avatar
             src={getCustomerAvatar(

package/src/index.ts

@@ -1,4 +1,4 @@
-import CheckoutDonate from './checkout/donate';
+import CheckoutDonate, { DonateDetails } from './checkout/donate';
 import CheckoutForm from './checkout/form';
 import CheckoutTable from './checkout/table';
 import TxGas from './components/blockchain/gas';
@@ -81,4 +81,5 @@ export {
   OverdueInvoicePayment,
   PaymentBeneficiaries,
   LoadingButton,
+  DonateDetails,
 };