@windrun-huaiin/third-ui 7.5.3 → 7.6.0

package/dist/main/money-price/money-price-interactive.js

@@ -17,17 +17,30 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
     const fingerprintContext = fingerprintProvider.useFingerprintContextSafe();
     const { redirectToSignIn, user } = nextjs.useClerk();
     const router = navigation.useRouter();
-    // 根据用户订阅状态确定初始 billing type
-    const getInitialBillingType = React.useCallback(() => {
+    const [billingType, setBillingType] = React.useState(() => {
         var _a;
-        // 如果用户有活跃订阅，使用订阅的计费周期
+        // 懒初始化：只在组件首次渲染时计算一次
+        // 如果用户有活跃订阅，通过 priceId 精确匹配计费周期
         if (((_a = fingerprintContext === null || fingerprintContext === void 0 ? void 0 : fingerprintContext.xSubscription) === null || _a === void 0 ? void 0 : _a.status) === 'active' && fingerprintContext.xSubscription.priceId) {
-            return fingerprintContext.xSubscription.priceId.includes('yearly') ? 'yearly' : 'monthly';
+            const userPriceId = fingerprintContext.xSubscription.priceId;
+            const providerConfig = moneyPriceConfigUtil.getActiveProviderConfig(config);
+            // 检查所有年付计划的 priceId
+            const yearlyPriceIds = [
+                providerConfig.products.free.plans.yearly.priceId,
+                providerConfig.products.pro.plans.yearly.priceId,
+                providerConfig.products.ultra.plans.yearly.priceId
+            ];
+            // 如果匹配到年付计划，返回 yearly，否则返回 monthly
+            if (yearlyPriceIds.includes(userPriceId)) {
+                return 'yearly';
+            }
+            else {
+                return 'monthly';
+            }
         }
         // 否则使用默认值
         return data.billingSwitch.defaultKey;
-    }, [fingerprintContext, data.billingSwitch.defaultKey]);
-    const [billingType, setBillingType] = React.useState(getInitialBillingType());
+    });
     const [isProcessing, setIsProcessing] = React.useState(false);
     const [tooltip, setTooltip] = React.useState({ show: false, content: '', x: 0, y: 0 });
     // 确定用户状态
@@ -220,19 +233,6 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
     }, []);
     // State for button portals
     const [buttonPortals, setButtonPortals] = React.useState([]);
-    // 当 fingerprint context 变化时，更新 billing type 以匹配用户的订阅状态
-    React.useEffect(() => {
-        const newBillingType = getInitialBillingType();
-        if (newBillingType !== billingType) {
-            setBillingType(newBillingType);
-            // 延迟执行以确保 DOM 已渲染
-            setTimeout(() => {
-                updatePriceDisplay(newBillingType);
-                updateButtonStyles(newBillingType);
-                updateDiscountInfo(newBillingType);
-            }, 0);
-        }
-    }, [fingerprintContext, getInitialBillingType, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo]);
     // 处理月付/年付切换和 tooltip 功能
     React.useEffect(() => {
         const monthlyButton = document.querySelector('[data-billing-button="monthly"]');
@@ -286,10 +286,6 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
                 }
             });
         });
-        // Initial updates
-        updatePriceDisplay(billingType);
-        updateDiscountInfo(billingType);
-        updateButtonStyles(billingType);
         return () => {
             if (monthlyButton) {
                 monthlyButton.removeEventListener('click', handleMonthlyClick);
@@ -303,7 +299,28 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
                 element.removeEventListener('mouseleave', handlers.mouseleave);
             });
         };
