fix(avatar): make size optional and have default size (#1345)

* fix(avatar): make size optional and have default size

* chore: changeset

Author: gloriliale

.changeset/twenty-parrots-care.md

@@ -0,0 +1,6 @@
+---
+'@twilio-paste/avatar': patch
+'@twilio-paste/core': patch
+---
+
+Avatar: fixed size prop to make it optional and have a default of icon-size-70.

packages/paste-core/components/avatar/src/index.tsx

@@ -6,7 +6,9 @@ import {isIconSizeTokenProp} from '@twilio-paste/style-props';
 import {getComputedTokenNames, getInitialsFromName} from './utils';
 import type {AvatarProps} from './types';
 
-const AvatarContents: React.FC<AvatarProps> = ({name, size, src, icon: Icon}) => {
+const DEFAULT_SIZE = 'sizeIcon70';
+
+const AvatarContents: React.FC<AvatarProps> = ({name, size = DEFAULT_SIZE, src, icon: Icon}) => {
   const computedTokenNames = getComputedTokenNames(size);
   if (Icon != null) {
     if (typeof Icon !== 'function' || typeof Icon.displayName !== 'string' || !Icon.displayName.includes('Icon')) {
@@ -38,7 +40,7 @@ const AvatarContents: React.FC<AvatarProps> = ({name, size, src, icon: Icon}) =>
 };
 
 const Avatar = React.forwardRef<HTMLDivElement, AvatarProps>(
-  ({name, children, size = 'sizeIcon70', src, icon, ...props}, ref) => {
+  ({name, children, size = DEFAULT_SIZE, src, icon, ...props}, ref) => {
     if (name === undefined) {
       console.error('[Paste Avatar]: name prop is required');
     }

packages/paste-core/components/avatar/src/types.ts

@@ -3,7 +3,7 @@ import type {GenericIconProps} from '@twilio-paste/icons/esm/types';
 
 export interface AvatarProps extends React.HTMLAttributes<'div'> {
   name: string;
-  size: IconSize;
+  size?: IconSize;
   src?: string;
   icon?: React.FC<GenericIconProps>;
 }