@windrun-huaiin/third-ui 30.1.0 → 31.0.1

package/src/main/credit/types.ts

@@ -47,21 +47,21 @@ export interface CreditCTAConfig {
 export type CreditBucketStatus = 'active' | 'expiringSoon' | 'expired';
 
 export interface CreditBucket {
-  /** 业务方自定义的积分类型标识，用于映射翻译或埋点 */
+  /** Business-defined credit type identifier for translation mapping or analytics. */
   kind: string;
-  /** 若提供则使用该名称，否则由组件根据 kind 使用默认翻译 */
+  /** Display name override; otherwise the component uses the default translation for kind. */
   label?: string;
-  /** 当前积分余额 */
+  /** Current credit balance. */
   balance: number;
-  /** 该类型积分的额度上限 */
+  /** Credit limit for this credit type. */
   limit: number;
-  /** 可选状态标签，用于强调过期等状态 */
+  /** Optional status label for highlighting states such as expiration. */
   status?: CreditBucketStatus;
-  /** 积分过期时间（本地时区字符串），用于组件内部推导状态 */
+  /** Credit expiration time as a local time string, used to derive component state. */
   expiresAt?: string;
-  /** 进度百分比（0-100）；未提供时组件按 balance/limit 计算 */
+  /** Progress percentage from 0 to 100; computed from balance/limit when omitted. */
   progressPercent?: number;
-  /** 任何额外说明，如剩余天数、使用限制等 */
+  /** Additional details, such as remaining days or usage limits. */
   description?: string;
 }
 

package/src/main/gallery/gallery-mobile-swiper.tsx

@@ -19,7 +19,6 @@ const swiperThemeStyle = {
 export function GalleryMobileSwiper({ items }: Props) {
   return (
     <div className="block sm:hidden px-4">
-      {/* 外层容器：强制 maxWidth，防止任何溢出 */}
       <div
         className="w-full overflow-hidden"
         style={{ maxWidth: "min(calc(100vw - 48px), 350px)", margin: "0 auto" }}

package/src/main/gallery/gallery-server.tsx

@@ -33,10 +33,10 @@ export async function Gallery({ locale, sectionClassName, button }: GalleryProps
       </h2>
       <p className="text-center max-w-2xl mx-auto mb-16">{data.description}</p>
 
-      {/* 移动端轮播 */}
+      {/* Mobile swiper */}
       <GalleryMobileSwiper items={data.items} />
 
-      {/* 桌面端网格 */}
+      {/* Desktop grid */}
       <GalleryDesktopGrid items={data.items} />
 
       {button && <div className="text-center mx-auto mt-12 max-w-[85vw]">{button}</div>}

package/src/main/money-price/index.ts

@@ -5,6 +5,8 @@ export { MoneyPriceButton } from './money-price-button';
 export type {
   MoneyPriceConfig,
   MoneyPriceData,
+  MoneyPriceAnimeTone,
+  MoneyPriceStrictDiffAnime,
   InitUserContext,
   MoneyPriceInteractiveProps,
   MoneyPriceButtonProps,

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

@@ -44,9 +44,9 @@ export function MoneyPriceButton({
     return 0;
   };
 
-  // OneTime 模式的按钮配置
+  // Button configuration for one-time mode.
   const getOnetimeButtonConfig = () => {
-    // 匿名用户：所有卡片都显示登录按钮
+    // Anonymous users: show the sign-in button on every card.
     if (!isAuthenticated) {
       return {
         text: texts.getStarted,
@@ -57,12 +57,12 @@ export function MoneyPriceButton({
     }
 
     if (subscriptionStatus === UserState.Anonymous) {
-        // 已登录但状态未知 → 视为 FreeUser
+        // Signed in but status unknown: treat as FreeUser.
         console.warn('Clerk is authed OK but user is anonymous!');
         return { text: '', disabled: true, hidden: true };
     }
 
-    // 登录用户：OneTime 模式下所有卡片都显示购买积分按钮
+    // Signed-in users: show the buy-credits button on every card in one-time mode.
     return {
       text: texts.buyCredits || texts.upgrade,
       onClick: () => onAction(planKey, billingType),
@@ -71,9 +71,9 @@ export function MoneyPriceButton({
     };
   };
 
-  // 订阅模式的按钮配置
+  // Button configuration for subscription mode.
   const getSubscriptionButtonConfig = () => {
-    // 匿名用户
+    // Anonymous users.
     if (!isAuthenticated) {
       const getButtonText = () => {
         switch (planKey) {
@@ -96,7 +96,7 @@ export function MoneyPriceButton({
       };
     }
 
-    // 已登录用户
+    // Signed-in users.
     switch (subscriptionStatus) {
       case UserState.FreeUser: {
         if (planTier === 'F1') {
@@ -115,7 +115,7 @@ export function MoneyPriceButton({
       }
 
       case UserState.ProUser: {
-        // 不允许降级到 Free
+        // Do not allow downgrades to Free.
         if (planTier === 'F1') {
           return { hidden: true };
         }
@@ -209,13 +209,13 @@ export function MoneyPriceButton({
       }
 
       default:
-        // 已登录但状态未知 → 视为 FreeUser
+        // Signed in but status unknown: treat as FreeUser.
         console.warn('Clerk is authed OK but user is anonymous!');
         return { text: '', disabled: true, hidden: true };
     }
   };
 
-  // 主要的按钮配置函数
+  // Main button configuration function.
   const getButtonConfig = () => {
     if (billingType === 'onetime') {
       return getOnetimeButtonConfig();

package/src/main/money-price/money-price-config-util.ts

@@ -1,27 +1,27 @@
 /**
  * Money Price Configuration
- * 价格组件配置文件
+ * Pricing component configuration.
  */
 
 import type { MoneyPriceConfig, PaymentProviderConfig, EnhancePricePlan } from './money-price-types';
 
 /**
- * 获取当前激活的支付供应商配置
+ * Get the currently active payment provider configuration.
  *
- * 🔒 安全设计：
- * - util层负责从config中提取激活的provider配置
- * - 只返回提取的结果，不暴露任何config结构
- * - 调用方（应用层）通过wrapper隐藏config对象
+ * Security design:
+ * - The utility layer extracts the active provider configuration from the config.
+ * - Only the extracted result is returned; the full config structure is not exposed.
+ * - Application-level wrappers hide the config object from callers.
  *
- * @param config - MoneyPriceConfig对象（由应用层提供）
- * @returns 当前激活的支付供应商配置
+ * @param config - MoneyPriceConfig object provided by the application layer.
+ * @returns The currently active payment provider configuration.
  */
 export function getActiveProviderConfigUtil(config: MoneyPriceConfig): PaymentProviderConfig {
   const provider = config.activeProvider;
   return config.paymentProviders[provider];
 }
 
-// 辅助函数：获取特定产品的价格信息
+// Helper: get pricing information for a specific product.
 export function getProductPricing(
   productKey: 'F1' | 'P2' | 'U3',
   billingType: string,
@@ -30,10 +30,10 @@ export function getProductPricing(
 ): EnhancePricePlan {
   const providerConfig = config.paymentProviders[provider];
 
-  // 如果是 onetime 类型，尝试从积分包中获取
+  // For one-time billing, try to resolve pricing from credit packs.
   if (billingType === 'onetime') {
     const creditPacks = providerConfig.creditPackProducts;
-    // 直接使用相同的 key：F1->F1, P2->P2, U3->U3
+    // Use the same product key directly: F1 -> F1, P2 -> P2, U3 -> U3.
     if (creditPacks && creditPacks[productKey]) {
       const pack = creditPacks[productKey];
       return {
@@ -45,7 +45,7 @@ export function getProductPricing(
     }
   }
 
-  // 否则从订阅产品中获取
+  // Otherwise resolve pricing from subscription products.
   const products = providerConfig.subscriptionProducts || providerConfig.products;
   if (products && products[productKey] && products[productKey].plans[billingType]) {
     return products[productKey].plans[billingType];
@@ -54,19 +54,19 @@ export function getProductPricing(
   throw new Error(`Product pricing not found for ${productKey} ${billingType}`);
 }
 
-// ============ 安全的util函数 - 只接收简单的映射表参数，不暴露任何config细节 ============
+// ============ Safe utility functions: accept only simple mapping inputs and do not expose config internals ============
 
 /**
- * 根据 priceId 获取对应的积分数量
+ * Get the credit amount for a price ID.
  *
- * 🔒 安全设计：
- * - util层负责解析config，提取所需数据
- * - 只返回查询结果，不暴露任何config结构
- * - 调用方（应用层）通过wrapper隐藏config对象
+ * Security design:
+ * - The utility layer parses the config and extracts only the required data.
+ * - Only the query result is returned; the full config structure is not exposed.
+ * - Application-level wrappers hide the config object from callers.
  *
- * @param priceId - 查询的价格ID
- * @param config - MoneyPriceConfig对象（由应用层提供）
- * @returns 对应的积分数量，或null
+ * @param priceId - Price ID to query.
+ * @param config - MoneyPriceConfig object provided by the application layer.
+ * @returns The matching credit amount, or null.
  */
 export function getCreditsFromPriceIdUtil(
   priceId: string | undefined,
@@ -76,9 +76,9 @@ export function getCreditsFromPriceIdUtil(
     return null;
   }
 
-  // 遍历所有支付提供商
+  // Iterate through all payment providers.
   for (const provider of Object.values(config.paymentProviders)) {
-    // 遍历订阅产品
+    // Iterate through subscription products.
     const subscriptionProducts = (
       provider.subscriptionProducts || provider.products
     ) as Record<string, any>;
@@ -96,7 +96,7 @@ export function getCreditsFromPriceIdUtil(
       }
     }
 
-    // 遍历积分包产品
+    // Iterate through credit pack products.
     const creditPacks = provider.creditPackProducts as Record<string, any>;
     if (creditPacks) {
       for (const pack of Object.values(creditPacks)) {
@@ -112,23 +112,23 @@ export function getCreditsFromPriceIdUtil(
 }
 
 /**
- * 根据查询参数获取价格配置
+ * Get price configuration by query parameters.
  *
- * 支持三种查询方式：
- * 1. 按 priceId 直接查询
- * 2. 按 plan + billingType 查询
- * 3. 按 plan 查询
+ * Supported query modes:
+ * 1. Query directly by priceId.
+ * 2. Query by plan and billingType.
+ * 3. Query by plan.
  *
- * 🔒 安全设计：
- * - util层负责解析config，提取和匹配数据
- * - 只返回查询结果，不暴露任何config结构
- * - 调用方（应用层）通过wrapper隐藏config对象
+ * Security design:
+ * - The utility layer parses the config and extracts only matching data.
+ * - Only the query result is returned; the full config structure is not exposed.
+ * - Application-level wrappers hide the config object from callers.
  *
- * @param priceId - 查询的价格ID（可选）
- * @param plan - 查询的套餐名称如'P2'、'U3'（可选）
- * @param billingType - 查询的计费类型如'monthly'、'yearly'（可选）
- * @param config - MoneyPriceConfig对象（由应用层提供）
- * @returns 匹配的价格配置，包含计算好的元数据（priceName、description、interval）
+ * @param priceId - Optional price ID to query.
+ * @param plan - Optional plan name, such as 'P2' or 'U3'.
+ * @param billingType - Optional billing type, such as 'monthly' or 'yearly'.
+ * @param config - MoneyPriceConfig object provided by the application layer.
+ * @returns The matching price config with derived metadata: priceName, description, and interval.
  */
 export function getPriceConfigUtil(
   priceId: string | undefined,
@@ -136,9 +136,9 @@ export function getPriceConfigUtil(
   billingType: string | undefined,
   config: MoneyPriceConfig
 ): (EnhancePricePlan & { priceName: string; description: string; interval?: string }) | null {
-  // 遍历所有支付提供商
+  // Iterate through all payment providers.
   for (const provider of Object.values(config.paymentProviders)) {
-    // 遍历订阅产品
+    // Iterate through subscription products.
     const subscriptionProducts = (
       provider.subscriptionProducts || provider.products
     ) as Record<string, any>;
@@ -149,8 +149,8 @@ export function getPriceConfigUtil(
           for (const [billingKey, planConfig] of Object.entries(product.plans)) {
             const plan_config = planConfig as any;
 
-            // 匹配逻辑：按优先级尝试
-            // 1. 按priceId精确匹配（优先级最高）
+            // Matching order by priority.
+            // 1. Exact priceId match with highest priority.
             if (priceId && plan_config.priceId === priceId) {
               return {
                 ...plan_config,
@@ -160,7 +160,7 @@ export function getPriceConfigUtil(
               };
             }
 
-            // 2. 按plan和billingType同时匹配
+            // 2. Match by both plan and billingType.
             if (!priceId && plan && billingType) {
               if (productKey === plan && billingKey === billingType) {
                 return {
@@ -172,7 +172,7 @@ export function getPriceConfigUtil(
               }
             }
 
-            // 3. 按plan匹配（billingType为空时）
+            // 3. Match by plan when billingType is empty.
             if (!priceId && !billingType && plan && productKey === plan) {
               return {
                 ...plan_config,
@@ -186,13 +186,13 @@ export function getPriceConfigUtil(
       }
     }
 
-    // 遍历积分包产品
+    // Iterate through credit pack products.
     const creditPacks = provider.creditPackProducts as Record<string, any>;
     if (creditPacks) {
       for (const [packKey, pack] of Object.entries(creditPacks)) {
         const pack_typed = pack as any;
 
-        // 积分包匹配
+        // Credit pack match.
         if (priceId && pack_typed.priceId === priceId) {
           return {
             priceId: pack_typed.priceId,
@@ -205,7 +205,7 @@ export function getPriceConfigUtil(
           };
         }
 
-        // 按plan和onetime匹配
+        // Match by plan and one-time billing.
         if (!priceId && plan && billingType === 'onetime') {
           if (packKey === plan) {
             return {
@@ -220,7 +220,7 @@ export function getPriceConfigUtil(
           }
         }
 
-        // 按plan匹配（billingType为空时也能找到first积分包）
+        // Match by plan; also resolves the first credit pack when billingType is empty.
         if (!priceId && !billingType && plan && packKey === plan) {
           return {
             priceId: pack_typed.priceId,
@@ -237,4 +237,4 @@ export function getPriceConfigUtil(
   }
 
   return null;
-}
+}

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

@@ -19,6 +19,7 @@ import {
 } from './money-price-types';
 import { redirectToCustomerPortal } from './customer-portal';
 import { themeButtonGradientClass, themeButtonGradientHoverClass, themeIconColor } from '@windrun-huaiin/base-ui/lib';
+import { AnimeBeamFrame } from '../anime';
 
 type BillingType = string;
 type ProcessingTarget = {
@@ -56,12 +57,12 @@ export function MoneyPriceInteractive({
   const billingOptions = useMemo(() => {
     const options = data.billingSwitch.options as BillingOption[];
 
-    // 如果配置了 enabledBillingTypes，只显示配置的类型
+    // If enabledBillingTypes is configured, show only those billing types.
     if (enabledBillingTypes?.length) {
       return options.filter(option => enabledBillingTypes.includes(option.key));
     }
 
-    // 否则显示所有配置的选项
+    // Otherwise show all configured options.
     return options;
   }, [data.billingSwitch.options, enabledBillingTypes]);
   const billingOptionMap = useMemo(() => {
@@ -73,12 +74,12 @@ export function MoneyPriceInteractive({
   const defaultBilling = useMemo<BillingType>(() => {
     const defaultKey = data.billingSwitch.defaultKey;
 
-    // 如果默认值在可用选项中，使用默认值
+    // Use the default value when it is available.
     if (billingOptions.some(opt => opt.key === defaultKey)) {
       return defaultKey;
     }
 
-    // 否则使用第一个可用选项
+    // Otherwise use the first available option.
     return billingOptions[0]?.key || 'monthly';
   }, [data.billingSwitch.defaultKey, billingOptions]);
 
@@ -95,18 +96,18 @@ export function MoneyPriceInteractive({
   const priceIdsByCycle = useMemo(() => {
     const priceIds: Record<string, string[]> = {};
 
-    // 为每个可用的计费类型创建价格ID数组
+    // Build a price ID list for each available billing type.
     billingOptions.forEach(option => {
       priceIds[option.key] = [];
 
       if (option.key === 'onetime') {
-        // 处理积分包产品
+        // Handle credit pack products.
         const creditPacks = providerConfig.creditPackProducts || {};
         Object.values(creditPacks).forEach((pack: any) => {
           priceIds[option.key].push(pack.priceId);
         });
       } else {
-        // 处理订阅产品
+        // Handle subscription products.
         const products = providerConfig.subscriptionProducts || providerConfig.products || {};
         PLAN_KEYS.forEach(planKey => {
           const product = (products as any)[planKey];
@@ -341,7 +342,7 @@ export function MoneyPriceInteractive({
     enableSubscriptionUpgrade
   ]);
 
-  // 根据当前计费类型动态选择要显示的 plans
+  // Select visible plans dynamically based on the current billing type.
   const currentPlans = useMemo(() => {
     if (billingType === 'onetime') {
       return data.creditsPlans || [];
@@ -374,12 +375,12 @@ export function MoneyPriceInteractive({
   const discountBadgeText = useMemo(() => {
     if (!selectedBillingOption?.discountText) return null;
 
-    // 对于 onetime 模式，直接显示 discountText，不依赖 discountPercent
+    // In one-time mode, show discountText directly without relying on discountPercent.
     if (billingType === 'onetime') {
       return selectedBillingOption.discountText;
     }
 
-    // 对于订阅模式，查找 discountPercent 并替换
+    // In subscription mode, find discountPercent and interpolate it.
     let discountPercent: number | null = null;
     const products = providerConfig.subscriptionProducts || providerConfig.products || {};
 
@@ -394,7 +395,7 @@ export function MoneyPriceInteractive({
     return selectedBillingOption.discountText.replace('{percent}', String(discountPercent));
   }, [selectedBillingOption, providerConfig, billingType]);
 
-  // 配置移动端BillingTypeButton悬浮样式
+  // Configure the mobile floating style for BillingTypeButton.
   return (
     <>
       <div className="flex justify-center mb-6 max-md:sticky max-md:top-30 max-md:z-30 max-md:py-2 max-md:bg-transparent">
@@ -442,18 +443,36 @@ export function MoneyPriceInteractive({
 
           const showBillingSubtitle = plan.showBillingSubTitle !== false;
           const hasDiscount = !!pricing.discountPercent && !!pricing.originalAmount;
+          const hasStrictDiffAnime = Object.prototype.hasOwnProperty.call(
+            plan.strictDiffAnime ?? {},
+            billingType
+          );
+          const animeTone = hasStrictDiffAnime
+            ? plan.strictDiffAnime?.[billingType]
+            : plan.animeTone;
+          const hasAnimeTone = !!animeTone;
 
-          // 移动端宽度样式
           return (
+            <AnimeBeamFrame
+              key={`${billingType}-${plan.key}-${animeTone ?? 'none'}`}
+              active={false}
+              interactive={hasAnimeTone}
+              tone={animeTone ?? 'theme'}
+              radius={16}
+              className={cn(
+                'h-full w-[85vw] max-w-[360px]',
+                'md:w-[clamp(280px,32vw,360px)] md:max-w-[360px] md:shrink-0',
+              )}
+            >
             <div
-              key={plan.key}
               data-price-plan={planKey}
               className={cn(
-                'flex flex-col bg-white dark:bg-gray-800/60 rounded-2xl border border-gray-300 dark:border-[#7c3aed40] transition p-5 md:p-8 h-full shadow-sm dark:shadow-none w-[85vw] max-w-[360px]',
-                'md:w-[clamp(280px,32vw,360px)] md:max-w-[360px] md:shrink-0',
-                'hover:border-2 hover:border-current', 
-                'focus-within:border-2 focus-within:border-current',
-                themeIconColor
+                'flex flex-col bg-white dark:bg-gray-800/60 rounded-2xl border border-gray-300 dark:border-[#7c3aed40] transition p-5 md:p-8 h-full shadow-sm dark:shadow-none',
+                !hasAnimeTone && [
+                  'hover:border-current',
+                  'focus-within:border-current',
+                  themeIconColor,
+                ]
               )}
               style={{ minHeight: maxFeaturesCount * (isTouchDevice ? 86 : 100) }}
             >
@@ -498,7 +517,7 @@ export function MoneyPriceInteractive({
                     data-price-subtitle={planKey}
                   >
                     {showBillingSubtitle && billingType === 'onetime' ? (
-                      // OneTime 模式下的特殊处理：普通文本 + 带样式的产品副标题
+                      // Special one-time mode rendering: plain text plus styled product subtitle.
                       <>
                         {selectedBillingOption?.subTitle && (
                           <span className="text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium">
@@ -512,7 +531,7 @@ export function MoneyPriceInteractive({
                         )}
                       </>
                     ) : (
-                      // 其他模式下保持原逻辑
+                      // Keep the original rendering for other modes.
                       showBillingSubtitle && (
                         <span className="text-[11px] md:text-xs text-gray-700 dark:text-gray-300 font-medium">
                           {selectedBillingOption?.subTitle || ''}
@@ -570,6 +589,7 @@ export function MoneyPriceInteractive({
                 enableSubscriptionUpgrade={enableSubscriptionUpgrade}
               />
             </div>
+            </AnimeBeamFrame>
           );
         })}
         </div>

package/src/main/money-price/money-price-types.ts

@@ -2,10 +2,10 @@ import type { XCredit, XSubscription, XUser } from '../../clerk/fingerprint/type
 
 /**
  * Money Price Component Types
- * 价格组件类型定义
+ * Pricing component type definitions.
  */
 
-// 用户状态枚举
+// User status enum.
 export enum UserState {
   Anonymous = 'anonymous',
   FreeUser = 'free',
@@ -13,7 +13,7 @@ export enum UserState {
   UltraUser = 'ultra'
 }
 
-// 用户上下文
+// User context.
 export interface UserContext {
   isAuthenticated: boolean;
   subscriptionStatus: UserState;
@@ -29,10 +29,10 @@ export interface InitUserContext {
   isClerkAuthenticated?: boolean;
 }
 
-// 支付供应商类型
+// Payment provider type.
 export type PaymentProvider = 'stripe' | 'apple' | 'paypal' | 'wechat' | 'alipay'  ;
 
-// 价格计划
+// Price plan.
 export interface EnhancePricePlan {
   priceId: string;
   amount: number;
@@ -42,13 +42,13 @@ export interface EnhancePricePlan {
   credits?: number;
 }
 
-// 订阅产品配置
+// Subscription product configuration.
 export interface SubscriptionProductConfig {
   key: string;
   plans: Record<string, EnhancePricePlan>;
 }
 
-// 积分包产品配置
+// Credit pack product configuration.
 export interface CreditPackProductConfig {
   key: string;
   priceId: string;
@@ -57,7 +57,7 @@ export interface CreditPackProductConfig {
   credits: number;
 }
 
-// 支付供应商配置
+// Payment provider configuration.
 export interface PaymentProviderConfig {
   provider: PaymentProvider;
   enabled: boolean;
@@ -71,7 +71,7 @@ export interface PaymentProviderConfig {
     P2: CreditPackProductConfig;
     U3: CreditPackProductConfig;
   };
-  // 兼容旧结构
+  // Backward-compatible legacy shape.
   products?: {
     F1: SubscriptionProductConfig;
     P2: SubscriptionProductConfig;
@@ -79,7 +79,7 @@ export interface PaymentProviderConfig {
   };
 }
 
-// 主配置
+// Main configuration.
 export interface MoneyPriceConfig {
   paymentProviders: {
     [provider: string]: PaymentProviderConfig;
@@ -92,7 +92,7 @@ export interface MoneyPriceConfig {
   };
 }
 
-// 组件属性
+// Component props.
 export interface MoneyPriceProps {
   locale: string;
   config: MoneyPriceConfig;
@@ -107,7 +107,7 @@ export interface MoneyPriceProps {
   initialBillingType?: string;
 }
 
-// 交互组件属性
+// Interactive component props.
 export interface MoneyPriceInteractiveProps {
   data: MoneyPriceData;
   config: MoneyPriceConfig;
@@ -122,7 +122,7 @@ export interface MoneyPriceInteractiveProps {
   isInitLoading?: boolean;
 }
 
-// 按钮组件属性
+// Button component props.
 export interface MoneyPriceButtonProps {
   planKey: 'F1' | 'P2' | 'U3';
   userContext: UserContext;
@@ -143,7 +143,10 @@ export interface MoneyPriceButtonProps {
   enableSubscriptionUpgrade?: boolean;
 }
 
-// 数据结构
+export type MoneyPriceAnimeTone = 'theme' | 'rainbow' | 'mono' | 'warm' | 'cool';
+export type MoneyPriceStrictDiffAnime = Record<string, MoneyPriceAnimeTone | null | undefined>;
+
+// Data structures.
 export interface MoneyPriceData {
   title: string;
   subtitle: string;
@@ -160,6 +163,8 @@ export interface MoneyPriceData {
   subscriptionPlans: Array<{
     key: string;
     title: string;
+    animeTone?: MoneyPriceAnimeTone;
+    strictDiffAnime?: MoneyPriceStrictDiffAnime;
     showBillingSubTitle?: boolean;
     titleTags?: string[];
     features?: Array<{
@@ -173,6 +178,8 @@ export interface MoneyPriceData {
     key: string;
     title: string;
     subtitle?: string;
+    animeTone?: MoneyPriceAnimeTone;
+    strictDiffAnime?: MoneyPriceStrictDiffAnime;
     showBillingSubTitle?: boolean;
     titleTags?: string[];
     features?: Array<{

package/src/main/money-price/server.ts

@@ -11,6 +11,8 @@ export type {
   MoneyPriceInteractiveProps,
   MoneyPriceButtonProps,
   MoneyPriceData,
+  MoneyPriceAnimeTone,
+  MoneyPriceStrictDiffAnime,
   InitUserContext,
   PaymentProvider,
   PaymentProviderConfig,