Fix: Avatar Icon tests & documentation (#64)

CHANGELOG.md

@@ -15,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 ### Added
 
 -   Implement `InputDate` and `Avatar` components
+-   Add `AvatarIcon` documentation and tests
 
 ## [1.0.8] - 2024-01-17
 

src/components/avatars/avatarIcon/avatarIcon.test.tsx

@@ -0,0 +1,17 @@
+import { render, screen } from '@testing-library/react';
+
+import { IconType } from '../../icon';
+import { AvatarIcon, type IAvatarIconProps } from './avatarIcon';
+
+describe('<AvatarIcon /> component', () => {
+    const createTestComponent = (props?: Partial<IAvatarIconProps>) => {
+        const completeProps: IAvatarIconProps = { icon: IconType.ADD, ...props };
+
+        return <AvatarIcon {...completeProps} />;
+    };
+
+    it('renders the specified icon', () => {
+        render(createTestComponent({ icon: IconType.APP_FINANCE }));
+        expect(screen.getByTestId(IconType.APP_FINANCE)).toBeInTheDocument();
+    });
+});

src/components/avatars/avatarIcon/avatarIcon.tsx

@@ -10,10 +10,24 @@ type AvatarIconSize = 'sm' | 'md' | 'lg';
 type AvatarIconVariant = 'neutral' | 'primary' | 'info' | 'success' | 'warning' | 'critical';
 
 export interface IAvatarIconProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The icon type
+     */
+    icon: IconType;
+    /**
+     *  Responsive size attribute for the avatar.
+     */
+    responsiveSize?: ResponsiveAttribute<AvatarIconSize>;
+    /**
+     * The size of the avatar icon.
+     * @default sm
+     */
     size?: AvatarIconSize;
+    /**
+     * The variant of the avatar.
+     * @default neutral
+     */
     variant?: AvatarIconVariant;
-    responsiveSize?: ResponsiveAttribute<AvatarIconSize>;
-    icon: IconType;
 }
 
 const avatarVariantToIconClassNames: Record<AvatarIconVariant, string> = {