ProfileCard는 데이터·표현·행동 계약으로 조립된다
부모가 전달할 값과 카드 내부가 책임질 마크업을 컴포넌트 경계에서 나눈다.
profile prop
name · role · avatarUrl
children
배지나 추가 설명을 선택적으로 삽입
onSelect
사용자 선택 의도만 부모에 전달
Card body
이미지 대체문·제목 계층·버튼 의미 보장
핵심컴포넌트는 데이터 저장이나 페이지 이동을 숨기지 않고, 표시와 사용자 의도를 명확한 props로 계약한다.