@blocklet/payment-react 1.19.5 → 1.19.7

package/es/payment/form/index.js

@@ -215,8 +215,6 @@ export default function PaymentForm({
   }, [session?.user, checkoutSession.phone_number_collection?.enabled]);
   const paymentMethod = useWatch({ control, name: "payment_method" });
   const paymentCurrencyId = useWatch({ control, name: "payment_currency" });
-  const customerName = useWatch({ control, name: "customer_name" });
-  const customerEmail = useWatch({ control, name: "customer_email" });
   const afterUserLoggedIn = useMemoizedFn(() => {
     handleSubmit(onFormSubmit, onFormError)();
   });
@@ -250,11 +248,11 @@ export default function PaymentForm({
     if (mode === "required") {
       return true;
     }
-    if (customerName && customerEmail) {
+    if (session?.user?.fullName && session?.user?.email) {
       return false;
     }
     return true;
-  }, [session?.user, method, checkoutSession, customerName, customerEmail]);
+  }, [session?.user, method, checkoutSession]);
   const handleConnected = async () => {
     setState({ paying: true });
     try {

package/es/payment/product-item.js

@@ -8,6 +8,7 @@ import Switch from "../components/switch-button.js";
 import {
   findCurrency,
   formatLineItemPricing,
+  formatNumber,
   formatPrice,
   formatQuantityInventory,
   formatRecurring,
@@ -46,7 +47,7 @@ export default function ProductItem({
   const canAdjustQuantity = adjustableQuantity.enabled && mode === "normal";
   const minQuantity = Math.max(adjustableQuantity.minimum || 1, 1);
   const quantityAvailable = Math.min(item.price.quantity_limit_per_checkout, item.price.quantity_available);
-  const maxQuantity = Math.min(adjustableQuantity.maximum || 999, quantityAvailable || 999);
+  const maxQuantity = quantityAvailable ? Math.min(adjustableQuantity.maximum || Infinity, quantityAvailable) : adjustableQuantity.maximum || Infinity;
   const handleQuantityChange = (newQuantity) => {
     if (newQuantity >= minQuantity && newQuantity <= maxQuantity) {
       setLocalQuantity(newQuantity);
@@ -75,7 +76,7 @@ export default function ProductItem({
   const formatCreditInfo = () => {
     if (!isCreditProduct) return null;
     const isRecurring = item.price.type === "recurring";
-    const totalCredit = creditAmount * localQuantity;
+    const totalCredit = formatNumber(creditAmount * localQuantity);
     let message = "";
     if (isRecurring) {
       message = t("payment.checkout.credit.recurringInfo", {
@@ -225,7 +226,6 @@ export default function ProductItem({
                         size: "small",
                         value: localQuantity,
                         onChange: handleQuantityInputChange,
-                        sx: { width: 60 },
                         type: "number",
                         slotProps: {
                           htmlInput: {

package/es/theme/index.js

@@ -195,7 +195,6 @@ export function PaymentThemeProvider({
           MuiRadio: {
             styleOverrides: {
               root: {
-                color: palette.grey[200],
                 "&:hover": {
                   background: "none"
                 },

package/lib/payment/form/index.js

@@ -246,14 +246,6 @@ function PaymentForm({
     control,
     name: "payment_currency"
   });
-  const customerName = (0, _reactHookForm.useWatch)({
-    control,
-    name: "customer_name"
-  });
-  const customerEmail = (0, _reactHookForm.useWatch)({
-    control,
-    name: "customer_email"
-  });
   const afterUserLoggedIn = (0, _ahooks.useMemoizedFn)(() => {
     handleSubmit(onFormSubmit, onFormError)();
   });
@@ -289,11 +281,11 @@ function PaymentForm({
     if (mode === "required") {
       return true;
     }
-    if (customerName && customerEmail) {
+    if (session?.user?.fullName && session?.user?.email) {
       return false;
     }
     return true;
-  }, [session?.user, method, checkoutSession, customerName, customerEmail]);
+  }, [session?.user, method, checkoutSession]);
   const handleConnected = async () => {
     setState({
       paying: true

package/lib/payment/product-item.js

@@ -55,7 +55,7 @@ function ProductItem({
   const canAdjustQuantity = adjustableQuantity.enabled && mode === "normal";
   const minQuantity = Math.max(adjustableQuantity.minimum || 1, 1);
   const quantityAvailable = Math.min(item.price.quantity_limit_per_checkout, item.price.quantity_available);
-  const maxQuantity = Math.min(adjustableQuantity.maximum || 999, quantityAvailable || 999);
+  const maxQuantity = quantityAvailable ? Math.min(adjustableQuantity.maximum || Infinity, quantityAvailable) : adjustableQuantity.maximum || Infinity;
   const handleQuantityChange = newQuantity => {
     if (newQuantity >= minQuantity && newQuantity <= maxQuantity) {
       setLocalQuantity(newQuantity);
@@ -84,7 +84,7 @@ function ProductItem({
   const formatCreditInfo = () => {
     if (!isCreditProduct) return null;
     const isRecurring = item.price.type === "recurring";
-    const totalCredit = creditAmount * localQuantity;
+    const totalCredit = (0, _util.formatNumber)(creditAmount * localQuantity);
     let message = "";
     if (isRecurring) {
       message = t("payment.checkout.credit.recurringInfo", {
@@ -216,9 +216,6 @@ function ProductItem({
             size: "small",
             value: localQuantity,
             onChange: handleQuantityInputChange,
-            sx: {
-              width: 60
-            },
             type: "number",
             slotProps: {
               htmlInput: {

package/lib/theme/index.js

@@ -211,7 +211,6 @@ function PaymentThemeProvider({
         MuiRadio: {
           styleOverrides: {
             root: {
-              color: palette.grey[200],
               "&:hover": {
                 background: "none"
               },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/payment-react",
-  "version": "1.19.5",
+  "version": "1.19.7",
   "description": "Reusable react components for payment kit v2",
   "keywords": [
     "react",
@@ -54,16 +54,16 @@
     }
   },
   "dependencies": {
-    "@arcblock/did-connect": "^3.0.26",
-    "@arcblock/ux": "^3.0.26",
-    "@arcblock/ws": "^1.20.15",
-    "@blocklet/theme": "^3.0.26",
-    "@blocklet/ui-react": "^3.0.26",
+    "@arcblock/did-connect": "^3.0.32",
+    "@arcblock/ux": "^3.0.32",
+    "@arcblock/ws": "^1.21.0",
+    "@blocklet/theme": "^3.0.32",
+    "@blocklet/ui-react": "^3.0.32",
     "@mui/icons-material": "^7.1.2",
     "@mui/lab": "7.0.0-beta.14",
     "@mui/material": "^7.1.2",
     "@mui/system": "^7.1.1",
-    "@ocap/util": "^1.20.15",
+    "@ocap/util": "^1.21.0",
     "@stripe/react-stripe-js": "^2.9.0",
     "@stripe/stripe-js": "^2.4.0",
     "@vitejs/plugin-legacy": "^7.0.0",
@@ -94,7 +94,7 @@
     "@babel/core": "^7.27.4",
     "@babel/preset-env": "^7.27.2",
     "@babel/preset-react": "^7.27.1",
-    "@blocklet/payment-types": "1.19.5",
+    "@blocklet/payment-types": "1.19.7",
     "@storybook/addon-essentials": "^7.6.20",
     "@storybook/addon-interactions": "^7.6.20",
     "@storybook/addon-links": "^7.6.20",
@@ -125,5 +125,5 @@
     "vite-plugin-babel": "^1.3.1",
     "vite-plugin-node-polyfills": "^0.23.0"
   },
-  "gitHead": "b2cb3888b7efa2cc71591f75240616c36e945b09"
+  "gitHead": "83b0e5ac23d05e12d07929789f06f85b30929169"
 }

package/src/payment/form/index.tsx

@@ -315,9 +315,6 @@ export default function PaymentForm({
 
   const paymentMethod = useWatch({ control, name: 'payment_method' });
   const paymentCurrencyId = useWatch({ control, name: 'payment_currency' });
-  const customerName = useWatch({ control, name: 'customer_name' });
-  const customerEmail = useWatch({ control, name: 'customer_email' });
-
   // const domSize = useSize(document.body);
 
   // const isColumnLayout = useCreation(() => {
@@ -365,11 +362,11 @@ export default function PaymentForm({
     if (mode === 'required') {
       return true;
     }
-    if (customerName && customerEmail) {
+    if (session?.user?.fullName && session?.user?.email) {
       return false;
     }
     return true;
-  }, [session?.user, method, checkoutSession, customerName, customerEmail]);
+  }, [session?.user, method, checkoutSession]);
 
   const handleConnected = async () => {
     setState({ paying: true });

package/src/payment/product-item.tsx

@@ -9,6 +9,7 @@ import Switch from '../components/switch-button';
 import {
   findCurrency,
   formatLineItemPricing,
+  formatNumber,
   formatPrice,
   formatQuantityInventory,
   formatRecurring,
@@ -71,7 +72,9 @@ export default function ProductItem({
   const canAdjustQuantity = adjustableQuantity.enabled && mode === 'normal';
   const minQuantity = Math.max(adjustableQuantity.minimum || 1, 1);
   const quantityAvailable = Math.min(item.price.quantity_limit_per_checkout, item.price.quantity_available);
-  const maxQuantity = Math.min(adjustableQuantity.maximum || 999, quantityAvailable || 999);
+  const maxQuantity = quantityAvailable
+    ? Math.min(adjustableQuantity.maximum || Infinity, quantityAvailable)
+    : adjustableQuantity.maximum || Infinity;
 
   const handleQuantityChange = (newQuantity: number) => {
     if (newQuantity >= minQuantity && newQuantity <= maxQuantity) {
@@ -107,7 +110,7 @@ export default function ProductItem({
     if (!isCreditProduct) return null;
 
     const isRecurring = item.price.type === 'recurring';
-    const totalCredit = creditAmount * localQuantity;
+    const totalCredit = formatNumber(creditAmount * localQuantity);
 
     let message = '';
     if (isRecurring) {
@@ -240,7 +243,6 @@ export default function ProductItem({
                 size="small"
                 value={localQuantity}
                 onChange={handleQuantityInputChange}
-                sx={{ width: 60 }}
                 type="number"
                 slotProps={{
                   htmlInput: {

package/src/theme/index.tsx

@@ -208,7 +208,6 @@ export function PaymentThemeProvider({
           MuiRadio: {
             styleOverrides: {
               root: {
-                color: palette.grey[200],
                 '&:hover': {
                   background: 'none',
                 },