You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
31 lines
747 B
TypeScript
31 lines
747 B
TypeScript
// frontend/components/journey/PeopleStack.tsx — 협업 아바타 스택 (원본 jx-stack)
|
|
import type { JourneyPerson } from "@/lib/types";
|
|
|
|
export function PeopleStack({
|
|
people,
|
|
more,
|
|
hover,
|
|
}: {
|
|
people: JourneyPerson[];
|
|
more: string;
|
|
hover?: string | null;
|
|
}) {
|
|
return (
|
|
<div className="jx-stack">
|
|
{people.map((p) => (
|
|
<button
|
|
key={p.id}
|
|
className={"av" + (hover === p.id ? " on" : "")}
|
|
style={{ background: p.color }}
|
|
title={`${p.name} · ${p.role}`}
|
|
type="button"
|
|
>
|
|
{p.initial}
|
|
<span className={"cnt " + (p.me ? "me" : "tm")}>{p.tasks}</span>
|
|
</button>
|
|
))}
|
|
<div className="more">{more}</div>
|
|
</div>
|
|
);
|
|
}
|