This commit is contained in:
1 parent
8efd032cc6
commit
df38dccbf1
735 files changed
+128321
-120870
No files matched your search
@@ -1,32 +1,40 @@
|
||||
import { type AvatarOptions, getAvatarUrl } from "@/lib/imager";
|
||||
|
||||
interface AvatarImageProps {
|
||||
figure: string;
|
||||
options?: AvatarOptions;
|
||||
width: number;
|
||||
height: number;
|
||||
alt: string;
|
||||
className?: string;
|
||||
figure: string;
|
||||
options?: AvatarOptions;
|
||||
width: number;
|
||||
height: number;
|
||||
alt: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export function AvatarImage({ figure, options, width, height, alt, className = "" }: AvatarImageProps) {
|
||||
// Auto-pick the smallest size that still looks crisp at the requested
|
||||
// dimensions, unless the caller passed an explicit size.
|
||||
const max = Math.max(width, height);
|
||||
const autoSize: "s" | "m" | "l" =
|
||||
options?.size ?? (options?.headOnly ? "l" : max <= 40 ? "s" : max <= 80 ? "m" : "l");
|
||||
export function AvatarImage({
|
||||
figure,
|
||||
options,
|
||||
width,
|
||||
height,
|
||||
alt,
|
||||
className = "",
|
||||
}: AvatarImageProps) {
|
||||
// Auto-pick the smallest size that still looks crisp at the requested
|
||||
// dimensions, unless the caller passed an explicit size.
|
||||
const max = Math.max(width, height);
|
||||
const autoSize: "s" | "m" | "l" =
|
||||
options?.size ??
|
||||
(options?.headOnly ? "l" : max <= 40 ? "s" : max <= 80 ? "m" : "l");
|
||||
|
||||
return (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
<img
|
||||
src={getAvatarUrl(figure, { ...options, size: autoSize })}
|
||||
alt={alt}
|
||||
width={width}
|
||||
height={height}
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
style={{ maxWidth: width, maxHeight: height }}
|
||||
className={`image-pixelated object-contain ${className}`}
|
||||
/>
|
||||
);
|
||||
return (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
<img
|
||||
src={getAvatarUrl(figure, { ...options, size: autoSize })}
|
||||
alt={alt}
|
||||
width={width}
|
||||
height={height}
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
style={{ maxWidth: width, maxHeight: height }}
|
||||
className={`image-pixelated object-contain ${className}`}
|
||||
/>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user