@blocklet/payment-react 1.18.9 → 1.18.11

package/es/checkout/donate.js

@@ -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/lib/checkout/donate.js

@@ -181,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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/payment-react",
-  "version": "1.18.9",
+  "version": "1.18.11",
   "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.9",
+    "@blocklet/payment-types": "1.18.11",
     "@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": "e1e02357e4ef1294a788595d34b2f3e8ef6046b3"
+  "gitHead": "370cb327400359ab5972ef60316ccd7fc86c174e"
 }

package/src/checkout/donate.tsx

@@ -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(