-    }, [data, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+    }, [data, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+    // 单独的 effect 用于初始更新，只在组件挂载时执行一次
+    React.useEffect(() => {
+        // 直接在这里重新计算，避免闭包问题
+        const initialBillingType = (() => {
+            var _a;
+            if (((_a = fingerprintContext === null || fingerprintContext === void 0 ? void 0 : fingerprintContext.xSubscription) === null || _a === void 0 ? void 0 : _a.status) === 'active' && fingerprintContext.xSubscription.priceId) {
+                const userPriceId = fingerprintContext.xSubscription.priceId;
+                const providerConfig = moneyPriceConfigUtil.getActiveProviderConfig(config);
+                const yearlyPriceIds = [
+                    providerConfig.products.free.plans.yearly.priceId,
+                    providerConfig.products.pro.plans.yearly.priceId,
+                    providerConfig.products.ultra.plans.yearly.priceId
+                ];
+                return yearlyPriceIds.includes(userPriceId) ? 'yearly' : 'monthly';
+            }
+            return data.billingSwitch.defaultKey;
+        })();
+        updatePriceDisplay(initialBillingType);
+        updateDiscountInfo(initialBillingType);
+        updateButtonStyles(initialBillingType);
+    }, []); // 空依赖数组，只执行一次
     // Create button portals after component mounts
     React.useEffect(() => {
         const portals = [];

package/dist/main/money-price/money-price-interactive.mjs

@@ -2,7 +2,7 @@
 import { __awaiter } from '../../node_modules/.pnpm/@rollup_plugin-typescript@12.1.4_rollup@4.46.2_tslib@2.8.1_typescript@5.9.2/node_modules/tslib/tslib.es6.mjs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useClerk } from '@clerk/nextjs';
-import { useCallback, useState, useMemo, useEffect } from 'react';
+import { useState, useCallback, useMemo, useEffect } from 'react';
 import { useFingerprintContextSafe } from '../../clerk/fingerprint/fingerprint-provider.mjs';
 import { cn } from '@windrun-huaiin/lib/utils';
 import { useRouter } from 'next/navigation';
@@ -15,17 +15,30 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
     const fingerprintContext = useFingerprintContextSafe();
     const { redirectToSignIn, user } = useClerk();
     const router = useRouter();
-    // 根据用户订阅状态确定初始 billing type
-    const getInitialBillingType = useCallback(() => {
+    const [billingType, setBillingType] = useState(() => {
         var _a;
-        // 如果用户有活跃订阅，使用订阅的计费周期
+        // 懒初始化：只在组件首次渲染时计算一次
+        // 如果用户有活跃订阅，通过 priceId 精确匹配计费周期
         if (((_a = fingerprintContext === null || fingerprintContext === void 0 ? void 0 : fingerprintContext.xSubscription) === null || _a === void 0 ? void 0 : _a.status) === 'active' && fingerprintContext.xSubscription.priceId) {
-            return fingerprintContext.xSubscription.priceId.includes('yearly') ? 'yearly' : 'monthly';
+            const userPriceId = fingerprintContext.xSubscription.priceId;
+            const providerConfig = getActiveProviderConfig(config);
+            // 检查所有年付计划的 priceId
+            const yearlyPriceIds = [
+                providerConfig.products.free.plans.yearly.priceId,
+                providerConfig.products.pro.plans.yearly.priceId,
+                providerConfig.products.ultra.plans.yearly.priceId
+            ];
+            // 如果匹配到年付计划，返回 yearly，否则返回 monthly
+            if (yearlyPriceIds.includes(userPriceId)) {
+                return 'yearly';
+            }
+            else {
+                return 'monthly';
+            }
         }
         // 否则使用默认值
         return data.billingSwitch.defaultKey;
-    }, [fingerprintContext, data.billingSwitch.defaultKey]);
-    const [billingType, setBillingType] = useState(getInitialBillingType());
+    });
     const [isProcessing, setIsProcessing] = useState(false);
     const [tooltip, setTooltip] = useState({ show: false, content: '', x: 0, y: 0 });
     // 确定用户状态
@@ -218,19 +231,6 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
     }, []);
     // State for button portals
     const [buttonPortals, setButtonPortals] = useState([]);
-    // 当 fingerprint context 变化时，更新 billing type 以匹配用户的订阅状态
-    useEffect(() => {
-        const newBillingType = getInitialBillingType();
-        if (newBillingType !== billingType) {
-            setBillingType(newBillingType);
-            // 延迟执行以确保 DOM 已渲染
-            setTimeout(() => {
-                updatePriceDisplay(newBillingType);
-                updateButtonStyles(newBillingType);
-                updateDiscountInfo(newBillingType);
-            }, 0);
-        }
-    }, [fingerprintContext, getInitialBillingType, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo]);
     // 处理月付/年付切换和 tooltip 功能
     useEffect(() => {
         const monthlyButton = document.querySelector('[data-billing-button="monthly"]');
@@ -284,10 +284,6 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
                 }
             });
         });
-        // Initial updates
-        updatePriceDisplay(billingType);
-        updateDiscountInfo(billingType);
-        updateButtonStyles(billingType);
         return () => {
             if (monthlyButton) {
                 monthlyButton.removeEventListener('click', handleMonthlyClick);
@@ -301,7 +297,28 @@ function MoneyPriceInteractive({ data, config, upgradeApiEndpoint, signInPath })
                 element.removeEventListener('mouseleave', handlers.mouseleave);
             });
         };
