From f2e8163130257ba86bd61fbce77846f373a642d6 Mon Sep 17 00:00:00 2001
From: jean-paul-lescouzeres <jean-paul.lescouzeres@adevinta.com>
Date: Fri, 16 Jun 2023 16:28:31 +0200
Subject: [PATCH] fix: fix code snippets on component docs

---
 packages/components/form-field/src/index.ts  | 31 +++++++++++---------
 packages/components/label/src/index.ts       |  2 ++
 packages/components/radio-group/src/index.ts | 10 ++++---
 packages/components/tabs/src/Tabs.tsx        | 16 ++++++----
 4 files changed, 35 insertions(+), 24 deletions(-)

diff --git a/packages/components/form-field/src/index.ts b/packages/components/form-field/src/index.ts
index 388b6e44a..c209d917d 100644
--- a/packages/components/form-field/src/index.ts
+++ b/packages/components/form-field/src/index.ts
@@ -1,14 +1,11 @@
 import { FC } from 'react'
 
-import { FormField as Root, FormFieldProps } from './FormField'
-import { FormFieldErrorMessage, FormFieldErrorMessageProps } from './FormFieldErrorMessage'
-import { FormFieldHelperMessage, FormFieldHelperMessageProps } from './FormFieldHelperMessage'
-import { FormFieldLabel, FormFieldLabelProps } from './FormFieldLabel'
-import {
-  FormFieldRequiredIndicator,
-  FormFieldRequiredIndicatorProps,
-} from './FormFieldRequiredIndicator'
-import { FormFieldState, FormFieldStateProps } from './FormFieldState'
+import { FormField as Root, type FormFieldProps } from './FormField'
+import { FormFieldErrorMessage } from './FormFieldErrorMessage'
+import { FormFieldHelperMessage } from './FormFieldHelperMessage'
+import { FormFieldLabel } from './FormFieldLabel'
+import { FormFieldRequiredIndicator } from './FormFieldRequiredIndicator'
+import { FormFieldState } from './FormFieldState'
 
 export { type FormFieldProps } from './FormField'
 export { type FormFieldErrorMessageProps } from './FormFieldErrorMessage'
@@ -17,12 +14,18 @@ export { type FormFieldHelperMessageProps } from './FormFieldHelperMessage'
 export { type FormFieldLabelProps } from './FormFieldLabel'
 export { type FormFieldRequiredIndicatorProps } from './FormFieldRequiredIndicator'
 
+FormFieldLabel.displayName = 'FormField.Label'
+FormFieldState.displayName = 'FormField.State'
+FormFieldErrorMessage.displayName = 'FormField.ErrorMessage'
+FormFieldHelperMessage.displayName = 'FormField.HelperMessage'
+FormFieldRequiredIndicator.displayName = 'FormField.RequiredIndicator'
+
 export const FormField: FC<FormFieldProps> & {
-  Label: FC<FormFieldLabelProps>
-  State: FC<FormFieldStateProps>
-  ErrorMessage: FC<FormFieldErrorMessageProps>
-  HelperMessage: FC<FormFieldHelperMessageProps>
-  RequiredIndicator: FC<FormFieldRequiredIndicatorProps>
+  Label: typeof FormFieldLabel
+  State: typeof FormFieldState
+  ErrorMessage: typeof FormFieldErrorMessage
+  HelperMessage: typeof FormFieldHelperMessage
+  RequiredIndicator: typeof FormFieldRequiredIndicator
 } = Object.assign(Root, {
   Label: FormFieldLabel,
   State: FormFieldState,
diff --git a/packages/components/label/src/index.ts b/packages/components/label/src/index.ts
index d9999f3b0..d6eaf67d1 100644
--- a/packages/components/label/src/index.ts
+++ b/packages/components/label/src/index.ts
@@ -4,6 +4,8 @@ import { LabelRequiredIndicator } from './LabelRequiredIndicator'
 export type { LabelProps } from './Label'
 export type { LabelRequiredIndicatorProps } from './LabelRequiredIndicator'
 
+LabelRequiredIndicator.displayName = 'Label.RequiredIndicator'
+
 export const Label: typeof Root & {
   RequiredIndicator: typeof LabelRequiredIndicator
 } = Object.assign(Root, {
diff --git a/packages/components/radio-group/src/index.ts b/packages/components/radio-group/src/index.ts
index e4e2d07a3..c8d92c291 100644
--- a/packages/components/radio-group/src/index.ts
+++ b/packages/components/radio-group/src/index.ts
@@ -1,13 +1,15 @@
-import { FC } from 'react'
+import type { FC } from 'react'
 
-import { Radio, RadioProps } from './Radio'
-import { RadioGroup as Root, RadioGroupProps } from './RadioGroup'
+import { Radio } from './Radio'
+import { RadioGroup as Root, type RadioGroupProps } from './RadioGroup'
 
 export { type RadioGroupProps } from './RadioGroup'
 export { type RadioProps } from './Radio'
 
+Radio.displayName = 'RadioGroup.Radio'
+
 export const RadioGroup: FC<RadioGroupProps> & {
-  Radio: FC<RadioProps>
+  Radio: typeof Radio
 } = Object.assign(Root, {
   Radio,
 })
diff --git a/packages/components/tabs/src/Tabs.tsx b/packages/components/tabs/src/Tabs.tsx
index 70315f8f7..aebe5be0a 100644
--- a/packages/components/tabs/src/Tabs.tsx
+++ b/packages/components/tabs/src/Tabs.tsx
@@ -1,14 +1,18 @@
 import type { FC } from 'react'
 
-import { TabsContent as Content, type TabsContentProps } from './TabsContent'
-import { TabsList as List, type TabsListProps } from './TabsList'
+import { TabsContent as Content } from './TabsContent'
+import { TabsList as List } from './TabsList'
 import { TabsRoot as Root, type TabsRootProps } from './TabsRoot'
-import { TabsTrigger as Trigger, type TabsTriggerProps } from './TabsTrigger'
+import { TabsTrigger as Trigger } from './TabsTrigger'
+
+List.displayName = 'Tabs.List'
+Trigger.displayName = 'Tabs.Trigger'
+Content.displayName = 'Tabs.Content'
 
 export const Tabs: FC<TabsRootProps> & {
-  List: FC<TabsListProps>
-  Trigger: FC<TabsTriggerProps>
-  Content: FC<TabsContentProps>
+  List: typeof List
+  Trigger: typeof Trigger
+  Content: typeof Content
 } = Object.assign(Root, {
   List,
   Trigger,