Allow all span props onto the avatar component

element-hq · Aug 9, 2023 · 1760a85 · 1760a85
1 parent 9513bca
commit 1760a85
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/src/components/Avatar/Avatar.tsx b/src/components/Avatar/Avatar.tsx
@@ -21,17 +21,16 @@ import { SuspenseImg } from "../../utils/SuspenseImg";
 import styles from "./Avatar.module.css";
 import { useIdColorHash } from "./useIdColorHash";
 
-type AvatarProps = {
+type AvatarProps = JSX.IntrinsicElements["span"] & {
   src?: string;
   id: string;
   name: string;
   type?: "square" | "round";
-  className?: string;
   size?: CSSStyleDeclaration["height"];
 };
 
 export const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(function Avatar(
-  { src, id, name = "", type = "round", className = "", size },
+  { src, id, name = "", type = "round", className = "", size, ...props },
   ref,
 ) {
   const hash = useIdColorHash(id);
@@ -44,12 +43,13 @@ export const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(function Avatar(
     <span
       ref={ref}
       role="img"
+      title={id}
+      {...props}
       aria-label=""
       data-type={type}
       data-color={hash}
       className={classnames(styles.avatar, className)}
       style={style}
-      title={id}
     >
       {!src ? (
         fallbackInitial