@windrun-huaiin/third-ui 27.0.0 → 28.0.0

package/dist/lib/seo-metadata.mjs

@@ -1,6 +1,6 @@
 import { __awaiter } from 'tslib';
 import { getTranslations } from 'next-intl/server';
-import { getAsNeededLocalizedUrl } from '@windrun-huaiin/lib';
+import { getAsNeededLocalizedUrl } from '@windrun-huaiin/lib/utils';
 
 const DEFAULT_SITE_ICONS = [
     { rel: 'icon', type: 'image/png', sizes: '16x16', url: '/favicon-16x16.png' },

package/dist/lib/seo-util.js

@@ -2,7 +2,7 @@
 
 var fs = require('fs');
 var path = require('path');
-var lib = require('@windrun-huaiin/lib');
+var utils = require('@windrun-huaiin/lib/utils');
 
 /**
  * Generate robots.txt content
@@ -51,7 +51,7 @@ function generateSitemap(baseUrl, locales, mdxSourceDir, openMdxSEOSiteMap = tru
                 for (const locale of locales) {
                     for (const f of blogFiles) {
                         if (f === 'index.mdx') {
-                            const localizedPath = lib.getAsNeededLocalizedUrl(locale, '/blog', localePrefixAsNeeded, defaultLocale);
+                            const localizedPath = utils.getAsNeededLocalizedUrl(locale, '/blog', localePrefixAsNeeded, defaultLocale);
                             blogRoutes.push({
                                 url: `${baseUrl}${localizedPath}`,
                                 lastModified: new Date(),
@@ -61,7 +61,7 @@ function generateSitemap(baseUrl, locales, mdxSourceDir, openMdxSEOSiteMap = tru
                         }
                         else {
                             const slug = f.replace(/\.mdx$/, '');
-                            const localizedPath = lib.getAsNeededLocalizedUrl(locale, `/blog/${slug}`, localePrefixAsNeeded, defaultLocale);
+                            const localizedPath = utils.getAsNeededLocalizedUrl(locale, `/blog/${slug}`, localePrefixAsNeeded, defaultLocale);
                             blogRoutes.push({
                                 url: `${baseUrl}${localizedPath}`,
                                 lastModified: new Date(),
@@ -80,7 +80,7 @@ function generateSitemap(baseUrl, locales, mdxSourceDir, openMdxSEOSiteMap = tru
     }
     // 3. main page (all language versions)
     const mainRoutes = locales.map(locale => {
-        const localizedPath = lib.getAsNeededLocalizedUrl(locale, '/', localePrefixAsNeeded, defaultLocale);
+        const localizedPath = utils.getAsNeededLocalizedUrl(locale, '/', localePrefixAsNeeded, defaultLocale);
         return {
             url: `${baseUrl}${localizedPath}`,
             lastModified: new Date(),

package/dist/lib/seo-util.mjs

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import { getAsNeededLocalizedUrl } from '@windrun-huaiin/lib';
+import { getAsNeededLocalizedUrl } from '@windrun-huaiin/lib/utils';
 
 /**
  * Generate robots.txt content

package/dist/main/credit/credit-nav-button.js

@@ -4,9 +4,12 @@
 var jsxRuntime = require('react/jsx-runtime');
 var utils = require('@windrun-huaiin/lib/utils');
 var icons = require('@windrun-huaiin/base-ui/icons');
+var lib = require('@windrun-huaiin/base-ui/lib');
 var ui = require('@windrun-huaiin/base-ui/ui');
 var React = require('react');
 var moneyPriceInteractive = require('../money-price/money-price-interactive.js');
+var moneyPriceConfigUtil = require('../money-price/money-price-config-util.js');
+var dialogStyles = require('../alert-dialog/dialog-styles.js');
 
 function CreditNavButton({ locale, totalBalance, totalLabel, children, }) {
     const [open, setOpen] = React.useState(false);
@@ -106,7 +109,28 @@ function CreditNavButton({ locale, totalBalance, totalLabel, children, }) {
         closePricingModal,
     }), [closeMenu, isMobile, openPricingModal, closePricingModal]);
     const isOnetimeModal = pricingModal.mode === 'onetime';
-    return (jsxRuntime.jsxs(CreditNavPopoverContext.Provider, { value: contextValue, children: [jsxRuntime.jsxs(ui.DropdownMenu, { modal: false, open: open, onOpenChange: setOpen, children: [jsxRuntime.jsx(ui.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsxs("button", { type: "button", "aria-label": `${formattedBalance} ${totalLabel}`, className: utils.cn('group relative mx-2 sm:mx-1 inline-flex items-center gap-2 overflow-hidden rounded-full border border-slate-200 bg-white pl-2 pr-4 py-1.5 text-sm font-semibold text-slate-700 shadow-sm transition-all duration-200 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-100', 'hover:-translate-y-0.5 hover:scale-[1.02] hover:border-transparent hover:text-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-slate-400 dark:focus-visible:ring-slate-500'), ref: triggerRef, children: [jsxRuntime.jsx("span", { className: "pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-visible:opacity-100 bg-linear-to-bl from-indigo-200/60 via-indigo-400/90 to-purple-200/50 dark:from-indigo-300/20 dark:via-slate-400 dark:to-slate-500/50", "aria-hidden": "true" }), jsxRuntime.jsx("span", { className: "relative z-10 flex h-6 w-6 items-center justify-center rounded-full bg-slate-100 text-slate-600 transition-transform duration-200 group-hover:scale-110 group-hover:bg-white/20 group-hover:text-white dark:bg-slate-800 dark:text-slate-200 dark:group-hover:bg-white/20 dark:group-hover:text-white", children: jsxRuntime.jsx(icons.GemIcon, { className: "h-3.5 w-3.5" }) }), jsxRuntime.jsxs("span", { className: "relative z-10 flex items-center", children: [jsxRuntime.jsx("span", { className: "text-base font-semibold leading-none", children: formattedBalance }), jsxRuntime.jsx("span", { className: "sr-only", children: ` ${totalLabel}` })] })] }) }), jsxRuntime.jsx(ui.DropdownMenuContent, { forceMount: true, sideOffset: 12, align: "end", className: "z-50 border-0 bg-transparent p-0 shadow-none mx-4 sm:mx-2 md:mx-1", children: jsxRuntime.jsx("div", { className: "w-[90vw] max-w-[90vw] max-h-[80vh] overflow-y-auto overflow-x-hidden rounded-3xl bg-transparent sm:w-[410px] sm:max-h-[90vh] sm:max-w-[95vw]", ref: contentRef, children: children }) })] }), pricingModal.modalMoneyPriceData && pricingModal.pricingContext ? (jsxRuntime.jsx(ui.AlertDialog, { open: pricingModal.open, onOpenChange: (open) => setPricingModal((prev) => (Object.assign(Object.assign({}, prev), { open }))), children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: "mt-5 sm:mt-6 md:mt-10 lg:mt-15 w-[95vw] max-w-[1200px] overflow-hidden border border-slate-200 bg-white p-0 shadow-[0_32px_90px_rgba(15,23,42,0.25)] ring-1 ring-black/5 dark:border-white/12 dark:bg-[#0f1222] dark:shadow-[0_40px_120px_rgba(0,0,0,0.6)] dark:ring-white/10", children: [jsxRuntime.jsxs(ui.AlertDialogHeader, { className: "flex flex-row items-center justify-between border-b border-slate-200 px-6 pt-4 pb-1 dark:border-slate-800", children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: "flex flex-wrap items-baseline gap-3 text-slate-900 dark:text-white", children: [jsxRuntime.jsx("span", { className: "text-2xl font-semibold leading-tight", children: pricingModal.modalMoneyPriceData.title }), pricingModal.modalMoneyPriceData.subtitle ? (jsxRuntime.jsx("span", { className: "text-sm font-medium text-slate-500 dark:text-slate-300", children: pricingModal.modalMoneyPriceData.subtitle })) : null] }) }), jsxRuntime.jsx("button", { type: "button", className: "rounded-full p-2 text-gray-400 transition hover:bg-gray-400 hover:text-gray-400 dark:text-white/80 dark:hover:bg-white/80 dark:hover:text-white/80", onClick: closePricingModal, children: jsxRuntime.jsx(icons.XIcon, { className: "h-6 w-6" }) })] }), jsxRuntime.jsx("div", { className: "max-h-[60vh] sm:max-h-[80vh] overflow-y-auto px-4 pt-2 pb-6", children: jsxRuntime.jsx("div", { className: "mx-auto w-full", children: jsxRuntime.jsx(moneyPriceInteractive.MoneyPriceInteractive, { data: pricingModal.modalMoneyPriceData, config: pricingModal.pricingContext.moneyPriceConfig, checkoutApiEndpoint: pricingModal.pricingContext.checkoutApiEndpoint, customerPortalApiEndpoint: pricingModal.pricingContext.customerPortalApiEndpoint, enableSubscriptionUpgrade: pricingModal.pricingContext.enableSubscriptionUpgrade, initialBillingType: isOnetimeModal ? 'onetime' : undefined, disableAutoDetectBilling: isOnetimeModal, initUserContext: pricingModal.pricingContext.initUserContext }, pricingModal.mode) }) })] }) })) : null] }));
+    const modalInitialBillingType = React.useMemo(() => {
+        var _a, _b;
+        if (isOnetimeModal) {
+            return 'onetime';
+        }
+        const pricingContext = pricingModal.pricingContext;
+        const priceId = (_b = (_a = pricingContext === null || pricingContext === void 0 ? void 0 : pricingContext.initUserContext) === null || _a === void 0 ? void 0 : _a.xSubscription) === null || _b === void 0 ? void 0 : _b.priceId;
+        if (!pricingContext || !priceId) {
+            return undefined;
+        }
+        const providerConfig = moneyPriceConfigUtil.getActiveProviderConfigUtil(pricingContext.moneyPriceConfig);
+        const products = providerConfig.subscriptionProducts || providerConfig.products || {};
+        for (const product of Object.values(products)) {
+            for (const [billingType, plan] of Object.entries(product.plans)) {
+                if (plan.priceId === priceId) {
+                    return billingType;
+                }
+            }
+        }
+        return undefined;
+    }, [isOnetimeModal, pricingModal.pricingContext]);
+    return (jsxRuntime.jsxs(CreditNavPopoverContext.Provider, { value: contextValue, children: [jsxRuntime.jsxs(ui.DropdownMenu, { modal: false, open: open, onOpenChange: setOpen, children: [jsxRuntime.jsx(ui.DropdownMenuTrigger, { asChild: true, children: jsxRuntime.jsxs("button", { type: "button", "aria-label": `${formattedBalance} ${totalLabel}`, className: utils.cn('group relative mx-2 sm:mx-1 inline-flex items-center gap-2 overflow-hidden rounded-full border border-slate-200 bg-white pl-2 pr-4 py-1.5 text-sm font-semibold text-slate-700 shadow-sm transition-all duration-200 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-100', 'hover:-translate-y-0.5 hover:scale-[1.02] hover:border-transparent hover:text-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-slate-400 dark:focus-visible:ring-slate-500'), ref: triggerRef, children: [jsxRuntime.jsx("span", { className: "pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-visible:opacity-100 bg-linear-to-bl from-indigo-200/60 via-indigo-400/90 to-purple-200/50 dark:from-indigo-300/20 dark:via-slate-400 dark:to-slate-500/50", "aria-hidden": "true" }), jsxRuntime.jsx("span", { className: "relative z-10 flex h-6 w-6 items-center justify-center rounded-full bg-slate-100 text-slate-600 transition-transform duration-200 group-hover:scale-110 group-hover:bg-white/20 group-hover:text-white dark:bg-slate-800 dark:text-slate-200 dark:group-hover:bg-white/20 dark:group-hover:text-white", children: jsxRuntime.jsx(icons.GemIcon, { className: "h-3.5 w-3.5" }) }), jsxRuntime.jsxs("span", { className: "relative z-10 flex items-center", children: [jsxRuntime.jsx("span", { className: "text-base font-semibold leading-none", children: formattedBalance }), jsxRuntime.jsx("span", { className: "sr-only", children: ` ${totalLabel}` })] })] }) }), jsxRuntime.jsx(ui.DropdownMenuContent, { forceMount: true, sideOffset: 12, align: "end", className: "z-50 border-0 bg-transparent p-0 shadow-none mx-4 sm:mx-2 md:mx-1", children: jsxRuntime.jsx("div", { className: "w-[90vw] max-w-[90vw] max-h-[80vh] overflow-y-auto overflow-x-hidden rounded-3xl bg-transparent sm:w-[410px] sm:max-h-[90vh] sm:max-w-[95vw]", ref: contentRef, children: children }) })] }), pricingModal.modalMoneyPriceData && pricingModal.pricingContext ? (jsxRuntime.jsx(ui.AlertDialog, { open: pricingModal.open, onOpenChange: (open) => setPricingModal((prev) => (Object.assign(Object.assign({}, prev), { open }))), children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn('mt-5 sm:mt-6 md:mt-10 lg:mt-15 w-[95vw] max-w-[1200px] overflow-hidden border border-slate-200 p-0 shadow-[0_32px_90px_rgba(15,23,42,0.25)] ring-1 ring-black/5 dark:border-white/12 dark:shadow-[0_40px_120px_rgba(0,0,0,0.6)] dark:ring-white/10', lib.themeMainBgColor), overlayClassName: dialogStyles.dialogThemedOverlayClass, children: [jsxRuntime.jsxs(ui.AlertDialogHeader, { className: "flex flex-row items-center justify-between border-b border-slate-200 px-6 pt-4 pb-1 dark:border-slate-800", children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: "flex flex-wrap items-baseline gap-3 text-slate-900 dark:text-white", children: [jsxRuntime.jsx("span", { className: "text-2xl font-semibold leading-tight", children: pricingModal.modalMoneyPriceData.title }), pricingModal.modalMoneyPriceData.subtitle ? (jsxRuntime.jsx("span", { className: "text-sm font-medium text-slate-500 dark:text-slate-300", children: pricingModal.modalMoneyPriceData.subtitle })) : null] }) }), jsxRuntime.jsx("button", { type: "button", className: "rounded-full p-2 text-gray-400 transition hover:bg-gray-400 hover:text-gray-400 dark:text-white/80 dark:hover:bg-white/80 dark:hover:text-white/80", onClick: closePricingModal, children: jsxRuntime.jsx(icons.XIcon, { className: "h-6 w-6" }) })] }), jsxRuntime.jsx("div", { className: "max-h-[60vh] sm:max-h-[80vh] overflow-y-auto px-4 pt-2 pb-6", children: jsxRuntime.jsx("div", { className: "mx-auto w-full", children: jsxRuntime.jsx(moneyPriceInteractive.MoneyPriceInteractive, { data: pricingModal.modalMoneyPriceData, config: pricingModal.pricingContext.moneyPriceConfig, checkoutApiEndpoint: pricingModal.pricingContext.checkoutApiEndpoint, customerPortalApiEndpoint: pricingModal.pricingContext.customerPortalApiEndpoint, enableSubscriptionUpgrade: pricingModal.pricingContext.enableSubscriptionUpgrade, initialBillingType: modalInitialBillingType, disableAutoDetectBilling: isOnetimeModal, initUserContext: pricingModal.pricingContext.initUserContext }, pricingModal.mode) }) })] }) })) : null] }));
 }
 const CreditNavPopoverContext = React.createContext(null);
 function useCreditNavPopover() {

package/dist/main/credit/credit-nav-button.mjs

@@ -2,9 +2,12 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { cn } from '@windrun-huaiin/lib/utils';
 import { GemIcon, XIcon } from '@windrun-huaiin/base-ui/icons';
+import { themeMainBgColor } from '@windrun-huaiin/base-ui/lib';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle } from '@windrun-huaiin/base-ui/ui';
 import { createContext, useState, useRef, useCallback, useMemo, useEffect, useContext } from 'react';
 import { MoneyPriceInteractive } from '../money-price/money-price-interactive.mjs';
+import { getActiveProviderConfigUtil } from '../money-price/money-price-config-util.mjs';
+import { dialogThemedOverlayClass } from '../alert-dialog/dialog-styles.mjs';
 
 function CreditNavButton({ locale, totalBalance, totalLabel, children, }) {
     const [open, setOpen] = useState(false);
@@ -104,7 +107,28 @@ function CreditNavButton({ locale, totalBalance, totalLabel, children, }) {
         closePricingModal,
     }), [closeMenu, isMobile, openPricingModal, closePricingModal]);
     const isOnetimeModal = pricingModal.mode === 'onetime';
-    return (jsxs(CreditNavPopoverContext.Provider, { value: contextValue, children: [jsxs(DropdownMenu, { modal: false, open: open, onOpenChange: setOpen, children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs("button", { type: "button", "aria-label": `${formattedBalance} ${totalLabel}`, className: cn('group relative mx-2 sm:mx-1 inline-flex items-center gap-2 overflow-hidden rounded-full border border-slate-200 bg-white pl-2 pr-4 py-1.5 text-sm font-semibold text-slate-700 shadow-sm transition-all duration-200 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-100', 'hover:-translate-y-0.5 hover:scale-[1.02] hover:border-transparent hover:text-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-slate-400 dark:focus-visible:ring-slate-500'), ref: triggerRef, children: [jsx("span", { className: "pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-visible:opacity-100 bg-linear-to-bl from-indigo-200/60 via-indigo-400/90 to-purple-200/50 dark:from-indigo-300/20 dark:via-slate-400 dark:to-slate-500/50", "aria-hidden": "true" }), jsx("span", { className: "relative z-10 flex h-6 w-6 items-center justify-center rounded-full bg-slate-100 text-slate-600 transition-transform duration-200 group-hover:scale-110 group-hover:bg-white/20 group-hover:text-white dark:bg-slate-800 dark:text-slate-200 dark:group-hover:bg-white/20 dark:group-hover:text-white", children: jsx(GemIcon, { className: "h-3.5 w-3.5" }) }), jsxs("span", { className: "relative z-10 flex items-center", children: [jsx("span", { className: "text-base font-semibold leading-none", children: formattedBalance }), jsx("span", { className: "sr-only", children: ` ${totalLabel}` })] })] }) }), jsx(DropdownMenuContent, { forceMount: true, sideOffset: 12, align: "end", className: "z-50 border-0 bg-transparent p-0 shadow-none mx-4 sm:mx-2 md:mx-1", children: jsx("div", { className: "w-[90vw] max-w-[90vw] max-h-[80vh] overflow-y-auto overflow-x-hidden rounded-3xl bg-transparent sm:w-[410px] sm:max-h-[90vh] sm:max-w-[95vw]", ref: contentRef, children: children }) })] }), pricingModal.modalMoneyPriceData && pricingModal.pricingContext ? (jsx(AlertDialog, { open: pricingModal.open, onOpenChange: (open) => setPricingModal((prev) => (Object.assign(Object.assign({}, prev), { open }))), children: jsxs(AlertDialogContent, { className: "mt-5 sm:mt-6 md:mt-10 lg:mt-15 w-[95vw] max-w-[1200px] overflow-hidden border border-slate-200 bg-white p-0 shadow-[0_32px_90px_rgba(15,23,42,0.25)] ring-1 ring-black/5 dark:border-white/12 dark:bg-[#0f1222] dark:shadow-[0_40px_120px_rgba(0,0,0,0.6)] dark:ring-white/10", children: [jsxs(AlertDialogHeader, { className: "flex flex-row items-center justify-between border-b border-slate-200 px-6 pt-4 pb-1 dark:border-slate-800", children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: "flex flex-wrap items-baseline gap-3 text-slate-900 dark:text-white", children: [jsx("span", { className: "text-2xl font-semibold leading-tight", children: pricingModal.modalMoneyPriceData.title }), pricingModal.modalMoneyPriceData.subtitle ? (jsx("span", { className: "text-sm font-medium text-slate-500 dark:text-slate-300", children: pricingModal.modalMoneyPriceData.subtitle })) : null] }) }), jsx("button", { type: "button", className: "rounded-full p-2 text-gray-400 transition hover:bg-gray-400 hover:text-gray-400 dark:text-white/80 dark:hover:bg-white/80 dark:hover:text-white/80", onClick: closePricingModal, children: jsx(XIcon, { className: "h-6 w-6" }) })] }), jsx("div", { className: "max-h-[60vh] sm:max-h-[80vh] overflow-y-auto px-4 pt-2 pb-6", children: jsx("div", { className: "mx-auto w-full", children: jsx(MoneyPriceInteractive, { data: pricingModal.modalMoneyPriceData, config: pricingModal.pricingContext.moneyPriceConfig, checkoutApiEndpoint: pricingModal.pricingContext.checkoutApiEndpoint, customerPortalApiEndpoint: pricingModal.pricingContext.customerPortalApiEndpoint, enableSubscriptionUpgrade: pricingModal.pricingContext.enableSubscriptionUpgrade, initialBillingType: isOnetimeModal ? 'onetime' : undefined, disableAutoDetectBilling: isOnetimeModal, initUserContext: pricingModal.pricingContext.initUserContext }, pricingModal.mode) }) })] }) })) : null] }));
+    const modalInitialBillingType = useMemo(() => {
+        var _a, _b;
+        if (isOnetimeModal) {
+            return 'onetime';
+        }
+        const pricingContext = pricingModal.pricingContext;
+        const priceId = (_b = (_a = pricingContext === null || pricingContext === void 0 ? void 0 : pricingContext.initUserContext) === null || _a === void 0 ? void 0 : _a.xSubscription) === null || _b === void 0 ? void 0 : _b.priceId;
+        if (!pricingContext || !priceId) {
+            return undefined;
+        }
+        const providerConfig = getActiveProviderConfigUtil(pricingContext.moneyPriceConfig);
+        const products = providerConfig.subscriptionProducts || providerConfig.products || {};
+        for (const product of Object.values(products)) {
+            for (const [billingType, plan] of Object.entries(product.plans)) {
+                if (plan.priceId === priceId) {
+                    return billingType;
+                }
+            }
+        }
+        return undefined;
+    }, [isOnetimeModal, pricingModal.pricingContext]);
+    return (jsxs(CreditNavPopoverContext.Provider, { value: contextValue, children: [jsxs(DropdownMenu, { modal: false, open: open, onOpenChange: setOpen, children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs("button", { type: "button", "aria-label": `${formattedBalance} ${totalLabel}`, className: cn('group relative mx-2 sm:mx-1 inline-flex items-center gap-2 overflow-hidden rounded-full border border-slate-200 bg-white pl-2 pr-4 py-1.5 text-sm font-semibold text-slate-700 shadow-sm transition-all duration-200 dark:border-slate-700 dark:bg-slate-900 dark:text-slate-100', 'hover:-translate-y-0.5 hover:scale-[1.02] hover:border-transparent hover:text-white hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-slate-400 dark:focus-visible:ring-slate-500'), ref: triggerRef, children: [jsx("span", { className: "pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-visible:opacity-100 bg-linear-to-bl from-indigo-200/60 via-indigo-400/90 to-purple-200/50 dark:from-indigo-300/20 dark:via-slate-400 dark:to-slate-500/50", "aria-hidden": "true" }), jsx("span", { className: "relative z-10 flex h-6 w-6 items-center justify-center rounded-full bg-slate-100 text-slate-600 transition-transform duration-200 group-hover:scale-110 group-hover:bg-white/20 group-hover:text-white dark:bg-slate-800 dark:text-slate-200 dark:group-hover:bg-white/20 dark:group-hover:text-white", children: jsx(GemIcon, { className: "h-3.5 w-3.5" }) }), jsxs("span", { className: "relative z-10 flex items-center", children: [jsx("span", { className: "text-base font-semibold leading-none", children: formattedBalance }), jsx("span", { className: "sr-only", children: ` ${totalLabel}` })] })] }) }), jsx(DropdownMenuContent, { forceMount: true, sideOffset: 12, align: "end", className: "z-50 border-0 bg-transparent p-0 shadow-none mx-4 sm:mx-2 md:mx-1", children: jsx("div", { className: "w-[90vw] max-w-[90vw] max-h-[80vh] overflow-y-auto overflow-x-hidden rounded-3xl bg-transparent sm:w-[410px] sm:max-h-[90vh] sm:max-w-[95vw]", ref: contentRef, children: children }) })] }), pricingModal.modalMoneyPriceData && pricingModal.pricingContext ? (jsx(AlertDialog, { open: pricingModal.open, onOpenChange: (open) => setPricingModal((prev) => (Object.assign(Object.assign({}, prev), { open }))), children: jsxs(AlertDialogContent, { className: cn('mt-5 sm:mt-6 md:mt-10 lg:mt-15 w-[95vw] max-w-[1200px] overflow-hidden border border-slate-200 p-0 shadow-[0_32px_90px_rgba(15,23,42,0.25)] ring-1 ring-black/5 dark:border-white/12 dark:shadow-[0_40px_120px_rgba(0,0,0,0.6)] dark:ring-white/10', themeMainBgColor), overlayClassName: dialogThemedOverlayClass, children: [jsxs(AlertDialogHeader, { className: "flex flex-row items-center justify-between border-b border-slate-200 px-6 pt-4 pb-1 dark:border-slate-800", children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: "flex flex-wrap items-baseline gap-3 text-slate-900 dark:text-white", children: [jsx("span", { className: "text-2xl font-semibold leading-tight", children: pricingModal.modalMoneyPriceData.title }), pricingModal.modalMoneyPriceData.subtitle ? (jsx("span", { className: "text-sm font-medium text-slate-500 dark:text-slate-300", children: pricingModal.modalMoneyPriceData.subtitle })) : null] }) }), jsx("button", { type: "button", className: "rounded-full p-2 text-gray-400 transition hover:bg-gray-400 hover:text-gray-400 dark:text-white/80 dark:hover:bg-white/80 dark:hover:text-white/80", onClick: closePricingModal, children: jsx(XIcon, { className: "h-6 w-6" }) })] }), jsx("div", { className: "max-h-[60vh] sm:max-h-[80vh] overflow-y-auto px-4 pt-2 pb-6", children: jsx("div", { className: "mx-auto w-full", children: jsx(MoneyPriceInteractive, { data: pricingModal.modalMoneyPriceData, config: pricingModal.pricingContext.moneyPriceConfig, checkoutApiEndpoint: pricingModal.pricingContext.checkoutApiEndpoint, customerPortalApiEndpoint: pricingModal.pricingContext.customerPortalApiEndpoint, enableSubscriptionUpgrade: pricingModal.pricingContext.enableSubscriptionUpgrade, initialBillingType: modalInitialBillingType, disableAutoDetectBilling: isOnetimeModal, initUserContext: pricingModal.pricingContext.initUserContext }, pricingModal.mode) }) })] }) })) : null] }));
 }
 const CreditNavPopoverContext = createContext(null);
 function useCreditNavPopover() {

package/dist/main/footer.js

@@ -7,8 +7,8 @@ var icons = require('@windrun-huaiin/base-ui/icons');
 var Link = require('next/link');
 var footerEmail = require('./footer-email.js');
 var tIntl = require('../lib/t-intl.js');
-var lib = require('@windrun-huaiin/lib');
-var lib$1 = require('@windrun-huaiin/base-ui/lib');
+var utils = require('@windrun-huaiin/lib/utils');
+var lib = require('@windrun-huaiin/base-ui/lib');
 
 function Footer(_a) {
     return tslib.__awaiter(this, arguments, void 0, function* ({ locale, localePrefixAsNeeded = true, defaultLocale = 'en' }) {
@@ -23,7 +23,7 @@ function Footer(_a) {
             clickToCopyText: tIntl.safeT(tFooter, 'clickToCopy', 'Click to copy'),
             copiedText: tIntl.safeT(tFooter, 'copied', 'Copied!'),
         };
-        return (jsxRuntime.jsxs("div", { className: "mb-10 w-full mx-auto", children: [jsxRuntime.jsx("div", { className: lib.cn("w-full border-current border-t", lib$1.themeIconColor) }), jsxRuntime.jsx("footer", { children: jsxRuntime.jsxs("div", { className: "w-full flex flex-col items-center justify-center px-4 py-8 space-y-3", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-center gap-x-2 gap-y-2 text-xs sm:text-sm sm:gap-x-6", children: [jsxRuntime.jsxs(Link, { href: lib.getAsNeededLocalizedUrl(locale, "/legal/terms", localePrefixAsNeeded, defaultLocale), className: "flex items-center space-x-1 hover:underline", children: [jsxRuntime.jsx(icons.ReceiptTextIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.terms })] }), jsxRuntime.jsxs(Link, { href: lib.getAsNeededLocalizedUrl(locale, "/legal/privacy", localePrefixAsNeeded, defaultLocale), className: "flex items-center space-x-1 hover:underline", children: [jsxRuntime.jsx(icons.ShieldUserIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.privacy })] }), jsxRuntime.jsxs(footerEmail.FooterEmail, { email: data.email, clickToCopyText: data.clickToCopyText, copiedText: data.copiedText, children: [jsxRuntime.jsx(icons.MailIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.contactUs })] })] }), jsxRuntime.jsx("div", { className: "text-xs sm:text-sm text-center", children: jsxRuntime.jsx("span", { children: data.copyright }) })] }) })] }));
+        return (jsxRuntime.jsxs("div", { className: "mb-10 w-full mx-auto", children: [jsxRuntime.jsx("div", { className: utils.cn("w-full border-current border-t", lib.themeIconColor) }), jsxRuntime.jsx("footer", { children: jsxRuntime.jsxs("div", { className: "w-full flex flex-col items-center justify-center px-4 py-8 space-y-3", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-center gap-x-2 gap-y-2 text-xs sm:text-sm sm:gap-x-6", children: [jsxRuntime.jsxs(Link, { href: utils.getAsNeededLocalizedUrl(locale, "/legal/terms", localePrefixAsNeeded, defaultLocale), className: "flex items-center space-x-1 hover:underline", children: [jsxRuntime.jsx(icons.ReceiptTextIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.terms })] }), jsxRuntime.jsxs(Link, { href: utils.getAsNeededLocalizedUrl(locale, "/legal/privacy", localePrefixAsNeeded, defaultLocale), className: "flex items-center space-x-1 hover:underline", children: [jsxRuntime.jsx(icons.ShieldUserIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.privacy })] }), jsxRuntime.jsxs(footerEmail.FooterEmail, { email: data.email, clickToCopyText: data.clickToCopyText, copiedText: data.copiedText, children: [jsxRuntime.jsx(icons.MailIcon, { className: "h-3.5 w-3.5" }), jsxRuntime.jsx("span", { children: data.contactUs })] })] }), jsxRuntime.jsx("div", { className: "text-xs sm:text-sm text-center", children: jsxRuntime.jsx("span", { children: data.copyright }) })] }) })] }));
     });
 }
 

package/dist/main/footer.mjs

@@ -5,7 +5,7 @@ import { ReceiptTextIcon, ShieldUserIcon, MailIcon } from '@windrun-huaiin/base-
 import Link from 'next/link';
 import { FooterEmail } from './footer-email.mjs';
 import { safeT } from '../lib/t-intl.mjs';
-import { cn, getAsNeededLocalizedUrl } from '@windrun-huaiin/lib';
+import { cn, getAsNeededLocalizedUrl } from '@windrun-huaiin/lib/utils';
 import { themeIconColor } from '@windrun-huaiin/base-ui/lib';
 
 function Footer(_a) {

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

@@ -9,11 +9,11 @@ var moneyPriceTypes = require('./money-price-types.js');
 var React = require('react');
 
 function MoneyPriceButton({ planKey, userContext, billingType, onAuth, onAction, texts, isProcessing = false, isAnyProcessing = false, isInitLoading = false, enableSubscriptionUpgrade = true }) {
+    const [isLoading, setIsLoading] = React.useState(false);
     if (isInitLoading) {
-        return (jsxRuntime.jsx("div", { className: "w-full h-11 md:h-12 mt-4 md:mt-auto rounded-full bg-transparent", "aria-hidden": "true", "data-plan-button-placeholder": planKey }));
+        return (jsxRuntime.jsx("div", { className: "relative w-full h-11 md:h-12 mt-4 md:mt-auto overflow-hidden rounded-full bg-gray-100/70 dark:bg-gray-800/40 animate-pulse transition-opacity duration-300 ease-out", "aria-hidden": "true", "data-plan-button-placeholder": planKey, children: jsxRuntime.jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/50 to-transparent dark:via-white/10" }) }));
     }
     const { isAuthenticated, subscriptionStatus } = userContext;
-    const [isLoading, setIsLoading] = React.useState(false);
     const subscriptionBilling = userContext.subscriptionType;
     const planTier = planKey;
     const planBilling = billingType;

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

@@ -7,11 +7,11 @@ import { UserState } from './money-price-types.mjs';
 import { useState } from 'react';
 
 function MoneyPriceButton({ planKey, userContext, billingType, onAuth, onAction, texts, isProcessing = false, isAnyProcessing = false, isInitLoading = false, enableSubscriptionUpgrade = true }) {
+    const [isLoading, setIsLoading] = useState(false);
     if (isInitLoading) {
-        return (jsx("div", { className: "w-full h-11 md:h-12 mt-4 md:mt-auto rounded-full bg-transparent", "aria-hidden": "true", "data-plan-button-placeholder": planKey }));
+        return (jsx("div", { className: "relative w-full h-11 md:h-12 mt-4 md:mt-auto overflow-hidden rounded-full bg-gray-100/70 dark:bg-gray-800/40 animate-pulse transition-opacity duration-300 ease-out", "aria-hidden": "true", "data-plan-button-placeholder": planKey, children: jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/50 to-transparent dark:via-white/10" }) }));
     }
     const { isAuthenticated, subscriptionStatus } = userContext;
-    const [isLoading, setIsLoading] = useState(false);
     const subscriptionBilling = userContext.subscriptionType;
     const planTier = planKey;
     const planBilling = billingType;

package/dist/main/money-price/money-price-interactive.d.ts

@@ -1,2 +1,2 @@
 import { type MoneyPriceInteractiveProps } from './money-price-types';
-export declare function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal, enabledBillingTypes, enableSubscriptionUpgrade, initialBillingType, disableAutoDetectBilling, initUserContext, }: MoneyPriceInteractiveProps): import("react/jsx-runtime").JSX.Element;
+export declare function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal, enabledBillingTypes, enableSubscriptionUpgrade, initialBillingType, disableAutoDetectBilling, initUserContext, isInitLoading, }: MoneyPriceInteractiveProps): import("react/jsx-runtime").JSX.Element;

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

@@ -14,8 +14,8 @@ var customerPortal = require('./customer-portal.js');
 var lib = require('@windrun-huaiin/base-ui/lib');
 
 const PLAN_KEYS = ['F1', 'P2', 'U3'];
-function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal = false, enabledBillingTypes, enableSubscriptionUpgrade = true, initialBillingType, disableAutoDetectBilling = false, initUserContext, }) {
-    var _a, _b, _c, _d;
+function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal = false, enabledBillingTypes, enableSubscriptionUpgrade = true, initialBillingType, disableAutoDetectBilling = false, initUserContext, isInitLoading = false, }) {
+    var _a, _b, _c, _d, _e, _f;
     const { redirectToSignIn, redirectToSignUp, user: clerkUser, openSignUp } = nextjs.useClerk();
     const router = navigation.useRouter();
     const providerConfig = React.useMemo(() => moneyPriceConfigUtil.getActiveProviderConfigUtil(config), [config]);
@@ -103,20 +103,16 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
         subscriptionSnapshot === null || subscriptionSnapshot === void 0 ? void 0 : subscriptionSnapshot.priceId,
         priceIdsByCycle,
     ]);
-    const initialBillingCandidate = React.useMemo(() => {
-        if (initialBillingType) {
-            return resolvedInitialBilling;
-        }
-        if (detectedBillingType) {
-            return detectedBillingType;
+    const explicitInitialBilling = React.useMemo(() => {
+        if (initialBillingType &&
+            billingOptions.some(option => option.key === initialBillingType)) {
+            return initialBillingType;
         }
-        return resolvedInitialBilling;
-    }, [initialBillingType, resolvedInitialBilling, detectedBillingType]);
-    const [billingType, setBillingType] = React.useState(initialBillingCandidate);
+        return null;
+    }, [initialBillingType, billingOptions]);
+    const [userSelectedBillingType, setUserSelectedBillingType] = React.useState(null);
+    const billingType = (_c = (_b = userSelectedBillingType !== null && userSelectedBillingType !== void 0 ? userSelectedBillingType : explicitInitialBilling) !== null && _b !== void 0 ? _b : detectedBillingType) !== null && _c !== void 0 ? _c : resolvedInitialBilling;
     const navigationLockRef = React.useRef(false);
-    React.useEffect(() => {
-        setBillingType(prev => (prev === initialBillingCandidate ? prev : initialBillingCandidate));
-    }, [initialBillingCandidate]);
     const [processingTarget, setProcessingTarget] = React.useState(null);
     const [isTouchDevice, setIsTouchDevice] = React.useState(false);
     React.useEffect(() => {
@@ -156,8 +152,8 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
         detectedBillingType,
         subscriptionSnapshot === null || subscriptionSnapshot === void 0 ? void 0 : subscriptionSnapshot.subPeriodEnd
     ]);
-    const fingerprintId = (_b = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.fingerprintId) !== null && _b !== void 0 ? _b : null;
-    const initUserId = (_d = (_c = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.xUser) === null || _c === void 0 ? void 0 : _c.userId) !== null && _d !== void 0 ? _d : null;
+    const fingerprintId = (_d = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.fingerprintId) !== null && _d !== void 0 ? _d : null;
+    const initUserId = (_f = (_e = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.xUser) === null || _e === void 0 ? void 0 : _e.userId) !== null && _f !== void 0 ? _f : null;
     const handleAuth = React.useCallback(() => {
         if (!enableClerkModal) {
             redirectToSignUp();
@@ -317,7 +313,7 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
                             ? utils.cn('text-white rounded-full shadow-sm', lib.themeButtonGradientClass, lib.themeButtonGradientHoverClass)
                             : 'text-gray-800 dark:text-gray-200 hover:text-gray-900 dark:hover:text-gray-100 rounded-full';
                         const showBadge = option.key === billingType && !!discountBadgeText;
-                        return (jsxRuntime.jsxs("div", { className: "relative flex items-center justify-center mx-1", children: [showBadge && (jsxRuntime.jsx("span", { className: "absolute z-10 left-1/2 -translate-x-1/2 -top-3 sm:-top-4 translate-y-[-50%] px-3 py-0.5  text-[0.625rem] sm:text-xs rounded-md bg-yellow-100 text-yellow-800 font-semibold shadow-sm whitespace-nowrap", children: discountBadgeText })), jsxRuntime.jsx("button", { className: utils.cn('text-sm md:text-base font-medium transition relative text-center z-10 px-2 sm:px-4 py-2 min-w-[100px] sm:min-w-[120px]', buttonClasses), type: "button", "data-billing-button": option.key, onClick: () => setBillingType(option.key), children: option.name })] }, option.key));
+                        return (jsxRuntime.jsxs("div", { className: "relative flex items-center justify-center mx-1", children: [showBadge && (jsxRuntime.jsx("span", { className: "absolute z-10 left-1/2 -translate-x-1/2 -top-3 sm:-top-4 translate-y-[-50%] px-3 py-0.5  text-[0.625rem] sm:text-xs rounded-md bg-yellow-100 text-yellow-800 font-semibold shadow-sm whitespace-nowrap", children: discountBadgeText })), jsxRuntime.jsx("button", { className: utils.cn('text-sm md:text-base font-medium transition relative text-center z-10 px-2 sm:px-4 py-2 min-w-[100px] sm:min-w-[120px]', buttonClasses), type: "button", "data-billing-button": option.key, onClick: () => setUserSelectedBillingType(option.key), children: option.name })] }, option.key));
                     }) }) }), jsxRuntime.jsx("div", { className: "w-full", children: jsxRuntime.jsx("div", { className: "flex flex-wrap justify-center gap-5 md:gap-6 xl:gap-8 w-full max-w-6xl mx-auto", children: currentPlans.map((plan) => {
                         const planKey = plan.key;
                         if (!PLAN_KEYS.includes(planKey)) {
@@ -333,7 +329,7 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
                                                     jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [(selectedBillingOption === null || selectedBillingOption === void 0 ? void 0 : selectedBillingOption.subTitle) && (jsxRuntime.jsx("span", { className: "text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium", children: selectedBillingOption.subTitle })), plan.subtitle && (jsxRuntime.jsxs("span", { className: "px-2 py-0.5 text-[11px] md:text-xs rounded bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200 font-semibold align-middle", children: ["+", plan.subtitle] }))] })) : (
                                                     // 其他模式下保持原逻辑
                                                     showBillingSubtitle && (jsxRuntime.jsx("span", { className: "text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium", children: (selectedBillingOption === null || selectedBillingOption === void 0 ? void 0 : selectedBillingOption.subTitle) || '' }))) })] })] }), jsxRuntime.jsx("ul", { className: "flex-1 mb-6 mt-4 text-xs md:text-sm leading-5", children: getFeatureRows(plan).map((feature, i) => (jsxRuntime.jsxs("li", { className: "flex items-start gap-2 mb-2 min-h-[24px] md:min-h-[28px]", "data-feature-item": `${planKey}-${i}`, children: [feature ? (jsxRuntime.jsx("span", { className: "inline-flex items-center justify-center w-5 h-5 rounded-full bg-green-100 text-green-700 dark:bg-green-900 dark:text-green-200 mr-1", children: feature.icon ? jsxRuntime.jsx("span", { children: feature.icon }) : jsxRuntime.jsx("span", { className: "font-bold", children: "\u2713" }) })) : (jsxRuntime.jsx("span", { className: "inline-flex items-center justify-center w-5 h-5 rounded-full mr-1", children: "\u00A0" })), feature && feature.tag && (jsxRuntime.jsx("span", { className: "px-1 py-0.5 text-[6px] rounded bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200 font-semibold align-middle", children: feature.tag })), feature ? (jsxRuntime.jsxs("div", { className: "flex-1 text-gray-800 dark:text-gray-200", children: [jsxRuntime.jsx("span", { children: feature.description }), feature.tooltip && (jsxRuntime.jsx("span", { className: "block text-[11px] text-gray-500 dark:text-gray-400 mt-1", children: feature.tooltip }))] })) : (jsxRuntime.jsx("span", { children: "\u00A0" }))] }, i))) }), jsxRuntime.jsx("div", { className: "flex-1" }), jsxRuntime.jsx(moneyPriceButton.MoneyPriceButton, { planKey: planKey, userContext: userContext, billingType: billingType, onAuth: handleAuth, onAction: handleAction, texts: data.buttonTexts, isProcessing: (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.plan) === planKey &&
-                                        (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.billing) === billingType, isAnyProcessing: !!processingTarget, isInitLoading: false, enableSubscriptionUpgrade: enableSubscriptionUpgrade })] }, plan.key));
+                                        (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.billing) === billingType, isAnyProcessing: !!processingTarget, isInitLoading: isInitLoading, enableSubscriptionUpgrade: enableSubscriptionUpgrade })] }, plan.key));
                     }) }) })] }));
 }
 

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

@@ -12,8 +12,8 @@ import { redirectToCustomerPortal } from './customer-portal.mjs';
 import { themeButtonGradientClass, themeButtonGradientHoverClass, themeIconColor } from '@windrun-huaiin/base-ui/lib';
 
 const PLAN_KEYS = ['F1', 'P2', 'U3'];
-function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal = false, enabledBillingTypes, enableSubscriptionUpgrade = true, initialBillingType, disableAutoDetectBilling = false, initUserContext, }) {
-    var _a, _b, _c, _d;
+function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPortalApiEndpoint, enableClerkModal = false, enabledBillingTypes, enableSubscriptionUpgrade = true, initialBillingType, disableAutoDetectBilling = false, initUserContext, isInitLoading = false, }) {
+    var _a, _b, _c, _d, _e, _f;
     const { redirectToSignIn, redirectToSignUp, user: clerkUser, openSignUp } = useClerk();
     const router = useRouter();
     const providerConfig = useMemo(() => getActiveProviderConfigUtil(config), [config]);
@@ -101,20 +101,16 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
         subscriptionSnapshot === null || subscriptionSnapshot === void 0 ? void 0 : subscriptionSnapshot.priceId,
         priceIdsByCycle,
     ]);
-    const initialBillingCandidate = useMemo(() => {
-        if (initialBillingType) {
-            return resolvedInitialBilling;
-        }
-        if (detectedBillingType) {
-            return detectedBillingType;
+    const explicitInitialBilling = useMemo(() => {
+        if (initialBillingType &&
+            billingOptions.some(option => option.key === initialBillingType)) {
+            return initialBillingType;
         }
-        return resolvedInitialBilling;
-    }, [initialBillingType, resolvedInitialBilling, detectedBillingType]);
-    const [billingType, setBillingType] = useState(initialBillingCandidate);
+        return null;
+    }, [initialBillingType, billingOptions]);
+    const [userSelectedBillingType, setUserSelectedBillingType] = useState(null);
+    const billingType = (_c = (_b = userSelectedBillingType !== null && userSelectedBillingType !== void 0 ? userSelectedBillingType : explicitInitialBilling) !== null && _b !== void 0 ? _b : detectedBillingType) !== null && _c !== void 0 ? _c : resolvedInitialBilling;
     const navigationLockRef = useRef(false);
-    useEffect(() => {
-        setBillingType(prev => (prev === initialBillingCandidate ? prev : initialBillingCandidate));
-    }, [initialBillingCandidate]);
     const [processingTarget, setProcessingTarget] = useState(null);
     const [isTouchDevice, setIsTouchDevice] = useState(false);
     useEffect(() => {
@@ -154,8 +150,8 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
         detectedBillingType,
         subscriptionSnapshot === null || subscriptionSnapshot === void 0 ? void 0 : subscriptionSnapshot.subPeriodEnd
     ]);
-    const fingerprintId = (_b = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.fingerprintId) !== null && _b !== void 0 ? _b : null;
-    const initUserId = (_d = (_c = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.xUser) === null || _c === void 0 ? void 0 : _c.userId) !== null && _d !== void 0 ? _d : null;
+    const fingerprintId = (_d = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.fingerprintId) !== null && _d !== void 0 ? _d : null;
+    const initUserId = (_f = (_e = initUserContext === null || initUserContext === void 0 ? void 0 : initUserContext.xUser) === null || _e === void 0 ? void 0 : _e.userId) !== null && _f !== void 0 ? _f : null;
     const handleAuth = useCallback(() => {
         if (!enableClerkModal) {
             redirectToSignUp();
@@ -315,7 +311,7 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
                             ? cn('text-white rounded-full shadow-sm', themeButtonGradientClass, themeButtonGradientHoverClass)
                             : 'text-gray-800 dark:text-gray-200 hover:text-gray-900 dark:hover:text-gray-100 rounded-full';
                         const showBadge = option.key === billingType && !!discountBadgeText;
-                        return (jsxs("div", { className: "relative flex items-center justify-center mx-1", children: [showBadge && (jsx("span", { className: "absolute z-10 left-1/2 -translate-x-1/2 -top-3 sm:-top-4 translate-y-[-50%] px-3 py-0.5  text-[0.625rem] sm:text-xs rounded-md bg-yellow-100 text-yellow-800 font-semibold shadow-sm whitespace-nowrap", children: discountBadgeText })), jsx("button", { className: cn('text-sm md:text-base font-medium transition relative text-center z-10 px-2 sm:px-4 py-2 min-w-[100px] sm:min-w-[120px]', buttonClasses), type: "button", "data-billing-button": option.key, onClick: () => setBillingType(option.key), children: option.name })] }, option.key));
+                        return (jsxs("div", { className: "relative flex items-center justify-center mx-1", children: [showBadge && (jsx("span", { className: "absolute z-10 left-1/2 -translate-x-1/2 -top-3 sm:-top-4 translate-y-[-50%] px-3 py-0.5  text-[0.625rem] sm:text-xs rounded-md bg-yellow-100 text-yellow-800 font-semibold shadow-sm whitespace-nowrap", children: discountBadgeText })), jsx("button", { className: cn('text-sm md:text-base font-medium transition relative text-center z-10 px-2 sm:px-4 py-2 min-w-[100px] sm:min-w-[120px]', buttonClasses), type: "button", "data-billing-button": option.key, onClick: () => setUserSelectedBillingType(option.key), children: option.name })] }, option.key));
                     }) }) }), jsx("div", { className: "w-full", children: jsx("div", { className: "flex flex-wrap justify-center gap-5 md:gap-6 xl:gap-8 w-full max-w-6xl mx-auto", children: currentPlans.map((plan) => {
                         const planKey = plan.key;
                         if (!PLAN_KEYS.includes(planKey)) {
@@ -331,7 +327,7 @@ function MoneyPriceInteractive({ data, config, checkoutApiEndpoint, customerPort
                                                     jsxs(Fragment, { children: [(selectedBillingOption === null || selectedBillingOption === void 0 ? void 0 : selectedBillingOption.subTitle) && (jsx("span", { className: "text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium", children: selectedBillingOption.subTitle })), plan.subtitle && (jsxs("span", { className: "px-2 py-0.5 text-[11px] md:text-xs rounded bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200 font-semibold align-middle", children: ["+", plan.subtitle] }))] })) : (
                                                     // 其他模式下保持原逻辑
                                                     showBillingSubtitle && (jsx("span", { className: "text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium", children: (selectedBillingOption === null || selectedBillingOption === void 0 ? void 0 : selectedBillingOption.subTitle) || '' }))) })] })] }), jsx("ul", { className: "flex-1 mb-6 mt-4 text-xs md:text-sm leading-5", children: getFeatureRows(plan).map((feature, i) => (jsxs("li", { className: "flex items-start gap-2 mb-2 min-h-[24px] md:min-h-[28px]", "data-feature-item": `${planKey}-${i}`, children: [feature ? (jsx("span", { className: "inline-flex items-center justify-center w-5 h-5 rounded-full bg-green-100 text-green-700 dark:bg-green-900 dark:text-green-200 mr-1", children: feature.icon ? jsx("span", { children: feature.icon }) : jsx("span", { className: "font-bold", children: "\u2713" }) })) : (jsx("span", { className: "inline-flex items-center justify-center w-5 h-5 rounded-full mr-1", children: "\u00A0" })), feature && feature.tag && (jsx("span", { className: "px-1 py-0.5 text-[6px] rounded bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200 font-semibold align-middle", children: feature.tag })), feature ? (jsxs("div", { className: "flex-1 text-gray-800 dark:text-gray-200", children: [jsx("span", { children: feature.description }), feature.tooltip && (jsx("span", { className: "block text-[11px] text-gray-500 dark:text-gray-400 mt-1", children: feature.tooltip }))] })) : (jsx("span", { children: "\u00A0" }))] }, i))) }), jsx("div", { className: "flex-1" }), jsx(MoneyPriceButton, { planKey: planKey, userContext: userContext, billingType: billingType, onAuth: handleAuth, onAction: handleAction, texts: data.buttonTexts, isProcessing: (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.plan) === planKey &&
-                                        (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.billing) === billingType, isAnyProcessing: !!processingTarget, isInitLoading: false, enableSubscriptionUpgrade: enableSubscriptionUpgrade })] }, plan.key));
+                                        (processingTarget === null || processingTarget === void 0 ? void 0 : processingTarget.billing) === billingType, isAnyProcessing: !!processingTarget, isInitLoading: isInitLoading, enableSubscriptionUpgrade: enableSubscriptionUpgrade })] }, plan.key));
                     }) }) })] }));
 }
 

package/dist/main/money-price/money-price-types.d.ts

@@ -96,6 +96,7 @@ export interface MoneyPriceInteractiveProps {
     initialBillingType?: string;
     disableAutoDetectBilling?: boolean;
     initUserContext?: InitUserContext;
+    isInitLoading?: boolean;
 }
 export interface MoneyPriceButtonProps {
     planKey: 'F1' | 'P2' | 'U3';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@windrun-huaiin/third-ui",
-  "version": "27.0.0",
+  "version": "28.0.0",
   "description": "Third-party integrated UI components for windrun-huaiin projects",
   "exports": {
     "./clerk": {
@@ -98,6 +98,21 @@
       "import": "./dist/fuma/server.mjs",
       "require": "./dist/fuma/server.js"
     },
+    "./fuma/server/page-generator": {
+      "types": "./dist/fuma/server/page-generator.d.ts",
+      "import": "./dist/fuma/server/page-generator.mjs",
+      "require": "./dist/fuma/server/page-generator.js"
+    },
+    "./fuma/server/llm-copy-handler": {
+      "types": "./dist/fuma/server/llm-copy-handler.d.ts",
+      "import": "./dist/fuma/server/llm-copy-handler.mjs",
+      "require": "./dist/fuma/server/llm-copy-handler.js"
+    },
+    "./fuma/fuma-translate-util": {
+      "types": "./dist/fuma/fuma-translate-util.d.ts",
+      "import": "./dist/fuma/fuma-translate-util.mjs",
+      "require": "./dist/fuma/fuma-translate-util.js"
+    },
     "./fuma/server/site-mdx/base": {
       "types": "./dist/fuma/server/site-mdx-base.d.ts",
       "import": "./dist/fuma/server/site-mdx-base.mjs",
@@ -143,6 +158,31 @@
       "import": "./dist/fuma/base/index.mjs",
       "require": "./dist/fuma/base/index.js"
     },
+    "./fuma/base/docs-root-provider": {
+      "types": "./dist/fuma/base/docs-root-provider.d.ts",
+      "import": "./dist/fuma/base/docs-root-provider.mjs",
+      "require": "./dist/fuma/base/docs-root-provider.js"
+    },
+    "./fuma/base/nav-config": {
+      "types": "./dist/fuma/base/nav-config.d.ts",
+      "import": "./dist/fuma/base/nav-config.mjs",
+      "require": "./dist/fuma/base/nav-config.js"
+    },
+    "./fuma/base/site-docs-layout": {
+      "types": "./dist/fuma/base/site-docs-layout.d.ts",
+      "import": "./dist/fuma/base/site-docs-layout.mjs",
+      "require": "./dist/fuma/base/site-docs-layout.js"
+    },
+    "./fuma/base/site-home-layout": {
+      "types": "./dist/fuma/base/site-home-layout.d.ts",
+      "import": "./dist/fuma/base/site-home-layout.mjs",
+      "require": "./dist/fuma/base/site-home-layout.js"
+    },
+    "./fuma/base/site-layout-shared": {
+      "types": "./dist/fuma/base/site-layout-shared.d.ts",
+      "import": "./dist/fuma/base/site-layout-shared.mjs",
+      "require": "./dist/fuma/base/site-layout-shared.js"
+    },
     "./lib/server": {
       "types": "./dist/lib/server.d.ts",
       "import": "./dist/lib/server.mjs",
@@ -187,9 +227,9 @@
     "tslib": "^2.8.1",
     "unified": "^11.0.5",
     "zod": "^4.3.6",
-    "@windrun-huaiin/base-ui": "^27.0.0",
-    "@windrun-huaiin/lib": "^27.0.0",
-    "@windrun-huaiin/contracts": "^27.0.0"
+    "@windrun-huaiin/base-ui": "^28.0.0",
+    "@windrun-huaiin/lib": "^28.0.0",
+    "@windrun-huaiin/contracts": "^28.0.0"
   },
   "peerDependencies": {
     "clsx": "^2.1.1",

package/src/fuma/base/custom-header.tsx

@@ -35,7 +35,7 @@ import { Popover, PopoverContent, PopoverTrigger } from 'fumadocs-ui/components/
 import { buttonVariants } from 'fumadocs-ui/components/ui/button';
 import { useI18n } from 'fumadocs-ui/contexts/i18n';
 import { HeaderThemeSwitch } from './header-theme-switch';
-import type { ExtendedLinkItem } from './custom-home-layout';
+import type { ExtendedLinkItem } from './site-layout-shared';
 
 export type NavbarCSSVars = CSSProperties & {
   '--fd-banner-height'?: string;

package/src/fuma/base/custom-home-layout.tsx

@@ -1,6 +1,5 @@
 import type { CSSProperties, ReactNode } from 'react';
 import { HomeLayout, type HomeLayoutProps } from 'fumadocs-ui/layouts/home';
-import { type LinkItemType } from 'fumadocs-ui/layouts/shared';
 import { FumaBannerSuit } from '../fuma-banner-suit';
 import { Footer } from '../../main/footer';
 import { GoToTop } from '../../main/go-to-top';
@@ -12,11 +11,6 @@ import {
   type MobileMenuAction,
 } from './custom-header';
 
-export type ExtendedLinkItem = LinkItemType & {
-  mobilePinned?: boolean;
-  prefetch?: boolean;
-};
-
 // - bannerHeight/headerHeight 换成你项目期望的 rem 值即可（如果没有 Banner 就把 bannerHeight 设成 0）。
 // - layoutStyle 同时把变量传给 HomeLayout 的 main 元素，这样内容整体会往下错开，不需要 has-banner/no-banner class。
 // - CustomHomeHeader 直接接受 HomeLayout 的各类 props（links、nav、searchToggle、themeSwitch、i18n 等），内部会复用 Fumadocs 原本的导航功能。

package/src/fuma/base/docs-root-provider.tsx

@@ -0,0 +1,58 @@
+import type { ComponentProps, ReactNode } from 'react';
+import { NextProvider } from 'fumadocs-core/framework/next';
+import { I18nProvider, type I18nProviderProps } from 'fumadocs-ui/contexts/i18n';
+import { ThemeProvider, type ThemeProviderProps } from 'next-themes';
+
+type NextProviderComponents = {
+  Link?: ComponentProps<typeof NextProvider>['Link'];
+  Image?: ComponentProps<typeof NextProvider>['Image'];
+};
+
+type ThemeOptions = ThemeProviderProps & {
+  enabled?: boolean;
+};
+
+export interface DocsRootProviderProps {
+  i18n: Omit<I18nProviderProps, 'children'>;
+  theme?: ThemeOptions;
+  components?: NextProviderComponents;
+  children: ReactNode;
+}
+
+export function DocsRootProvider({
+  i18n,
+  theme = {},
+  components,
+  children,
+}: DocsRootProviderProps) {
+  let body = children;
+
+  if (theme.enabled !== false) {
+    body = (
+      <ThemeProvider
+        attribute="class"
+        defaultTheme="system"
+        enableSystem
+        disableTransitionOnChange
+        {...theme}
+      >
+        {body}
+      </ThemeProvider>
+    );
+  }
+
+  body = (
+    <I18nProvider {...i18n}>
+      {body}
+    </I18nProvider>
+  );
+
+  return (
+    <NextProvider
+      Link={components?.Link}
+      Image={components?.Image}
+    >
+      {body}
+    </NextProvider>
+  );
+}

package/src/fuma/base/index.ts

@@ -1,4 +1,8 @@
 export * from './custom-header';
 export * from './custom-home-layout';
+export * from './docs-root-provider';
 export * from './nav-config';
+export * from './site-docs-layout';
+export * from './site-home-layout';
 export * from './site-layout';
+export * from './site-layout-shared';