-    }, [data, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+    }, [data, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+    // 单独的 effect 用于初始更新，只在组件挂载时执行一次
+    useEffect(() => {
+        // 直接在这里重新计算，避免闭包问题
+        const initialBillingType = (() => {
+            var _a;
+            if (((_a = fingerprintContext === null || fingerprintContext === void 0 ? void 0 : fingerprintContext.xSubscription) === null || _a === void 0 ? void 0 : _a.status) === 'active' && fingerprintContext.xSubscription.priceId) {
+                const userPriceId = fingerprintContext.xSubscription.priceId;
+                const providerConfig = getActiveProviderConfig(config);
+                const yearlyPriceIds = [
+                    providerConfig.products.free.plans.yearly.priceId,
+                    providerConfig.products.pro.plans.yearly.priceId,
+                    providerConfig.products.ultra.plans.yearly.priceId
+                ];
+                return yearlyPriceIds.includes(userPriceId) ? 'yearly' : 'monthly';
+            }
+            return data.billingSwitch.defaultKey;
+        })();
+        updatePriceDisplay(initialBillingType);
+        updateDiscountInfo(initialBillingType);
+        updateButtonStyles(initialBillingType);
+    }, []); // 空依赖数组，只执行一次
     // Create button portals after component mounts
     useEffect(() => {
         const portals = [];

package/dist/node_modules/.pnpm/cose-base@1.0.3/node_modules/cose-base/cose-base.mjs

@@ -1,4 +1,4 @@
-import { __module as coseBase$1 } from '../../../../../_virtual/cose-base.mjs';
+import { __module as coseBase$1 } from '../../../../../_virtual/cose-base2.mjs';
 import { __require as requireLayoutBase } from '../../../layout-base@1.0.2/node_modules/layout-base/layout-base.mjs';
 
 var coseBase = coseBase$1.exports;

package/dist/node_modules/.pnpm/cose-base@2.2.0/node_modules/cose-base/cose-base.mjs

@@ -1,4 +1,4 @@
-import { __module as coseBase$1 } from '../../../../../_virtual/cose-base2.mjs';
+import { __module as coseBase$1 } from '../../../../../_virtual/cose-base.mjs';
 import { __require as requireLayoutBase } from '../../../layout-base@2.0.1/node_modules/layout-base/layout-base.mjs';
 
 var coseBase = coseBase$1.exports;

package/dist/node_modules/.pnpm/layout-base@1.0.2/node_modules/layout-base/layout-base.mjs

@@ -1,4 +1,4 @@
-import { __module as layoutBase$1 } from '../../../../../_virtual/layout-base.mjs';
+import { __module as layoutBase$1 } from '../../../../../_virtual/layout-base2.mjs';
 
 var layoutBase = layoutBase$1.exports;
 

package/dist/node_modules/.pnpm/layout-base@2.0.1/node_modules/layout-base/layout-base.mjs

@@ -1,4 +1,4 @@
-import { __module as layoutBase$1 } from '../../../../../_virtual/layout-base2.mjs';
+import { __module as layoutBase$1 } from '../../../../../_virtual/layout-base.mjs';
 
 var layoutBase = layoutBase$1.exports;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@windrun-huaiin/third-ui",
-  "version": "7.5.3",
+  "version": "7.6.0",
   "description": "Third-party integrated UI components for windrun-huaiin projects",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/main/money-price/money-price-interactive.tsx

@@ -328,11 +328,6 @@ export function MoneyPriceInteractive({
       });
     });
 
-    // Initial updates
-    updatePriceDisplay(billingType);
-    updateDiscountInfo(billingType);
-    updateButtonStyles(billingType);
-
     return () => {
       if (monthlyButton) {
         monthlyButton.removeEventListener('click', handleMonthlyClick);
@@ -347,7 +342,31 @@ export function MoneyPriceInteractive({
         element.removeEventListener('mouseleave', handlers.mouseleave);
       });
     };
-  }, [data, billingType, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+  }, [data, updatePriceDisplay, updateButtonStyles, updateDiscountInfo, userContext, handleLogin, handleUpgrade, isProcessing]);
+
+  // 单独的 effect 用于初始更新，只在组件挂载时执行一次
+  useEffect(() => {
+    // 直接在这里重新计算，避免闭包问题
+    const initialBillingType = (() => {
+      if (fingerprintContext?.xSubscription?.status === 'active' && fingerprintContext.xSubscription.priceId) {
+        const userPriceId = fingerprintContext.xSubscription.priceId;
+        const providerConfig = getActiveProviderConfig(config);
+        
+        const yearlyPriceIds = [
+          providerConfig.products.free.plans.yearly.priceId,
+          providerConfig.products.pro.plans.yearly.priceId,
+          providerConfig.products.ultra.plans.yearly.priceId
+        ];
+        
+        return yearlyPriceIds.includes(userPriceId) ? 'yearly' : 'monthly';
+      }
+      return data.billingSwitch.defaultKey as 'monthly' | 'yearly';
+    })();
+    
+    updatePriceDisplay(initialBillingType);
+    updateDiscountInfo(initialBillingType);
+    updateButtonStyles(initialBillingType);
+  }, []); // 空依赖数组，只执行一次
 
   // Create button portals after component mounts
   useEffect(() => {