Ratatoskr/src/app/components/message/pose/PoseAvatar.tsx
void 6411266092
Some checks failed
CLA Assistant / CLAssistant (pull_request_target) Has been cancelled
Check PR title / lint (pull_request_target) Has been cancelled
Build pull request / Build pull request (pull_request) Has been cancelled
pose-aware chat bubble behind a Pose Portraits setting
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>
2026-11-01 19:22:21 +00:00

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>
);
}