@pisell/private-materials 6.7.9 → 6.8.1

package/lib/components/checkout/components/AdditionalModule/index.d.ts

@@ -8,6 +8,8 @@ interface AdditionalModuleProps {
     hasOrderNote?: boolean;
     disabled?: boolean;
     showCashPayment?: boolean;
+    isFullWidth?: boolean;
+    showMore?: boolean;
 }
-declare function AdditionalModule({ orderInfo, customAmount, handleButtonClick, hasOrderNote, disabled, showCashPayment, }: AdditionalModuleProps): React.JSX.Element;
+declare function AdditionalModule({ orderInfo, customAmount, handleButtonClick, hasOrderNote, disabled, showCashPayment, isFullWidth, showMore }: AdditionalModuleProps): React.JSX.Element;
 export default AdditionalModule;

package/lib/components/checkout/components/AdditionalModule/index.js

@@ -47,7 +47,9 @@ function AdditionalModule({
   handleButtonClick,
   hasOrderNote = false,
   disabled = false,
-  showCashPayment = false
+  showCashPayment = false,
+  isFullWidth = false,
+  showMore = true
 }) {
   import_utils.locales.init(import_locales2.default, (0, import_locales.getLocale)());
   const moreMenuItems = [
@@ -55,11 +57,16 @@ function AdditionalModule({
       key: "send-link",
       label: import_utils.locales.getText("pisell2.text.send-link"),
       icon: /* @__PURE__ */ import_react.default.createElement(import_icons.LinkOutlined, null)
+    },
+    {
+      key: "print-receipt",
+      label: import_utils.locales.getText("pisell2.text.print-receipt"),
+      icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-printer" })
     }
   ];
   const Toast = (0, import_useToast.default)();
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module" }, showCashPayment && /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-title" }, import_utils.locales.getText("pisell2.text.others")), /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-buttons-container" }, showCashPayment ? (
-    // Grid布局模式：两行布局（显示现金支付模块时）
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module" }, showCashPayment && /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-title" }, import_utils.locales.getText("pisell2.text.others")), /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-buttons-container" }, showCashPayment && !isFullWidth ? (
+    // Grid布局模式：两行布局（显示现金支付模块且非全宽时）
     /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-button-row" }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Button,
       {
@@ -83,18 +90,18 @@ function AdditionalModule({
       {
         className: "additional-module-button-base purple-theme",
         onClick: () => {
-          handleButtonClick("print-receipt");
+          handleButtonClick("split-payment");
         },
         icon: /* @__PURE__ */ import_react.default.createElement(
           import_materials.Icon,
           {
-            type: "pisell2-printer",
+            type: "pisell2-coins-01",
             className: "additional-module-button-icon"
           }
         ),
         size: "large"
       },
-      import_utils.locales.getText("pisell2.text.print-receipt")
+      import_utils.locales.getText("split.payment")
     )), /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-button-row" }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Button,
       {
@@ -126,7 +133,7 @@ function AdditionalModule({
         icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ClockCircleOutlined, { className: "additional-module-button-icon" })
       },
       import_utils.locales.getText("pisell2.text.save-pay-later")
-    ), /* @__PURE__ */ import_react.default.createElement(
+    ), showMore && /* @__PURE__ */ import_react.default.createElement(
       import_antd.Dropdown,
       {
         menu: {
@@ -143,6 +150,12 @@ function AdditionalModule({
                   )
                 );
               }
+            } else if (key === "print-receipt") {
+              handleButtonClick("print-receipt");
+            } else if (key === "split-payment") {
+              handleButtonClick("split-payment");
+            } else if (key === "print-receipt") {
+              handleButtonClick("print-receipt");
             }
           }
         },
@@ -163,9 +176,33 @@ function AdditionalModule({
           icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-dots-vertical", size: 20 })
         }
       )
