@windrun-huaiin/third-ui 26.0.0 → 28.0.0

package/dist/main/buttons/x-button.mjs

@@ -0,0 +1,90 @@
+"use client";
+import { __awaiter } from 'tslib';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import React__default, { useState, useRef, useEffect } from 'react';
+import { Loader2Icon, ChevronDownIcon } from '@windrun-huaiin/base-ui/icons';
+import { themeIconColor, themeBgColor, themeBorderColor, themeMainBgColor } from '@windrun-huaiin/base-ui/lib';
+import { cn } from '@windrun-huaiin/lib/utils';
+
+function XButton(props) {
+    var _a, _b, _c;
+    const [isLoading, setIsLoading] = useState(false);
+    const [menuOpen, setMenuOpen] = useState(false);
+    const menuRef = useRef(null);
+    const { iconClassName } = props;
+    const defaultIconClass = "w-5 h-5";
+    const variant = (_a = props.variant) !== null && _a !== void 0 ? _a : 'default';
+    const finalIconClass = cn(variant === 'default' ? '' : themeIconColor, iconClassName || defaultIconClass);
+    const loadingIconClass = cn(finalIconClass, "mr-1 animate-spin");
+    const chevronIconClass = "w-6 h-6";
+    const renderIcon = (icon) => {
+        if (React__default.isValidElement(icon)) {
+            return React__default.cloneElement(icon, {
+                className: cn(finalIconClass, icon.props.className),
+            });
+        }
+        return icon;
+    };
+    useEffect(() => {
+        if (props.type === 'split') {
+            const handleClickOutside = (event) => {
+                if (menuRef.current && !menuRef.current.contains(event.target)) {
+                    setMenuOpen(false);
+                }
+            };
+            if (menuOpen) {
+                document.addEventListener('mousedown', handleClickOutside);
+            }
+            return () => {
+                document.removeEventListener('mousedown', handleClickOutside);
+            };
+        }
+    }, [menuOpen, props.type]);
+    const handleButtonClick = (onClick) => __awaiter(this, void 0, void 0, function* () {
+        if (isLoading)
+            return;
+        setIsLoading(true);
+        try {
+            yield onClick();
+        }
+        catch (error) {
+            console.error('Button click error:', error);
+        }
+        finally {
+            setIsLoading(false);
+        }
+    });
+    const baseButtonClass = "flex items-center justify-center gap-2 px-4 py-2 text-sm font-semibold transition-colors";
+    const singleButtonVariantClass = variant === 'soft'
+        ? cn(themeBgColor, themeIconColor, themeBorderColor, "border hover:brightness-95")
+        : variant === 'subtle'
+            ? cn(themeMainBgColor, themeIconColor, "border border-neutral-200 hover:bg-neutral-50 dark:border-neutral-800 dark:hover:bg-neutral-800")
+            : "bg-neutral-200 dark:bg-neutral-800 text-neutral-700 dark:text-white hover:bg-neutral-300 dark:hover:bg-neutral-700";
+    const splitMainButtonVariantClass = variant === 'soft'
+        ? cn("bg-transparent hover:bg-black/5 dark:hover:bg-white/5", themeIconColor)
+        : variant === 'subtle'
+            ? cn("bg-transparent hover:bg-neutral-50 dark:hover:bg-neutral-800", themeIconColor)
+            : "bg-neutral-200 dark:bg-neutral-800 text-neutral-700 dark:text-white hover:bg-neutral-300 dark:hover:bg-neutral-700";
+    const splitDropdownVariantClass = variant === 'soft'
+        ? cn("bg-transparent hover:bg-black/5 dark:hover:bg-white/5 sm:border-l", themeIconColor, themeBorderColor)
+        : variant === 'subtle'
+            ? cn("bg-transparent hover:bg-neutral-50 dark:hover:bg-neutral-800 sm:border-l", themeIconColor, "border-neutral-200 dark:border-neutral-800")
+            : "bg-neutral-200 dark:bg-neutral-800 text-neutral-700 dark:text-white hover:bg-neutral-300 dark:hover:bg-neutral-700 sm:border-l sm:border-neutral-300 sm:dark:border-neutral-700";
+    const disabledClass = "opacity-60 cursor-not-allowed";
+    if (props.type === 'single') {
+        const { button, loadingText, minWidth = 'min-w-[110px]', className = '' } = props;
+        const isDisabled = button.disabled || isLoading;
+        const actualLoadingText = loadingText || ((_b = button.text) === null || _b === void 0 ? void 0 : _b.trim()) || 'Loading...';
+        return (jsx("button", { onClick: () => handleButtonClick(button.onClick), disabled: isDisabled, className: cn("w-full sm:w-auto", minWidth, baseButtonClass, singleButtonVariantClass, "rounded-full", isDisabled && disabledClass, className), title: button.text, children: isLoading ? (jsxs(Fragment, { children: [jsx(Loader2Icon, { className: loadingIconClass }), jsx("span", { children: actualLoadingText })] })) : (jsxs(Fragment, { children: [renderIcon(button.icon), jsx("span", { children: button.text })] })) }));
+    }
+    const { mainButton, menuItems, loadingText, menuWidth = 'w-full sm:w-40', className = '', mainButtonClassName = '', dropdownButtonClassName = '' } = props;
+    const isMainDisabled = mainButton.disabled || isLoading;
+    const actualLoadingText = loadingText || ((_c = mainButton.text) === null || _c === void 0 ? void 0 : _c.trim()) || 'Loading...';
+    return (jsxs("div", { className: cn("relative flex flex-row items-stretch w-full sm:w-auto rounded-full gap-0", menuOpen && "z-90", className), children: [jsx("button", { onClick: () => handleButtonClick(mainButton.onClick), disabled: isMainDisabled, className: cn("flex-1 min-w-0 sm:min-w-[100px] sm:flex-initial rounded-l-full", baseButtonClass, splitMainButtonVariantClass, isMainDisabled && disabledClass, mainButtonClassName), onMouseDown: e => { if (e.button === 2)
+                    e.preventDefault(); }, title: mainButton.text, children: isLoading ? (jsxs(Fragment, { children: [jsx(Loader2Icon, { className: loadingIconClass }), jsx("span", { children: actualLoadingText })] })) : (jsxs(Fragment, { children: [renderIcon(mainButton.icon), jsx("span", { children: mainButton.text })] })) }), jsx("button", { type: "button", onClick: () => setMenuOpen(!menuOpen), disabled: isLoading, className: cn("w-12 rounded-r-full", baseButtonClass, splitDropdownVariantClass, isLoading && disabledClass, dropdownButtonClassName), "aria-label": "Open menu", children: jsx(ChevronDownIcon, { className: cn(chevronIconClass, menuOpen && "rotate-180", "transition-transform") }) }), menuOpen && (jsx("div", { ref: menuRef, className: cn("absolute top-full right-0 mt-2 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg shadow-lg z-50 overflow-hidden", menuWidth), children: menuItems.map((item, index) => (jsxs("button", { type: "button", onClick: () => {
+                        setMenuOpen(false);
+                        handleButtonClick(item.onClick);
+                    }, disabled: item.disabled || isLoading, className: cn("w-full flex items-center gap-2 px-3 py-2 text-sm text-left hover:bg-neutral-100 dark:hover:bg-neutral-700 transition-colors", item.disabled && disabledClass, item.splitTopBorder && "border-t border-neutral-200 dark:border-neutral-700"), children: [renderIcon(item.icon), jsx("span", { className: "flex-1", children: item.text }), item.tag && (jsx("span", { className: cn("px-1.5 py-0.5 text-xs rounded", item.tag.color || "bg-blue-100 text-blue-800"), children: item.tag.text }))] }, index))) }))] }));
+}
+
+export { XButton };

