w-funnel/src/components/domains/TrialPayment/JoinedTodayWithAvatars/JoinedTodayWithAvatars.tsx
gofnnp 55b81890a3 trial-payment
new pages
2025-10-01 17:33:49 +04:00

60 lines
1.4 KiB
TypeScript

import Typography, {
TypographyProps,
} from "@/components/ui/Typography/Typography";
import Avatars from "@/components/widgets/Avatars/Avatars";
import { cn } from "@/lib/utils";
interface JoinedTodayWithAvatarsProps extends React.ComponentProps<"div"> {
avatars?: React.ComponentProps<typeof Avatars>;
count?: TypographyProps<"span">;
text?: TypographyProps<"p">;
}
export default function JoinedTodayWithAvatars({
avatars,
count,
text,
...props
}: JoinedTodayWithAvatarsProps) {
return (
<div
{...props}
className={cn(
"flex flex-col items-center justify-center gap-2",
props.className
)}
>
{avatars && (
<Avatars
generalAvatarProps={{
className: "size-12 ring-0!",
}}
{...avatars}
/>
)}
{text && (
<Typography
size="sm"
weight="semiBold"
font="inter"
{...text}
className={cn("text-[#6B7280]", text.className)}
>
{count && (
<Typography
weight="bold"
font="inter"
{...count}
className={cn(
"inline-block text-[#6B7280] text-[18px]",
count.className
)}
/>
)}{" "}
{text.children}
</Typography>
)}
</div>
);
}