"use client";
import { jsxs, jsx } from 'react/jsx-runtime';
import { ClerkLoading, ClerkLoaded, SignedOut, SignInButton, SignedIn, UserButton } from '@clerk/nextjs';
import { globalLucideIcons } from '@windrun-huaiin/base-ui/components/server';
import { SignUpButtonWithFingerprint } from './signup-button-with-fingerprint-client.mjs';

function ClerkUserClient({ data }) {
    return (jsxs("div", { className: "flex items-center gap-2 h-10 mx-3 md:ml-1 md:mr-2", children: [jsx(ClerkLoading, { children: jsx("div", { className: "w-20 h-9 px-2 border border-gray-300 rounded-full hover:bg-gray-100 dark:border-gray-600 dark:hover:bg-gray-800 text-center text-sm" }) }), jsxs(ClerkLoaded, { children: [jsxs(SignedOut, { children: [jsx(SignInButton, { mode: data.clerkAuthInModal ? 'modal' : 'redirect', children: jsx("button", { className: "w-16 sm:w-20 h-8 sm:h-9 px-1.5 sm:px-2 border border-gray-300 rounded-full hover:bg-gray-100 dark:border-gray-600 dark:hover:bg-gray-800 text-center text-xs sm:text-sm whitespace-nowrap", children: data.signIn }) }), data.showSignUp && (jsx(SignUpButtonWithFingerprint, { mode: data.clerkAuthInModal ? 'modal' : 'redirect', signUp: data.signUp }))] }), jsx(SignedIn, { children: jsx(UserButton, { appearance: {
                                elements: {
                                    userButtonAvatarBox: "w-8 h-8 border",
                                }
                            }, children: jsxs(UserButton.MenuItems, { children: [jsx(UserButton.Action, { label: "manageAccount" }), jsx(UserButton.Link, { labelIcon: jsx(globalLucideIcons.ReceiptText, { className: "size-4 fill-none stroke-(--clerk-icon-stroke-color)" }), label: data.terms, href: `/${data.locale}/legal/terms` }), jsx(UserButton.Link, { labelIcon: jsx(globalLucideIcons.ShieldUser, { className: "size-4 fill-none stroke-(--clerk-icon-stroke-color)" }), label: data.privacy, href: `/${data.locale}/legal/privacy` }), jsx(UserButton.Action, { label: "signOut" })] }) }) })] })] }));
}

export { ClerkUserClient };