package/dist/main/buttons/x-toggle-button.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+export type XToggleButtonOption = {
+    value: string;
+    label: React.ReactNode;
+    disabled?: boolean;
+    className?: string;
+    badge?: React.ReactNode;
+    mobileIcon?: React.ReactNode;
+};
+type XToggleButtonSize = 'default' | 'compact';
+export type XToggleButtonProps = {
+    options: XToggleButtonOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    disabled?: boolean;
+    className?: string;
+    itemClassName?: string;
+    activeItemClassName?: string;
+    inactiveItemClassName?: string;
+    badgeClassName?: string;
+    minItemWidthClassName?: string;
+    maxItemWidthClassName?: string;
+    itemTextClassName?: string;
+    itemPaddingClassName?: string;
+    size?: XToggleButtonSize;
+    fullWidth?: boolean;
+    name?: string;
+    ariaLabel?: string;
+};
+export declare function XToggleButton({ options, value, defaultValue, onChange, disabled, className, itemClassName, activeItemClassName, inactiveItemClassName, badgeClassName, minItemWidthClassName, maxItemWidthClassName, itemTextClassName, itemPaddingClassName, size, fullWidth, name, ariaLabel, }: XToggleButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/main/buttons/x-toggle-button.js

@@ -0,0 +1,95 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var utils = require('@windrun-huaiin/lib/utils');
+var lib = require('@windrun-huaiin/base-ui/lib');
+
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+function XToggleButton({ options, value, defaultValue, onChange, disabled = false, className, itemClassName, activeItemClassName, inactiveItemClassName, badgeClassName, minItemWidthClassName, maxItemWidthClassName, itemTextClassName, itemPaddingClassName, size = 'default', fullWidth = false, name, ariaLabel, }) {
+    const containerRef = React__namespace.useRef(null);
+    const activeButtonRef = React__namespace.useRef(null);
+    const [badgeOffset, setBadgeOffset] = React__namespace.useState(0);
+    const normalizedOptions = React__namespace.useMemo(() => options.filter((option) => option.value.trim()), [options]);
+    const fallbackValue = React__namespace.useMemo(() => {
+        var _a, _b;
+        if (defaultValue && normalizedOptions.some((option) => option.value === defaultValue)) {
+            return defaultValue;
+        }
+        return (_b = (_a = normalizedOptions[0]) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    }, [defaultValue, normalizedOptions]);
+    const isControlled = value !== undefined;
+    const [internalValue, setInternalValue] = React__namespace.useState(fallbackValue);
+    React__namespace.useEffect(() => {
+        if (!isControlled) {
+            setInternalValue(fallbackValue);
+        }
+    }, [fallbackValue, isControlled]);
+    const selectedValue = isControlled ? value !== null && value !== void 0 ? value : '' : internalValue;
+    React__namespace.useEffect(() => {
+        if (activeButtonRef.current && containerRef.current) {
+            const buttonRect = activeButtonRef.current.getBoundingClientRect();
+            const containerRect = containerRef.current.getBoundingClientRect();
+            const buttonCenterX = buttonRect.left - containerRect.left + buttonRect.width / 2;
+            setBadgeOffset(buttonCenterX);
+        }
+    }, [selectedValue]);
+    function handleSelect(nextValue, optionDisabled) {
+        if (disabled || optionDisabled || nextValue === selectedValue) {
+            return;
+        }
+        if (!isControlled) {
+            setInternalValue(nextValue);
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+    }
+    const containerSizeClass = size === 'compact'
+        ? 'px-1.5 py-1.5 gap-0'
+        : 'px-2 py-2 gap-0 sm:px-3 sm:py-3 sm:gap-0';
+    const defaultItemTextClass = size === 'compact'
+        ? 'text-xs'
+        : 'text-xs sm:text-sm md:text-base';
+    const finalItemTextClassName = itemTextClassName !== null && itemTextClassName !== void 0 ? itemTextClassName : defaultItemTextClass;
+    const defaultItemPaddingClass = size === 'compact'
+        ? 'px-2 py-1'
+        : 'px-2 py-1.5 sm:px-3 sm:py-2';
+    const finalItemPaddingClassName = itemPaddingClassName !== null && itemPaddingClassName !== void 0 ? itemPaddingClassName : defaultItemPaddingClass;
+    const minItemWidthClass = minItemWidthClassName !== null && minItemWidthClassName !== void 0 ? minItemWidthClassName : 'min-w-[80px] sm:min-w-[100px] md:min-w-[120px]';
+    const maxItemWidthClass = maxItemWidthClassName !== null && maxItemWidthClassName !== void 0 ? maxItemWidthClassName : 'max-w-[120px] sm:max-w-[160px]';
+    const selectedOption = normalizedOptions.find((opt) => opt.value === selectedValue);
+    return (jsxRuntime.jsxs("div", { ref: containerRef, role: "radiogroup", "aria-label": ariaLabel, "aria-disabled": disabled, className: utils.cn('relative inline-flex items-center rounded-full border border-gray-300 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900', fullWidth && 'flex w-full', containerSizeClass, className), children: [(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.badge) ? (jsxRuntime.jsx("span", { style: {
+                    left: `${badgeOffset}px`,
+                    transform: 'translate(-50%, calc(-50% - 1px))'
+                }, className: utils.cn('absolute top-0 z-20 whitespace-nowrap rounded-md bg-yellow-100 px-2.5 py-0.5 text-[0.625rem] font-semibold text-yellow-800 shadow-sm sm:text-xs', badgeClassName), children: selectedOption.badge })) : null, normalizedOptions.map((option) => {
+                const active = option.value === selectedValue;
+                const optionDisabled = disabled || option.disabled;
+                return (jsxRuntime.jsx("div", { className: utils.cn('relative flex items-center justify-center', fullWidth && 'flex-1'), children: jsxRuntime.jsx("button", { ref: active ? activeButtonRef : null, type: "button", role: "radio", name: name, "aria-checked": active, "aria-pressed": active, disabled: optionDisabled, onClick: () => handleSelect(option.value, option.disabled), className: utils.cn('relative z-10 inline-flex items-center justify-center rounded-full font-medium text-center transition truncate', fullWidth && 'w-full', !fullWidth && minItemWidthClass, !fullWidth && maxItemWidthClass, finalItemPaddingClassName, finalItemTextClassName, active
+                            ? utils.cn('text-white shadow-sm', lib.themeButtonGradientClass, lib.themeButtonGradientHoverClass, activeItemClassName)
+                            : utils.cn('text-gray-800 hover:text-gray-900 dark:text-gray-200 dark:hover:text-gray-100', inactiveItemClassName), optionDisabled && 'cursor-not-allowed opacity-60', itemClassName, option.className), children: option.mobileIcon ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "hidden sm:block", children: option.label }), jsxRuntime.jsx("span", { className: "block sm:hidden", children: active && React__namespace.isValidElement(option.mobileIcon)
+                                        ? React__namespace.cloneElement(option.mobileIcon, {
+                                            className: utils.cn(option.mobileIcon.props.className, 'text-white'),
+                                        })
+                                        : option.mobileIcon })] })) : (option.label) }) }, option.value));
+            })] }));
+}
+
+exports.XToggleButton = XToggleButton;

