Reads org.gamecult.pose from event content for senders that are known Minds; unknown or missing labels fall back to neutral. Portrait sits beside the bubble on wide screens and stacks above it on phones. 84 downscaled webp portraits (7 Minds x 12 poses, ~415 KB). Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
30 lines
698 B
TypeScript
30 lines
698 B
TypeScript
import React from 'react';
|
|
import * as css from '../layout/layout.css';
|
|
import { poseSrc } from './poses';
|
|
|
|
type PoseAvatarProps = {
|
|
mind: string;
|
|
pose: string;
|
|
userId: string;
|
|
onClick: React.MouseEventHandler<HTMLButtonElement>;
|
|
};
|
|
|
|
export function PoseAvatar({ mind, pose, userId, onClick }: PoseAvatarProps) {
|
|
return (
|
|
<button
|
|
type="button"
|
|
className={css.PoseButton}
|
|
data-user-id={userId}
|
|
data-pose={pose}
|
|
onClick={onClick}
|
|
>
|
|
<img
|
|
className={css.PosePortrait}
|
|
src={poseSrc(mind, pose, import.meta.env.BASE_URL)}
|
|
alt={`${mind}, ${pose}`}
|
|
loading="lazy"
|
|
draggable={false}
|
|
/>
|
|
</button>
|
|
);
|
|
}
|