+    )), !showMore && /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-button-row" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Button,
+      {
+        className: "additional-module-button-base purple-theme",
+        onClick: () => {
+          handleButtonClick("send-link");
+        },
+        disabled,
+        size: "large",
+        icon: /* @__PURE__ */ import_react.default.createElement(import_icons.LinkOutlined, null)
+      },
+      import_utils.locales.getText("pisell2.text.send-link")
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Button,
+      {
+        className: "additional-module-button-base purple-theme",
+        onClick: () => {
+          handleButtonClick("print-receipt");
+        },
+        disabled,
+        size: "large",
+        icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-printer" })
+      },
+      import_utils.locales.getText("pisell2.text.print-receipt")
     )))
   ) : (
-    // Flex布局模式：一行布局（不显示现金支付模块时）
+    // Flex布局模式：一行布局（不显示现金支付模块或强制全宽时）
     /* @__PURE__ */ import_react.default.createElement("div", { className: "additional-module-button-row" }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Button,
       {
@@ -189,18 +226,18 @@ function AdditionalModule({
       {
         className: "additional-module-button-base purple-theme",
         onClick: () => {
-          handleButtonClick("print-receipt");
+          handleButtonClick("split-payment");
         },
         size: "large",
         icon: /* @__PURE__ */ import_react.default.createElement(
           import_materials.Icon,
           {
-            type: "pisell2-printer",
+            type: "pisell2-coins-01",
             className: "additional-module-button-icon"
           }
         )
       },
-      import_utils.locales.getText("pisell2.text.print-receipt")
+      import_utils.locales.getText("split.payment")
     ), /* @__PURE__ */ import_react.default.createElement(
       import_antd.Button,
       {
@@ -247,6 +284,10 @@ function AdditionalModule({
                   )
                 );
               }
+            } else if (key === "split-payment") {
+              handleButtonClick("split-payment");
+            } else if (key === "print-receipt") {
+              handleButtonClick("print-receipt");
             }
           }
         },

package/lib/components/checkout/components/AmountSummary/index.js

@@ -42,7 +42,6 @@ var import_decimal = __toESM(require("decimal.js"));
 var import_locales = __toESM(require("../../locales"));
 var import_PaymentDetailModal = __toESM(require("../PaymentDetailModal"));
 var import_pisellSimplePriceKeyboardPopover = __toESM(require("../../../../pro/pisellSimplePriceKeyboardPopover"));
-var import_priceKeyboard = require("../../../../pro/priceKeyboard");
 var import_index = require("./index.less");
 var import_classnames = __toESM(require("classnames"));
 var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
@@ -365,12 +364,12 @@ function AmountSummary({
     let balanceAmountValue = parseFormattedAmount(getBalanceDueAmount());
     let balanceDecimal = new import_decimal.default(balanceAmountValue);
     const syncedVoucherAmount = paymentItems == null ? void 0 : paymentItems.reduce((acc, item) => {
-      if (item.isSynced && (paymentType === "regular" && item.order_payment_type !== "deposit" || paymentType === "deposit" && item.order_payment_type === "deposit")) {
+      if ((item.isSynced || item.voucher_id) && (paymentType === "regular" && item.order_payment_type !== "deposit" || paymentType === "deposit" && item.order_payment_type === "deposit")) {
         return acc.plus(item.amount).plus(Number(item.rounding_amount) > 0 ? 0 : item.rounding_amount || 0);
       }
       return acc;
     }, new import_decimal.default(0)).toNumber();
-    balanceDecimal = balanceDecimal.minus(syncedVoucherAmount);
+    balanceDecimal = new import_decimal.default(Math.abs(balanceDecimal.minus(new import_decimal.default(syncedVoucherAmount)).toNumber()));
     const finalBalanceAmount = (0, import_utils.formatAmountWithOptions)(
       balanceDecimal.toNumber(),
       amountSymbol,
@@ -467,8 +466,9 @@ function AmountSummary({
     return balanceDueAmount !== customAmount && Number(balanceDueAmount) > 0 && Number(customAmount) > 0;
   }, [customAmount, balanceDueAmount]);
   const handleChangeDepositAmount = (value) => {
-    console.log("handleChangeDepositAmount", value);
-    checkoutModule == null ? void 0 : checkoutModule.setDepositAmountAsync(value);
+    const valueStr = String(value);
+    console.log("handleChangeDepositAmount", valueStr);
+    checkoutModule == null ? void 0 : checkoutModule.setDepositAmountAsync(valueStr);
   };
   const hasDepositPayment = (0, import_react.useMemo)(() => {
     return paymentItems == null ? void 0 : paymentItems.some((item) => item.order_payment_type === "deposit" && item.status !== "voided");
@@ -594,47 +594,6 @@ function AmountSummary({
         ))
       )
     ),
-    !shouldShowConfirmMode() && (showCancelSplitPayment ? /* @__PURE__ */ import_react2.default.createElement(import_antd.Button, { className: (0, import_classnames.default)("cancel-split-payment-button"), onClick: () => onAmountChange == null ? void 0 : onAmountChange(balanceDueAmount) }, getText("split.cancel") || "取消部\n分支付") : /* @__PURE__ */ import_react2.default.createElement(
-      import_antd.Popover,
-      {
-        content: /* @__PURE__ */ import_react2.default.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react2.default.createElement(
-          import_priceKeyboard.PaymentKeyboard,
-          {
-            paymentOriginalValue: balanceDueAmount,
-            paymentDefaultValue: String(customAmount || 0),
-            enableExceedMaxAmount: false,
-            payment: {
-              enable: true
-            },
-            surcharge: {
-              enable: false
-            },
-            surchargeDefaultValue: {
-              percent: "0",
-              fixed: "0"
-            },
-            selectType: "light",
-            onChange: (value) => {
-              console.log(value);
-            },
-            doneText: getText("confirm"),
-            onPay: (args) => {
-              console.log(args);
-              setIsKeyboardVisible(false);
-              handleKeyboardConfirm(args.amount);
-            }
-          }
-        )),
-        trigger: "click",
-        open: isKeyboardVisible,
-        onOpenChange: setIsKeyboardVisible,
-        placement: "bottom",
-        overlayClassName: "payment-keyboard-popover",
-        arrow: true,
-        destroyTooltipOnHide: true
-      },
-      /* @__PURE__ */ import_react2.default.createElement(import_antd.Button, { className: (0, import_classnames.default)("split-payment-button") }, getText("split.payment") || "拆分支付")
-    )),
     /* @__PURE__ */ import_react2.default.createElement(
       import_materials.PisellModal,
       {

package/lib/components/checkout/components/AmountSummary/index.less

@@ -226,7 +226,7 @@
     border-radius: 16px;
     padding: 0 16px 0 16px;
     color: #1a1a1a;
-    width: 350px;
+    width: 400px;
     min-width: 200px;
     height: 80px;
     display: flex;
@@ -248,7 +248,6 @@
 
   .balance-due-label {
     font-size: 16px;
-    color: #7f56da;
     font-weight: 400;
     line-height: 1.5;
     margin-bottom: 4px;
@@ -256,7 +255,7 @@
 
   .balance-due-amount {
     font-size: 14px;
-    font-weight: 400;
+    font-weight: 600;
     color: #7f56da;
     line-height: 0.75;
     text-decoration: underline;
@@ -272,13 +271,13 @@
   .pay-text {
     font-size: 16px;
     font-weight: 500;
-    color: #7f56da;
     letter-spacing: 0.09375em;
+    margin-top: 12px;
   }
 
   .pay-amount {
-    font-size: 32px;
-    font-weight: 400;
+    font-size: 36px;
+    font-weight: 600;
     color: #1e1830;
     line-height: 0.75;
   }

package/lib/components/checkout/components/CashPaymentModule/index.d.ts

@@ -15,10 +15,12 @@ export interface CashPaymentModuleProps {
     balanceDueAmount?: string;
     balanceDueTotalAmount?: string;
     syncingLock?: boolean;
+    shortcutsSize?: 'default' | 'large';
 }
 export declare function CashPaymentModule({ amountSymbol, orderInfo, onPaymentComplete, customAmount, amountButtons, // 按钮列表，默认5个推荐金额
 disabled, // 禁用状态
 roundingFunction, balanceDueAmount, // 当前阶段剩余支付金额（定金或普通支付）
 balanceDueTotalAmount, // 完整订单剩余待付金额
-syncingLock, }: CashPaymentModuleProps): React.JSX.Element;
+syncingLock, // 是否锁定
+shortcutsSize, }: CashPaymentModuleProps): React.JSX.Element;
 export default CashPaymentModule;

package/lib/components/checkout/components/CashPaymentModule/index.js

@@ -55,8 +55,10 @@ function CashPaymentModule({
   // 当前阶段剩余支付金额（定金或普通支付）
   balanceDueTotalAmount = "0",
   // 完整订单剩余待付金额
-  syncingLock = false
+  syncingLock = false,
   // 是否锁定
+  shortcutsSize = "default"
+  // 预设大小
 }) {
   const [amount, setAmount] = (0, import_react.useState)(customAmount || "");
   const [roundingAmount, setRoundingAmount] = (0, import_react.useState)(0);
@@ -231,7 +233,8 @@ function CashPaymentModule({
         };
       }),
       onReset: handleReset,
-      onEnter: syncingLock ? void 0 : handleCashPay
+      onEnter: syncingLock ? void 0 : handleCashPay,
+      shortcutsSize
     }
   );
 }

package/lib/components/checkout/components/PaymentDetailModal/index.js

@@ -120,7 +120,7 @@ function PaymentDetailModal({
       hideDecimalForWholeNumbers: false,
       useThousandsSeparator: true,
       showCurrencySymbol: true
-    }))), depositPayments.map((item) => /* @__PURE__ */ import_react.default.createElement("div", { key: item.uuid, className: (0, import_classnames.default)("payment-item") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-bullet") }), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-content") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-text") }, item.name, " - ", (/* @__PURE__ */ new Date()).toLocaleDateString(), " ", getText("pisell2.checkout.payment-detail.by") || "by", " ", getCustomerInfo().nickname), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-actions") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-amount") }, "-", (0, import_utils.formatAmountWithOptions)(
+    }))), depositPayments.map((item) => /* @__PURE__ */ import_react.default.createElement("div", { key: item.uuid, className: (0, import_classnames.default)("payment-item") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-bullet") }), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-content") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-text") }, item.name, " - ", item.created_at || (/* @__PURE__ */ new Date()).toLocaleDateString(), " ", getText("pisell2.checkout.payment-detail.by") || "by", " ", getCustomerInfo().nickname), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-actions") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-amount") }, "-", (0, import_utils.formatAmountWithOptions)(
       new import_decimal.default(Math.abs(item.amount)).plus(new import_decimal.default(Number(item.rounding_amount) > 0 ? 0 : item.rounding_amount || 0)).toNumber(),
       amountSymbol,
       {
@@ -142,7 +142,7 @@ function PaymentDetailModal({
       hideDecimalForWholeNumbers: false,
       useThousandsSeparator: true,
       showCurrencySymbol: true
-    }))), regularPayments.map((item) => /* @__PURE__ */ import_react.default.createElement("div", { key: item.uuid, className: (0, import_classnames.default)("payment-item") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-bullet") }), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-content") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-text") }, item.name, " - ", (/* @__PURE__ */ new Date()).toLocaleDateString(), " ", getText("pisell2.checkout.payment-detail.by") || "by", " ", getCustomerInfo().nickname), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-actions") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-amount") }, "-", (0, import_utils.formatAmountWithOptions)(
+    }))), regularPayments.map((item) => /* @__PURE__ */ import_react.default.createElement("div", { key: item.uuid, className: (0, import_classnames.default)("payment-item") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-bullet") }), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-content") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-text") }, item.name, " - ", item.created_at || (/* @__PURE__ */ new Date()).toLocaleDateString(), " ", getText("pisell2.checkout.payment-detail.by") || "by", " ", getCustomerInfo().nickname), /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-actions") }, /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("payment-item-amount") }, "-", (0, import_utils.formatAmountWithOptions)(
       new import_decimal.default(Math.abs(item.amount)).plus(new import_decimal.default(Number(item.rounding_amount) > 0 ? 0 : item.rounding_amount || 0)).toNumber(),
       amountSymbol,
       {

package/lib/components/checkout/components/PaymentOptionsModule/PaymentMethodItem.d.ts

@@ -24,6 +24,8 @@ export interface PaymentMethodItemProps {
     onClick?: (method: ExtendedPaymentMethod) => void;
     /** 获取文本的函数 */
     getText?: (key: string, fallback?: string) => string;
+    /** 大小 */
+    size?: 'default' | 'large';
 }
 declare const PaymentMethodItem: React.FC<PaymentMethodItemProps>;
 export default PaymentMethodItem;

package/lib/components/checkout/components/PaymentOptionsModule/PaymentMethodItem.js

@@ -45,7 +45,8 @@ var PaymentMethodItem = ({
   customAmount,
   disabled = false,
   onClick,
-  getText
+  getText,
+  size = "default"
 }) => {
   const [isKeyboardVisible, setIsKeyboardVisible] = (0, import_react.useState)(false);
   const calculateSurcharge = (method2) => {
@@ -100,6 +101,9 @@ var PaymentMethodItem = ({
           "payment-options-module-disabled": disabled
         }
       ),
+      style: {
+        height: size === "large" ? "82px" : "62px"
+      },
       onClick: showKeyboard,
       type: "button",
       disabled

package/lib/components/checkout/components/PaymentOptionsModule/index.d.ts

@@ -11,5 +11,6 @@ interface ExtendedPaymentOptionsModuleProps extends PaymentOptionsModuleProps {
     disabled?: boolean;
     showCashPayment?: boolean;
 }
+export declare const SHOW_METHODS_CODE: string[];
 declare function PaymentOptionsModule({ amountSymbol, orderInfo, onClick, paymentMethods, customAmount, title, disabled, showCashPayment, }: ExtendedPaymentOptionsModuleProps): React.JSX.Element;
 export default PaymentOptionsModule;

package/lib/components/checkout/components/PaymentOptionsModule/index.js

@@ -29,6 +29,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/components/checkout/components/PaymentOptionsModule/index.tsx
 var PaymentOptionsModule_exports = {};
 __export(PaymentOptionsModule_exports, {
+  SHOW_METHODS_CODE: () => SHOW_METHODS_CODE,
   default: () => PaymentOptionsModule_default
 });
 module.exports = __toCommonJS(PaymentOptionsModule_exports);
@@ -125,6 +126,7 @@ function PaymentOptionsModule({
       filteredPaymentMethods.map((method) => /* @__PURE__ */ import_react.default.createElement(
         import_PaymentMethodItem.default,
         {
+          size: (filteredPaymentMethods == null ? void 0 : filteredPaymentMethods.length) === 2 ? "large" : "default",
           key: method.id,
           method,
           amountSymbol,
@@ -138,3 +140,7 @@ function PaymentOptionsModule({
   );
 }
 var PaymentOptionsModule_default = PaymentOptionsModule;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SHOW_METHODS_CODE
+});

package/lib/components/checkout/components/PaymentOptionsModule/index.less

@@ -234,6 +234,10 @@
 }
 
 .payment-options-module-pay-button{
+  width: 118px;
+  height: 40px;
+  font-weight: 600;
+  font-size: 18px;
   background: var(--theme-color, #7F56DA);
   &:disabled {
     background: #D0D5DD;

package/lib/components/checkout/components/PaymentResultToast/PaymentResultToastProvider.d.ts

@@ -23,6 +23,10 @@ interface ShowPaymentResultToastConfig {
     onClose?: () => void;
     /** 是否显示右上角关闭按钮 */
     closable?: boolean;
+    /** 是否启用点击外部区域关闭弹窗（使用纯JS实现） */
+    clickOutsideToClose?: boolean;
+    /** 是否显示遮罩 */
+    mask?: boolean;
 }
 interface PaymentResultToastContextType {
     /** 显示成功弹窗 */

package/lib/components/checkout/components/PaymentResultToast/PaymentResultToastProvider.js

@@ -205,6 +205,10 @@ var GlobalToastManager = class {
       instance.offsetIndex = index;
       const bottomPosition = this.calculateBottomPosition(index, totalCount);
       if (instance.container) {
+        const hasMask = instance.container.getAttribute("data-mask") === "true";
+        if (hasMask) {
+          return;
+        }
         instance.container.classList.add("toast-moving");
         instance.container.style.position = "fixed";
         instance.container.style.left = `${this.LEFT_OFFSET}px`;
@@ -240,22 +244,36 @@ var GlobalToastManager = class {
       autoClose: config.autoClose,
       autoCloseDelay: config.autoCloseDelay || 30,
       showCountdownProgress: config.showCountdownProgress,
+      clickOutsideToClose: config.clickOutsideToClose,
       onCountdownComplete: config.onCountdownComplete,
       onClose: () => {
         var _a;
         (_a = config.onClose) == null ? void 0 : _a.call(config);
         this.removeToast(id);
       },
-      closable: config.closable !== void 0 ? config.closable : DEFAULT_TOAST_CONFIG.closable
+      closable: config.closable !== void 0 ? config.closable : DEFAULT_TOAST_CONFIG.closable,
+      mask: config.mask || false
     };
     const container = document.createElement("div");
     container.setAttribute("data-toast-id", id);
+    if (config.mask) {
+      container.setAttribute("data-mask", "true");
+    }
     const dynamicBottomOffset = this.calculateAndCacheBottomOffset();
     container.style.position = "fixed";
-    container.style.left = `${this.LEFT_OFFSET}px`;
-    container.style.bottom = `${dynamicBottomOffset}px`;
-    container.style.top = "auto";
-    container.style.right = "auto";
+    if (config.mask) {
+      container.style.left = "50%";
+      container.style.top = "50%";
+      container.style.transform = "translate(-50%, -50%)";
+      container.style.bottom = "auto";
+      container.style.right = "auto";
+    } else {
+      container.style.left = `${this.LEFT_OFFSET}px`;
+      container.style.bottom = `${dynamicBottomOffset}px`;
+      container.style.top = "auto";
+      container.style.right = "auto";
+      container.style.transform = "none";
+    }
     container.style.pointerEvents = "none";
     container.style.width = "auto";
     container.style.height = "auto";

package/lib/components/checkout/components/PaymentResultToast/index.js

@@ -225,8 +225,8 @@ var PaymentResultToast = (0, import_react.memo)((props) => {
       mask,
       maskClosable,
       closable: false,
-      className: getBaseClassName(`${className} ${statusClassName}`),
-      wrapClassName: "toast-modal-wrap",
+      className: getBaseClassName(`${className} ${statusClassName} ${mask ? "payment-result-toast-with-mask" : ""}`),
+      wrapClassName: `toast-modal-wrap ${mask ? "toast-modal-wrap-with-mask" : ""}`,
       style: {
         ...height ? { height: `${height}px` } : {},
         // 确保Modal不会被默认定位影响
@@ -246,8 +246,8 @@ var PaymentResultToast = (0, import_react.memo)((props) => {
       focusTriggerAfterClose: false,
       transitionName: "",
       maskTransitionName: "",
-      centered: false,
-      getContainer: false
+      centered: mask,
+      getContainer: mask ? void 0 : false
     },
     /* @__PURE__ */ import_react.default.createElement(
       "div",