package/dist/main/buttons/x-toggle-button.mjs

@@ -0,0 +1,74 @@
+"use client";
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { cn } from '@windrun-huaiin/lib/utils';
+import { themeButtonGradientClass, themeButtonGradientHoverClass } from '@windrun-huaiin/base-ui/lib';
+
+function XToggleButton({ options, value, defaultValue, onChange, disabled = false, className, itemClassName, activeItemClassName, inactiveItemClassName, badgeClassName, minItemWidthClassName, maxItemWidthClassName, itemTextClassName, itemPaddingClassName, size = 'default', fullWidth = false, name, ariaLabel, }) {
+    const containerRef = React.useRef(null);
+    const activeButtonRef = React.useRef(null);
+    const [badgeOffset, setBadgeOffset] = React.useState(0);
+    const normalizedOptions = React.useMemo(() => options.filter((option) => option.value.trim()), [options]);
+    const fallbackValue = React.useMemo(() => {
+        var _a, _b;
+        if (defaultValue && normalizedOptions.some((option) => option.value === defaultValue)) {
+            return defaultValue;
+        }
+        return (_b = (_a = normalizedOptions[0]) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    }, [defaultValue, normalizedOptions]);
+    const isControlled = value !== undefined;
+    const [internalValue, setInternalValue] = React.useState(fallbackValue);
+    React.useEffect(() => {
+        if (!isControlled) {
+            setInternalValue(fallbackValue);
+        }
+    }, [fallbackValue, isControlled]);
+    const selectedValue = isControlled ? value !== null && value !== void 0 ? value : '' : internalValue;
+    React.useEffect(() => {
+        if (activeButtonRef.current && containerRef.current) {
+            const buttonRect = activeButtonRef.current.getBoundingClientRect();
+            const containerRect = containerRef.current.getBoundingClientRect();
+            const buttonCenterX = buttonRect.left - containerRect.left + buttonRect.width / 2;
+            setBadgeOffset(buttonCenterX);
+        }
+    }, [selectedValue]);
+    function handleSelect(nextValue, optionDisabled) {
+        if (disabled || optionDisabled || nextValue === selectedValue) {
+            return;
+        }
+        if (!isControlled) {
+            setInternalValue(nextValue);
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+    }
+    const containerSizeClass = size === 'compact'
+        ? 'px-1.5 py-1.5 gap-0'
+        : 'px-2 py-2 gap-0 sm:px-3 sm:py-3 sm:gap-0';
+    const defaultItemTextClass = size === 'compact'
+        ? 'text-xs'
+        : 'text-xs sm:text-sm md:text-base';
+    const finalItemTextClassName = itemTextClassName !== null && itemTextClassName !== void 0 ? itemTextClassName : defaultItemTextClass;
+    const defaultItemPaddingClass = size === 'compact'
+        ? 'px-2 py-1'
+        : 'px-2 py-1.5 sm:px-3 sm:py-2';
+    const finalItemPaddingClassName = itemPaddingClassName !== null && itemPaddingClassName !== void 0 ? itemPaddingClassName : defaultItemPaddingClass;
+    const minItemWidthClass = minItemWidthClassName !== null && minItemWidthClassName !== void 0 ? minItemWidthClassName : 'min-w-[80px] sm:min-w-[100px] md:min-w-[120px]';
+    const maxItemWidthClass = maxItemWidthClassName !== null && maxItemWidthClassName !== void 0 ? maxItemWidthClassName : 'max-w-[120px] sm:max-w-[160px]';
+    const selectedOption = normalizedOptions.find((opt) => opt.value === selectedValue);
+    return (jsxs("div", { ref: containerRef, role: "radiogroup", "aria-label": ariaLabel, "aria-disabled": disabled, className: cn('relative inline-flex items-center rounded-full border border-gray-300 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900', fullWidth && 'flex w-full', containerSizeClass, className), children: [(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.badge) ? (jsx("span", { style: {
+                    left: `${badgeOffset}px`,
+                    transform: 'translate(-50%, calc(-50% - 1px))'
+                }, className: cn('absolute top-0 z-20 whitespace-nowrap rounded-md bg-yellow-100 px-2.5 py-0.5 text-[0.625rem] font-semibold text-yellow-800 shadow-sm sm:text-xs', badgeClassName), children: selectedOption.badge })) : null, normalizedOptions.map((option) => {
+                const active = option.value === selectedValue;
+                const optionDisabled = disabled || option.disabled;
+                return (jsx("div", { className: cn('relative flex items-center justify-center', fullWidth && 'flex-1'), children: jsx("button", { ref: active ? activeButtonRef : null, type: "button", role: "radio", name: name, "aria-checked": active, "aria-pressed": active, disabled: optionDisabled, onClick: () => handleSelect(option.value, option.disabled), className: cn('relative z-10 inline-flex items-center justify-center rounded-full font-medium text-center transition truncate', fullWidth && 'w-full', !fullWidth && minItemWidthClass, !fullWidth && maxItemWidthClass, finalItemPaddingClassName, finalItemTextClassName, active
+                            ? cn('text-white shadow-sm', themeButtonGradientClass, themeButtonGradientHoverClass, activeItemClassName)
+                            : cn('text-gray-800 hover:text-gray-900 dark:text-gray-200 dark:hover:text-gray-100', inactiveItemClassName), optionDisabled && 'cursor-not-allowed opacity-60', itemClassName, option.className), children: option.mobileIcon ? (jsxs(Fragment, { children: [jsx("span", { className: "hidden sm:block", children: option.label }), jsx("span", { className: "block sm:hidden", children: active && React.isValidElement(option.mobileIcon)
+                                        ? React.cloneElement(option.mobileIcon, {
+                                            className: cn(option.mobileIcon.props.className, 'text-white'),
+                                        })
+                                        : option.mobileIcon })] })) : (option.label) }) }, option.value));
+            })] }));
+}
+
+export { XToggleButton };

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/credit/credit-overview-client.js

@@ -4,10 +4,11 @@
 var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var nextjs = require('@clerk/nextjs');
-var gradientButton = require('../../fuma/mdx/gradient-button.js');
+var gradientButton = require('../buttons/gradient-button.js');
+var React = require('react');
 var icons = require('@windrun-huaiin/base-ui/icons');
+require('@windrun-huaiin/base-ui/lib');
 var utils = require('@windrun-huaiin/lib/utils');
-var React = require('react');
 var customerPortal = require('../money-price/customer-portal.js');
 var creditNavButton = require('./credit-nav-button.js');
 

package/dist/main/credit/credit-overview-client.mjs

@@ -2,10 +2,11 @@
 import { __awaiter } from 'tslib';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useClerk } from '@clerk/nextjs';
-import { GradientButton } from '../../fuma/mdx/gradient-button.mjs';
+import { GradientButton } from '../buttons/gradient-button.mjs';
+import { useState, useRef, useCallback, useMemo, useLayoutEffect } from 'react';
 import { GemIcon, Settings2Icon, BellIcon, ChevronUpIcon, ChevronDownIcon, ShoppingCartIcon, CircleQuestionMarkIcon } from '@windrun-huaiin/base-ui/icons';
+import '@windrun-huaiin/base-ui/lib';
 import { cn } from '@windrun-huaiin/lib/utils';
-import { useState, useRef, useCallback, useMemo, useLayoutEffect } from 'react';
 import { redirectToCustomerPortal } from '../money-price/customer-portal.mjs';
 import { useCreditNavPopover } from './credit-nav-button.mjs';
 

package/dist/main/credit/index.d.ts

@@ -0,0 +1,4 @@
+export { CreditOverviewClient } from './credit-overview-client';
+export { CreditNavButton } from './credit-nav-button';
+export type { CreditOverviewTranslations } from './credit-overview-client';
+export type { CreditOverviewData, CreditBucket, CreditBucketStatus, SubscriptionInfo, } from './types';

package/dist/main/credit/index.js

@@ -0,0 +1,10 @@
+"use client";
+'use strict';
+
+var creditOverviewClient = require('./credit-overview-client.js');
+var creditNavButton = require('./credit-nav-button.js');
+
+
+
+exports.CreditOverviewClient = creditOverviewClient.CreditOverviewClient;
+exports.CreditNavButton = creditNavButton.CreditNavButton;

package/dist/main/credit/index.mjs

@@ -0,0 +1,3 @@
+"use client";
+export { CreditOverviewClient } from './credit-overview-client.mjs';
+export { CreditNavButton } from './credit-nav-button.mjs';

package/dist/main/credit/server.d.ts

@@ -0,0 +1,2 @@
+export { CreditOverview } from './credit-overview';
+export type { CreditOverviewData, CreditBucket, CreditBucketStatus, SubscriptionInfo, } from './types';

package/dist/main/credit/server.js

@@ -0,0 +1,7 @@
+'use strict';
+
+var creditOverview = require('./credit-overview.js');
+
+
+
+exports.CreditOverview = creditOverview.CreditOverview;

package/dist/main/credit/server.mjs

@@ -0,0 +1 @@
+export { CreditOverview } from './credit-overview.mjs';

package/dist/main/cta.js

@@ -3,9 +3,11 @@
 var tslib = require('tslib');
 var jsxRuntime = require('react/jsx-runtime');
 var server = require('next-intl/server');
-var gradientButton = require('../fuma/mdx/gradient-button.js');
-var utils = require('@windrun-huaiin/lib/utils');
+var gradientButton = require('./buttons/gradient-button.js');
+require('react');
+require('@windrun-huaiin/base-ui/icons');
 var lib = require('@windrun-huaiin/base-ui/lib');
+var utils = require('@windrun-huaiin/lib/utils');
 var richTextExpert = require('./rich-text-expert.js');
 var sectionLayout = require('./section-layout.js');
 

package/dist/main/cta.mjs

@@ -1,9 +1,11 @@
 import { __awaiter } from 'tslib';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { getTranslations } from 'next-intl/server';
-import { GradientButton } from '../fuma/mdx/gradient-button.mjs';
-import { cn } from '@windrun-huaiin/lib/utils';
+import { GradientButton } from './buttons/gradient-button.mjs';
+import 'react';
+import '@windrun-huaiin/base-ui/icons';
 import { themeIconColor } from '@windrun-huaiin/base-ui/lib';
+import { cn } from '@windrun-huaiin/lib/utils';
 import { richText } from './rich-text-expert.mjs';
 import { responsiveSection } from './section-layout.mjs';
 

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/hero/index.d.ts

@@ -0,0 +1,2 @@
+export { HeroMedia } from '../hero-media';
+export { HeroSection } from '../hero-section';

package/dist/main/hero/index.js

@@ -0,0 +1,10 @@
+"use client";
+'use strict';
+
+var heroMedia = require('../hero-media.js');
+var heroSection = require('../hero-section.js');
+
+
+
+exports.HeroMedia = heroMedia.HeroMedia;
+exports.HeroSection = heroSection.HeroSection;

package/dist/main/hero/index.mjs

@@ -0,0 +1,3 @@
+"use client";
+export { HeroMedia } from '../hero-media.mjs';
+export { HeroSection } from '../hero-section.mjs';

package/dist/main/home/server.d.ts

@@ -0,0 +1,7 @@
+export * from '../gallery/gallery-server';
+export * from '../usage';
+export * from '../features';
+export * from '../tips';
+export * from '../faq';
+export * from '../seo-content';
+export * from '../cta';

package/dist/main/home/server.js

@@ -0,0 +1,19 @@
+'use strict';
+
+var galleryServer = require('../gallery/gallery-server.js');
+var usage = require('../usage.js');
+var features = require('../features.js');
+var tips = require('../tips.js');
+var faq = require('../faq.js');
+var seoContent = require('../seo-content.js');
+var cta = require('../cta.js');
+
+
+
+exports.Gallery = galleryServer.Gallery;
+exports.Usage = usage.Usage;
+exports.Features = features.Features;
+exports.Tips = tips.Tips;
+exports.FAQ = faq.FAQ;
+exports.SeoContent = seoContent.SeoContent;
+exports.CTA = cta.CTA;

package/dist/main/home/server.mjs

@@ -0,0 +1,7 @@
+export { Gallery } from '../gallery/gallery-server.mjs';
+export { Usage } from '../usage.mjs';
+export { Features } from '../features.mjs';
+export { Tips } from '../tips.mjs';
+export { FAQ } from '../faq.mjs';
+export { SeoContent } from '../seo-content.mjs';
+export { CTA } from '../cta.mjs';