import

import { Avatar, AvatarGroup } from "@uyoolabs/ui/avatar";

쓰는 경우

표의 담당 셀(xs) · 칩(xs) · 메시지(md) · 채널 머리 묶음(sm) · 프로필(xl) · 조직 · 프로젝트 전환기(square)에 씁니다. 사람 이름과 함께 놓을 때는 Person 을 씁니다.

쓰지 않는 경우

사람에게 아이덴티콘(square)을, 조직 · 프로젝트에 이니셜을 쓰지 않습니다. seed 에 이름 · 슬러그를 넘기지 않습니다(id). 아바타에 두께 · 그림자를 더하지 않습니다(avatar-clay-shadow 는 폐기합니다). 비활성 · 탈퇴를 opacity 로 나타내지 않습니다.

정적 · 사람

import { AvatarMark, Person } from "@uyoolabs/ui/ui";

아이덴티콘을 가운데에 그대로 두고 같은 seed 로 패턴을 바깥까지 확장합니다. 아바타와 커버가 같은 패턴 · 같은 아이덴티티 컬러라서 목록에서 본 엔티티를 상세 화면에서도 바로 알아볼 수 있습니다. 남는 영역은 아이덴티티 컬러 10% 틴트로 채웁니다.

쓰는 경우

조직 · 프로젝트 · 팀 · 워크스페이스처럼 로고가 없는 엔티티의 상세 화면 헤더와, 그 엔티티 링크를 공유할 때의 OG 이미지에 씁니다.

쓰지 않는 경우

목록 · 테이블 행에는 IdentityAvatar 만 씁니다. 로고나 이미지를 올린 엔티티는 올린 이미지를 우선합니다. 사람에게는 쓰지 않습니다(사진 또는 이니셜 아바타).

seed

엔티티 id 를 넘깁니다. 이름이나 슬러그가 바뀌어도 패턴이 유지됩니다. 같은 엔티티의 IdentityAvatar 와 같은 값이어야 합니다.

크기

기본 41×7 은 헤더용 가로 띠입니다. 정사각형 영역에는 cols={13} rows={13} 을 줍니다. 높이를 정하면 가로는 가운데 정렬됩니다. CSS 변수를 쓸 수 없는 OG 이미지 렌더러에서는 identityPattern 으로 셀 목록을 받아 직접 그립니다.