import React from 'react';
import { Avatar as AvatarPrimitive, AvatarProps as AvatarPropsPrimitive } from '@modulz/primitives';

export type AvatarProps = AvatarPropsPrimitive

type ExtractRefType<TypesThatMayContainReactRef> = TypesThatMayContainReactRef extends {ref?: React.Ref<infer T>} ? T : unknown;
type PrimitiveRefType = ExtractRefType<AvatarPropsPrimitive>  

export const Avatar = React.forwardRef<PrimitiveRefType, AvatarProps>((props, ref) => {
  return (
    <AvatarPrimitive {...props} ref={ref}  styleConfig={{"base":{"avatar":{"normal":{"backgroundColor":"hsl(5, 100%, 60%)","borderBottomRightRadius":"9999px","width":"32px","borderTopLeftRadius":"9999px","borderBottomLeftRadius":"9999px","fontFamily":"-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"","borderTopRightRadius":"9999px","fontSize":"14px","height":"32px","boxShadow":"none"}}},"variants":{}}}/>
  );
});


