Bill total header above an overlapping avatar stack with the per-person share on the right.
The import and the props worth knowing about, in one place.
import { Money10 } from "@/components/beste/piece/money10";
<Money10
total="$248.60"
perPerson="$62.15"
people={[
{
"src": "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=200&h=200&fit=crop&crop=face",
"alt": "Hania Rani",
"fallback": "HR"
},
{
"src": "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=200&h=200&fit=crop&crop=face",
"alt": "Nils Frahm",
"fallback": "NF"
},
{
"src": "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=200&h=200&fit=crop&crop=face",
"alt": "Poppy Ackroyd",
"fallback": "PA"
},
{
"src": "https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=200&h=200&fit=crop&crop=face",
"alt": "Ólafur Arnalds",
"fallback": "ÓA"
}
]}
bordered={false}
/>