chore: add display names on components (#3072)

Author: SimonDegraeve

lib/src/components/Accordion/index.tsx

@@ -38,4 +38,6 @@ export const Accordion = forwardRef<HTMLDivElement, AccordionProps>(
   }
 )
 
+Accordion.displayName = 'Accordion'
+
 export { useDisclosureStore as useAccordion } from '@ariakit/react'

lib/src/components/Alert/components/Buttons.tsx

@@ -9,8 +9,13 @@ export const AlertButton = forwardRef<HTMLButtonElement, Omit<ButtonProps, 'size
     <Button className="shrink-0 w-fit" ref={ref} variant={variant} {...props} />
   )
 )
+
+AlertButton.displayName = 'Alert.Button'
+
 export const AlertSecondaryButton = forwardRef<HTMLButtonElement, Omit<ButtonProps, 'size'>>(
   ({ variant = 'secondary', ...props }, ref) => (
     <Button className="shrink-0 w-fit" ref={ref} variant={variant} {...props} />
   )
 )
+
+AlertSecondaryButton.displayName = 'Alert.SecondaryButton'

lib/src/components/Alert/components/Title.tsx

@@ -13,3 +13,5 @@ export const AlertTitle = ({ children, hasCloseButton, ...rest }: AlertTitleProp
     </Text>
   )
 }
+
+AlertTitle.displayName = 'Alert.Title'

lib/src/components/Alert/index.tsx

@@ -113,6 +113,8 @@ const AlertComponent = forwardRef<HTMLDivElement, AlertProps>(
   }
 )
 
+AlertComponent.displayName = 'Alert'
+
 export const Alert = Object.assign(AlertComponent, {
   Button: AlertButton,
   SecondaryButton: AlertSecondaryButton,

lib/src/components/Avatar/index.tsx

@@ -60,3 +60,5 @@ export const Avatar = forwardRef<HTMLDivElement, AvatarProps>(
     )
   }
 )
+
+Avatar.displayName = 'Avatar'

lib/src/components/Breadcrumb/Item.tsx

@@ -59,3 +59,5 @@ export const Item = forwardRef<HTMLAnchorElement, BreadcrumbItemProps>(
     )
   }
 )
+
+Item.displayName = 'Breadcrumb.Item'

lib/src/components/Breadcrumb/index.tsx

@@ -67,6 +67,8 @@ export const BreadcrumbComponent = forwardRef<HTMLDivElement, BreadcrumbProps>(
   }
 )
 
+BreadcrumbComponent.displayName = 'Breadcrumb'
+
 // Nested exports
 export const Breadcrumb = Object.assign(BreadcrumbComponent, {
   Item,

lib/src/components/Button/index.tsx

@@ -59,3 +59,5 @@ export const Button = forwardRefWithAs<ButtonProps, 'button'>(
     )
   }
 )
+
+Button.displayName = 'Button'

lib/src/components/ButtonGroup/index.tsx

@@ -38,3 +38,5 @@ export const ButtonGroup = forwardRefWithAs<ButtonGroupProps, 'div'>(
     )
   }
 )
+
+ButtonGroup.displayName = 'ButtonGroup'

lib/src/components/Checkbox/index.tsx

@@ -60,3 +60,5 @@ export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
     )
   }
 )
+
+Checkbox.displayName = 'Checkbox'