From 97892913a1a583db9e49b4b17c62e69ef5b8f009 Mon Sep 17 00:00:00 2001
From: lightshine555 <arron.hensley112@gmail.com>
Date: Thu, 31 Aug 2023 11:38:18 -0400
Subject: [PATCH] Export component interfaces and mark them as internal (#2313)

* export component interfaces, and mark them as internal

This is not ideal because we don't want these to be public. However, if
you are creating components on top of Headless UI, the TypeScript
compiler needs access to them.

So now they are public in a sense, but you shouldn't be interacting with
them directly.

Co-authored-by: Jordan Pittman <jordan@cryptica.me>

* Update changelog

---------

Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
---
 packages/@headlessui-react/CHANGELOG.md       |  1 +
 .../src/components/combobox/combobox.tsx      | 24 +++++++--------
 .../components/description/description.tsx    |  4 +--
 .../src/components/dialog/dialog.tsx          | 30 +++++++++++--------
 .../src/components/disclosure/disclosure.tsx  | 12 ++++----
 .../src/components/focus-trap/focus-trap.tsx  |  4 +--
 .../src/components/label/label.tsx            |  4 +--
 .../src/components/listbox/listbox.tsx        | 20 ++++++-------
 .../src/components/menu/menu.tsx              | 16 +++++-----
 .../src/components/popover/popover.tsx        | 20 ++++++-------
 .../src/components/portal/portal.tsx          |  8 ++---
 .../components/radio-group/radio-group.tsx    | 20 ++++++-------
 .../src/components/switch/switch.tsx          | 24 ++++++++-------
 .../src/components/tabs/tabs.tsx              | 20 ++++++-------
 .../src/components/transitions/transition.tsx | 14 +++++----
 15 files changed, 117 insertions(+), 104 deletions(-)

diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md
index e6f63f9..b4563ba 100644
--- a/packages/@headlessui-react/CHANGELOG.md
+++ b/packages/@headlessui-react/CHANGELOG.md
@@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Add support for `role="alertdialog"` to `<Dialog>` component ([#2709](https://github.com/tailwindlabs/headlessui/pull/2709))
 - Ensure blurring the `Combobox.Input` component closes the `Combobox` ([#2712](https://github.com/tailwindlabs/headlessui/pull/2712))
 - Allow changes to the `className` prop when the `<Transition />` component is currently not transitioning ([#2722](https://github.com/tailwindlabs/headlessui/pull/2722))
+- Export (internal-only) component interfaces for TypeScript compiler ([#2313](https://github.com/tailwindlabs/headlessui/pull/2313))
 
 ### Added
 
diff --git a/packages/@headlessui-react/src/components/combobox/combobox.tsx b/packages/@headlessui-react/src/components/combobox/combobox.tsx
index 88f5b1c..ea50cc8 100644
--- a/packages/@headlessui-react/src/components/combobox/combobox.tsx
+++ b/packages/@headlessui-react/src/components/combobox/combobox.tsx
@@ -1559,7 +1559,7 @@ function OptionFn<
 
 // ---
 
-interface ComponentCombobox extends HasDisplayName {
+export interface _internal_ComponentCombobox extends HasDisplayName {
   <TValue, TTag extends ElementType = typeof DEFAULT_COMBOBOX_TAG>(
     props: ComboboxProps<TValue, true, true, TTag> & RefProp<typeof ComboboxFn>
   ): JSX.Element
@@ -1574,31 +1574,31 @@ interface ComponentCombobox extends HasDisplayName {
   ): JSX.Element
 }
 
-interface ComponentComboboxButton extends HasDisplayName {
+export interface _internal_ComponentComboboxButton extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(
     props: ComboboxButtonProps<TTag> & RefProp<typeof ButtonFn>
   ): JSX.Element
 }
 
-interface ComponentComboboxInput extends HasDisplayName {
+export interface _internal_ComponentComboboxInput extends HasDisplayName {
   <TType, TTag extends ElementType = typeof DEFAULT_INPUT_TAG>(
     props: ComboboxInputProps<TTag, TType> & RefProp<typeof InputFn>
   ): JSX.Element
 }
 
-interface ComponentComboboxLabel extends HasDisplayName {
+export interface _internal_ComponentComboboxLabel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_LABEL_TAG>(
     props: ComboboxLabelProps<TTag> & RefProp<typeof LabelFn>
   ): JSX.Element
 }
 
-interface ComponentComboboxOptions extends HasDisplayName {
+export interface _internal_ComponentComboboxOptions extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(
     props: ComboboxOptionsProps<TTag> & RefProp<typeof OptionsFn>
   ): JSX.Element
 }
 
-interface ComponentComboboxOption extends HasDisplayName {
+export interface _internal_ComponentComboboxOption extends HasDisplayName {
   <
     TTag extends ElementType = typeof DEFAULT_OPTION_TAG,
     TType = Parameters<typeof ComboboxRoot>[0]['value']
@@ -1607,11 +1607,11 @@ interface ComponentComboboxOption extends HasDisplayName {
   ): JSX.Element
 }
 
-let ComboboxRoot = forwardRefWithAs(ComboboxFn) as unknown as ComponentCombobox
-let Button = forwardRefWithAs(ButtonFn) as unknown as ComponentComboboxButton
-let Input = forwardRefWithAs(InputFn) as unknown as ComponentComboboxInput
-let Label = forwardRefWithAs(LabelFn) as unknown as ComponentComboboxLabel
-let Options = forwardRefWithAs(OptionsFn) as unknown as ComponentComboboxOptions
-let Option = forwardRefWithAs(OptionFn) as unknown as ComponentComboboxOption
+let ComboboxRoot = forwardRefWithAs(ComboboxFn) as unknown as _internal_ComponentCombobox
+let Button = forwardRefWithAs(ButtonFn) as unknown as _internal_ComponentComboboxButton
+let Input = forwardRefWithAs(InputFn) as unknown as _internal_ComponentComboboxInput
+let Label = forwardRefWithAs(LabelFn) as unknown as _internal_ComponentComboboxLabel
+let Options = forwardRefWithAs(OptionsFn) as unknown as _internal_ComponentComboboxOptions
+let Option = forwardRefWithAs(OptionFn) as unknown as _internal_ComponentComboboxOption
 
 export let Combobox = Object.assign(ComboboxRoot, { Input, Button, Label, Options, Option })
diff --git a/packages/@headlessui-react/src/components/description/description.tsx b/packages/@headlessui-react/src/components/description/description.tsx
index 84bcd66..03a3598 100644
--- a/packages/@headlessui-react/src/components/description/description.tsx
+++ b/packages/@headlessui-react/src/components/description/description.tsx
@@ -115,13 +115,13 @@ function DescriptionFn<TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG
 }
 
 // ---
-export interface ComponentDescription extends HasDisplayName {
+export interface _internal_ComponentDescription extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_DESCRIPTION_TAG>(
     props: DescriptionProps<TTag> & RefProp<typeof DescriptionFn>
   ): JSX.Element
 }
 
-let DescriptionRoot = forwardRefWithAs(DescriptionFn) as unknown as ComponentDescription
+let DescriptionRoot = forwardRefWithAs(DescriptionFn) as unknown as _internal_ComponentDescription
 
 export let Description = Object.assign(DescriptionRoot, {
   //
diff --git a/packages/@headlessui-react/src/components/dialog/dialog.tsx b/packages/@headlessui-react/src/components/dialog/dialog.tsx
index baadca2..1c94c6d 100644
--- a/packages/@headlessui-react/src/components/dialog/dialog.tsx
+++ b/packages/@headlessui-react/src/components/dialog/dialog.tsx
@@ -36,7 +36,11 @@ import { useId } from '../../hooks/use-id'
 import { FocusTrap } from '../../components/focus-trap/focus-trap'
 import { Portal, useNestedPortals } from '../../components/portal/portal'
 import { ForcePortalRoot } from '../../internal/portal-force-root'
-import { ComponentDescription, Description, useDescriptions } from '../description/description'
+import {
+  _internal_ComponentDescription,
+  Description,
+  useDescriptions,
+} from '../description/description'
 import { useOpenClosed, State } from '../../internal/open-closed'
 import { useServerHandoffComplete } from '../../hooks/use-server-handoff-complete'
 import { StackProvider, StackMessage } from '../../internal/stack-context'
@@ -614,48 +618,48 @@ function TitleFn<TTag extends ElementType = typeof DEFAULT_TITLE_TAG>(
 
 // ---
 
-interface ComponentDialog extends HasDisplayName {
+export interface _internal_ComponentDialog extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_DIALOG_TAG>(
     props: DialogProps<TTag> & RefProp<typeof DialogFn>
   ): JSX.Element
 }
 
-interface ComponentDialogBackdrop extends HasDisplayName {
+export interface _internal_ComponentDialogBackdrop extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BACKDROP_TAG>(
     props: DialogBackdropProps<TTag> & RefProp<typeof BackdropFn>
   ): JSX.Element
 }
 
-interface ComponentDialogPanel extends HasDisplayName {
+export interface _internal_ComponentDialogPanel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
     props: DialogPanelProps<TTag> & RefProp<typeof PanelFn>
   ): JSX.Element
 }
 
-interface ComponentDialogOverlay extends HasDisplayName {
+export interface _internal_ComponentDialogOverlay extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(
     props: DialogOverlayProps<TTag> & RefProp<typeof OverlayFn>
   ): JSX.Element
 }
 
-interface ComponentDialogTitle extends HasDisplayName {
+export interface _internal_ComponentDialogTitle extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_TITLE_TAG>(
     props: DialogTitleProps<TTag> & RefProp<typeof TitleFn>
   ): JSX.Element
 }
 
-interface ComponentDialogDescription extends ComponentDescription {}
+export interface _internal_ComponentDialogDescription extends _internal_ComponentDescription {}
 
-let DialogRoot = forwardRefWithAs(DialogFn) as unknown as ComponentDialog
-let Backdrop = forwardRefWithAs(BackdropFn) as unknown as ComponentDialogBackdrop
-let Panel = forwardRefWithAs(PanelFn) as unknown as ComponentDialogPanel
-let Overlay = forwardRefWithAs(OverlayFn) as unknown as ComponentDialogOverlay
-let Title = forwardRefWithAs(TitleFn) as unknown as ComponentDialogTitle
+let DialogRoot = forwardRefWithAs(DialogFn) as unknown as _internal_ComponentDialog
+let Backdrop = forwardRefWithAs(BackdropFn) as unknown as _internal_ComponentDialogBackdrop
+let Panel = forwardRefWithAs(PanelFn) as unknown as _internal_ComponentDialogPanel
+let Overlay = forwardRefWithAs(OverlayFn) as unknown as _internal_ComponentDialogOverlay
+let Title = forwardRefWithAs(TitleFn) as unknown as _internal_ComponentDialogTitle
 
 export let Dialog = Object.assign(DialogRoot, {
   Backdrop,
   Panel,
   Overlay,
   Title,
-  Description: Description as ComponentDialogDescription,
+  Description: Description as _internal_ComponentDialogDescription,
 })
diff --git a/packages/@headlessui-react/src/components/disclosure/disclosure.tsx b/packages/@headlessui-react/src/components/disclosure/disclosure.tsx
index 4a7687d..aafa04f 100644
--- a/packages/@headlessui-react/src/components/disclosure/disclosure.tsx
+++ b/packages/@headlessui-react/src/components/disclosure/disclosure.tsx
@@ -425,26 +425,26 @@ function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
 
 // ---
 
-interface ComponentDisclosure extends HasDisplayName {
+export interface _internal_ComponentDisclosure extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_DISCLOSURE_TAG>(
     props: DisclosureProps<TTag> & RefProp<typeof DisclosureFn>
   ): JSX.Element
 }
 
-interface ComponentDisclosureButton extends HasDisplayName {
+export interface _internal_ComponentDisclosureButton extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(
     props: DisclosureButtonProps<TTag> & RefProp<typeof ButtonFn>
   ): JSX.Element
 }
 
-interface ComponentDisclosurePanel extends HasDisplayName {
+export interface _internal_ComponentDisclosurePanel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
     props: DisclosurePanelProps<TTag> & RefProp<typeof PanelFn>
   ): JSX.Element
 }
 
-let DisclosureRoot = forwardRefWithAs(DisclosureFn) as unknown as ComponentDisclosure
-let Button = forwardRefWithAs(ButtonFn) as unknown as ComponentDisclosureButton
-let Panel = forwardRefWithAs(PanelFn) as unknown as ComponentDisclosurePanel
+let DisclosureRoot = forwardRefWithAs(DisclosureFn) as unknown as _internal_ComponentDisclosure
+let Button = forwardRefWithAs(ButtonFn) as unknown as _internal_ComponentDisclosureButton
+let Panel = forwardRefWithAs(PanelFn) as unknown as _internal_ComponentDisclosurePanel
 
 export let Disclosure = Object.assign(DisclosureRoot, { Button, Panel })
diff --git a/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx b/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx
index 7e0ad8e..356ca04 100644
--- a/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx
+++ b/packages/@headlessui-react/src/components/focus-trap/focus-trap.tsx
@@ -198,13 +198,13 @@ function FocusTrapFn<TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(
 
 // ---
 
-interface ComponentFocusTrap extends HasDisplayName {
+export interface _internal_ComponentFocusTrap extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_FOCUS_TRAP_TAG>(
     props: FocusTrapProps<TTag> & RefProp<typeof FocusTrapFn>
   ): JSX.Element
 }
 
-let FocusTrapRoot = forwardRefWithAs(FocusTrapFn) as unknown as ComponentFocusTrap
+let FocusTrapRoot = forwardRefWithAs(FocusTrapFn) as unknown as _internal_ComponentFocusTrap
 
 export let FocusTrap = Object.assign(FocusTrapRoot, {
   features: Features,
diff --git a/packages/@headlessui-react/src/components/label/label.tsx b/packages/@headlessui-react/src/components/label/label.tsx
index f42131c..b02b8a1 100644
--- a/packages/@headlessui-react/src/components/label/label.tsx
+++ b/packages/@headlessui-react/src/components/label/label.tsx
@@ -119,13 +119,13 @@ function LabelFn<TTag extends ElementType = typeof DEFAULT_LABEL_TAG>(
 
 // ---
 
-export interface ComponentLabel extends HasDisplayName {
+export interface _internal_ComponentLabel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_LABEL_TAG>(
     props: LabelProps<TTag> & RefProp<typeof LabelFn>
   ): JSX.Element
 }
 
-let LabelRoot = forwardRefWithAs(LabelFn) as unknown as ComponentLabel
+let LabelRoot = forwardRefWithAs(LabelFn) as unknown as _internal_ComponentLabel
 
 export let Label = Object.assign(LabelRoot, {
   //
diff --git a/packages/@headlessui-react/src/components/listbox/listbox.tsx b/packages/@headlessui-react/src/components/listbox/listbox.tsx
index c633ad5..a39379e 100644
--- a/packages/@headlessui-react/src/components/listbox/listbox.tsx
+++ b/packages/@headlessui-react/src/components/listbox/listbox.tsx
@@ -1033,7 +1033,7 @@ function OptionFn<
 
 // ---
 
-interface ComponentListbox extends HasDisplayName {
+export interface _internal_ComponentListbox extends HasDisplayName {
   <
     TTag extends ElementType = typeof DEFAULT_LISTBOX_TAG,
     TType = string,
@@ -1043,25 +1043,25 @@ interface ComponentListbox extends HasDisplayName {
   ): JSX.Element
 }
 
-interface ComponentListboxButton extends HasDisplayName {
+export interface _internal_ComponentListboxButton extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(
     props: ListboxButtonProps<TTag> & RefProp<typeof ButtonFn>
   ): JSX.Element
 }
 
-interface ComponentListboxLabel extends HasDisplayName {
+export interface _internal_ComponentListboxLabel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_LABEL_TAG>(
     props: ListboxLabelProps<TTag> & RefProp<typeof LabelFn>
   ): JSX.Element
 }
 
-interface ComponentListboxOptions extends HasDisplayName {
+export interface _internal_ComponentListboxOptions extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_OPTIONS_TAG>(
     props: ListboxOptionsProps<TTag> & RefProp<typeof OptionsFn>
   ): JSX.Element
 }
 
-interface ComponentListboxOption extends HasDisplayName {
+export interface _internal_ComponentListboxOption extends HasDisplayName {
   <
     TTag extends ElementType = typeof DEFAULT_OPTION_TAG,
     TType = Parameters<typeof ListboxRoot>[0]['value']
@@ -1070,10 +1070,10 @@ interface ComponentListboxOption extends HasDisplayName {
   ): JSX.Element
 }
 
-let ListboxRoot = forwardRefWithAs(ListboxFn) as unknown as ComponentListbox
-let Button = forwardRefWithAs(ButtonFn) as unknown as ComponentListboxButton
-let Label = forwardRefWithAs(LabelFn) as unknown as ComponentListboxLabel
-let Options = forwardRefWithAs(OptionsFn) as unknown as ComponentListboxOptions
-let Option = forwardRefWithAs(OptionFn) as unknown as ComponentListboxOption
+let ListboxRoot = forwardRefWithAs(ListboxFn) as unknown as _internal_ComponentListbox
+let Button = forwardRefWithAs(ButtonFn) as unknown as _internal_ComponentListboxButton
+let Label = forwardRefWithAs(LabelFn) as unknown as _internal_ComponentListboxLabel
+let Options = forwardRefWithAs(OptionsFn) as unknown as _internal_ComponentListboxOptions
+let Option = forwardRefWithAs(OptionFn) as unknown as _internal_ComponentListboxOption
 
 export let Listbox = Object.assign(ListboxRoot, { Button, Label, Options, Option })
diff --git a/packages/@headlessui-react/src/components/menu/menu.tsx b/packages/@headlessui-react/src/components/menu/menu.tsx
index e829ce0..1c62255 100644
--- a/packages/@headlessui-react/src/components/menu/menu.tsx
+++ b/packages/@headlessui-react/src/components/menu/menu.tsx
@@ -726,33 +726,33 @@ function ItemFn<TTag extends ElementType = typeof DEFAULT_ITEM_TAG>(
 
 // ---
 
-interface ComponentMenu extends HasDisplayName {
+export interface _internal_ComponentMenu extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_MENU_TAG>(
     props: MenuProps<TTag> & RefProp<typeof MenuFn>
   ): JSX.Element
 }
 
-interface ComponentMenuButton extends HasDisplayName {
+export interface _internal_ComponentMenuButton extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(
     props: MenuButtonProps<TTag> & RefProp<typeof ButtonFn>
   ): JSX.Element
 }
 
-interface ComponentMenuItems extends HasDisplayName {
+export interface _internal_ComponentMenuItems extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_ITEMS_TAG>(
     props: MenuItemsProps<TTag> & RefProp<typeof ItemsFn>
   ): JSX.Element
 }
 
-interface ComponentMenuItem extends HasDisplayName {
+export interface _internal_ComponentMenuItem extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_ITEM_TAG>(
     props: MenuItemProps<TTag> & RefProp<typeof ItemFn>
   ): JSX.Element
 }
 
-let MenuRoot = forwardRefWithAs(MenuFn) as unknown as ComponentMenu
-let Button = forwardRefWithAs(ButtonFn) as unknown as ComponentMenuButton
-let Items = forwardRefWithAs(ItemsFn) as unknown as ComponentMenuItems
-let Item = forwardRefWithAs(ItemFn) as unknown as ComponentMenuItem
+let MenuRoot = forwardRefWithAs(MenuFn) as unknown as _internal_ComponentMenu
+let Button = forwardRefWithAs(ButtonFn) as unknown as _internal_ComponentMenuButton
+let Items = forwardRefWithAs(ItemsFn) as unknown as _internal_ComponentMenuItems
+let Item = forwardRefWithAs(ItemFn) as unknown as _internal_ComponentMenuItem
 
 export let Menu = Object.assign(MenuRoot, { Button, Items, Item })
diff --git a/packages/@headlessui-react/src/components/popover/popover.tsx b/packages/@headlessui-react/src/components/popover/popover.tsx
index 5fb0d28..cb98e63 100644
--- a/packages/@headlessui-react/src/components/popover/popover.tsx
+++ b/packages/@headlessui-react/src/components/popover/popover.tsx
@@ -1052,40 +1052,40 @@ function GroupFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
 
 // ---
 
-interface ComponentPopover extends HasDisplayName {
+export interface _internal_ComponentPopover extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_POPOVER_TAG>(
     props: PopoverProps<TTag> & RefProp<typeof PopoverFn>
   ): JSX.Element
 }
 
-interface ComponentPopoverButton extends HasDisplayName {
+export interface _internal_ComponentPopoverButton extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_BUTTON_TAG>(
     props: PopoverButtonProps<TTag> & RefProp<typeof ButtonFn>
   ): JSX.Element
 }
 
-interface ComponentPopoverOverlay extends HasDisplayName {
+export interface _internal_ComponentPopoverOverlay extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_OVERLAY_TAG>(
     props: PopoverOverlayProps<TTag> & RefProp<typeof OverlayFn>
   ): JSX.Element
 }
 
-interface ComponentPopoverPanel extends HasDisplayName {
+export interface _internal_ComponentPopoverPanel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
     props: PopoverPanelProps<TTag> & RefProp<typeof PanelFn>
   ): JSX.Element
 }
 
-interface ComponentPopoverGroup extends HasDisplayName {
+export interface _internal_ComponentPopoverGroup extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_GROUP_TAG>(
     props: PopoverGroupProps<TTag> & RefProp<typeof GroupFn>
   ): JSX.Element
 }
 
-let PopoverRoot = forwardRefWithAs(PopoverFn) as unknown as ComponentPopover
-let Button = forwardRefWithAs(ButtonFn) as unknown as ComponentPopoverButton
-let Overlay = forwardRefWithAs(OverlayFn) as unknown as ComponentPopoverOverlay
-let Panel = forwardRefWithAs(PanelFn) as unknown as ComponentPopoverPanel
-let Group = forwardRefWithAs(GroupFn) as unknown as ComponentPopoverGroup
+let PopoverRoot = forwardRefWithAs(PopoverFn) as unknown as _internal_ComponentPopover
+let Button = forwardRefWithAs(ButtonFn) as unknown as _internal_ComponentPopoverButton
+let Overlay = forwardRefWithAs(OverlayFn) as unknown as _internal_ComponentPopoverOverlay
+let Panel = forwardRefWithAs(PanelFn) as unknown as _internal_ComponentPopoverPanel
+let Group = forwardRefWithAs(GroupFn) as unknown as _internal_ComponentPopoverGroup
 
 export let Popover = Object.assign(PopoverRoot, { Button, Overlay, Panel, Group })
diff --git a/packages/@headlessui-react/src/components/portal/portal.tsx b/packages/@headlessui-react/src/components/portal/portal.tsx
index 77d8549..7419982 100644
--- a/packages/@headlessui-react/src/components/portal/portal.tsx
+++ b/packages/@headlessui-react/src/components/portal/portal.tsx
@@ -213,19 +213,19 @@ export function useNestedPortals() {
 
 // ---
 
-interface ComponentPortal extends HasDisplayName {
+export interface _internal_ComponentPortal extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PORTAL_TAG>(
     props: PortalProps<TTag> & RefProp<typeof PortalFn>
   ): JSX.Element
 }
 
-interface ComponentPortalGroup extends HasDisplayName {
+export interface _internal_ComponentPortalGroup extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_GROUP_TAG>(
     props: PortalGroupProps<TTag> & RefProp<typeof GroupFn>
   ): JSX.Element
 }
 
-let PortalRoot = forwardRefWithAs(PortalFn) as unknown as ComponentPortal
-let Group = forwardRefWithAs(GroupFn) as unknown as ComponentPortalGroup
+let PortalRoot = forwardRefWithAs(PortalFn) as unknown as _internal_ComponentPortal
+let Group = forwardRefWithAs(GroupFn) as unknown as _internal_ComponentPortalGroup
 
 export let Portal = Object.assign(PortalRoot, { Group })
diff --git a/packages/@headlessui-react/src/components/radio-group/radio-group.tsx b/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
index 2356145..3a3472d 100644
--- a/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
+++ b/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
@@ -23,9 +23,9 @@ import { useIsoMorphicEffect } from '../../hooks/use-iso-morphic-effect'
 import { Keys } from '../../components/keyboard'
 import { focusIn, Focus, FocusResult, sortByDomNode } from '../../utils/focus-management'
 import { useFlags } from '../../hooks/use-flags'
-import { ComponentLabel, Label, useLabels } from '../../components/label/label'
+import { _internal_ComponentLabel, Label, useLabels } from '../../components/label/label'
 import {
-  ComponentDescription,
+  _internal_ComponentDescription,
   Description,
   useDescriptions,
 } from '../../components/description/description'
@@ -484,26 +484,26 @@ function OptionFn<
 
 // ---
 
-interface ComponentRadioGroup extends HasDisplayName {
+export interface _internal_ComponentRadioGroup extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_RADIO_GROUP_TAG, TType = string>(
     props: RadioGroupProps<TTag, TType> & RefProp<typeof RadioGroupFn>
   ): JSX.Element
 }
 
-interface ComponentRadioOption extends HasDisplayName {
+export interface _internal_ComponentRadioOption extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_OPTION_TAG, TType = string>(
     props: RadioOptionProps<TTag, TType> & RefProp<typeof OptionFn>
   ): JSX.Element
 }
 
-interface ComponentRadioLabel extends ComponentLabel {}
-interface ComponentRadioDescription extends ComponentDescription {}
+export interface _internal_ComponentRadioLabel extends _internal_ComponentLabel {}
+export interface _internal_ComponentRadioDescription extends _internal_ComponentDescription {}
 
-let RadioGroupRoot = forwardRefWithAs(RadioGroupFn) as unknown as ComponentRadioGroup
-let Option = forwardRefWithAs(OptionFn) as unknown as ComponentRadioOption
+let RadioGroupRoot = forwardRefWithAs(RadioGroupFn) as unknown as _internal_ComponentRadioGroup
+let Option = forwardRefWithAs(OptionFn) as unknown as _internal_ComponentRadioOption
 
 export let RadioGroup = Object.assign(RadioGroupRoot, {
   Option,
-  Label: Label as ComponentRadioLabel,
-  Description: Description as ComponentRadioDescription,
+  Label: Label as _internal_ComponentRadioLabel,
+  Description: Description as _internal_ComponentRadioDescription,
 })
diff --git a/packages/@headlessui-react/src/components/switch/switch.tsx b/packages/@headlessui-react/src/components/switch/switch.tsx
index ede476f..129df55 100644
--- a/packages/@headlessui-react/src/components/switch/switch.tsx
+++ b/packages/@headlessui-react/src/components/switch/switch.tsx
@@ -19,8 +19,12 @@ import { forwardRefWithAs, render, compact, HasDisplayName, RefProp } from '../.
 import { useId } from '../../hooks/use-id'
 import { Keys } from '../keyboard'
 import { isDisabledReactIssue7711 } from '../../utils/bugs'
-import { ComponentLabel, Label, useLabels } from '../label/label'
-import { ComponentDescription, Description, useDescriptions } from '../description/description'
+import { _internal_ComponentLabel, Label, useLabels } from '../label/label'
+import {
+  _internal_ComponentDescription,
+  Description,
+  useDescriptions,
+} from '../description/description'
 import { useResolveButtonType } from '../../hooks/use-resolve-button-type'
 import { useSyncRefs } from '../../hooks/use-sync-refs'
 import { Hidden, Features as HiddenFeatures } from '../../internal/hidden'
@@ -209,26 +213,26 @@ function SwitchFn<TTag extends ElementType = typeof DEFAULT_SWITCH_TAG>(
 
 // ---
 
-interface ComponentSwitch extends HasDisplayName {
+export interface _internal_ComponentSwitch extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_SWITCH_TAG>(
     props: SwitchProps<TTag> & RefProp<typeof SwitchFn>
   ): JSX.Element
 }
 
-interface ComponentSwitchGroup extends HasDisplayName {
+export interface _internal_ComponentSwitchGroup extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_GROUP_TAG>(
     props: SwitchGroupProps<TTag> & RefProp<typeof GroupFn>
   ): JSX.Element
 }
 
-interface ComponentSwitchLabel extends ComponentLabel {}
-interface ComponentSwitchDescription extends ComponentDescription {}
+export interface _internal_ComponentSwitchLabel extends _internal_ComponentLabel {}
+export interface _internal_ComponentSwitchDescription extends _internal_ComponentDescription {}
 
-let SwitchRoot = forwardRefWithAs(SwitchFn) as unknown as ComponentSwitch
-let Group = GroupFn as unknown as ComponentSwitchGroup
+let SwitchRoot = forwardRefWithAs(SwitchFn) as unknown as _internal_ComponentSwitch
+let Group = GroupFn as unknown as _internal_ComponentSwitchGroup
 
 export let Switch = Object.assign(SwitchRoot, {
   Group,
-  Label: Label as ComponentSwitchLabel,
-  Description: Description as ComponentSwitchDescription,
+  Label: Label as _internal_ComponentSwitchLabel,
+  Description: Description as _internal_ComponentSwitchDescription,
 })
diff --git a/packages/@headlessui-react/src/components/tabs/tabs.tsx b/packages/@headlessui-react/src/components/tabs/tabs.tsx
index 9c18dc3..f4d18c1 100644
--- a/packages/@headlessui-react/src/components/tabs/tabs.tsx
+++ b/packages/@headlessui-react/src/components/tabs/tabs.tsx
@@ -605,40 +605,40 @@ function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
 
 // ---
 
-interface ComponentTab extends HasDisplayName {
+export interface _internal_ComponentTab extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_TAB_TAG>(
     props: TabProps<TTag> & RefProp<typeof TabFn>
   ): JSX.Element
 }
 
-interface ComponentTabGroup extends HasDisplayName {
+export interface _internal_ComponentTabGroup extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_TABS_TAG>(
     props: TabGroupProps<TTag> & RefProp<typeof GroupFn>
   ): JSX.Element
 }
 
-interface ComponentTabList extends HasDisplayName {
+export interface _internal_ComponentTabList extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_LIST_TAG>(
     props: TabListProps<TTag> & RefProp<typeof ListFn>
   ): JSX.Element
 }
 
-interface ComponentTabPanels extends HasDisplayName {
+export interface _internal_ComponentTabPanels extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PANELS_TAG>(
     props: TabPanelsProps<TTag> & RefProp<typeof PanelsFn>
   ): JSX.Element
 }
 
-interface ComponentTabPanel extends HasDisplayName {
+export interface _internal_ComponentTabPanel extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(
     props: TabPanelProps<TTag> & RefProp<typeof PanelFn>
   ): JSX.Element
 }
 
-let TabRoot = forwardRefWithAs(TabFn) as unknown as ComponentTab
-let Group = forwardRefWithAs(GroupFn) as unknown as ComponentTabGroup
-let List = forwardRefWithAs(ListFn) as unknown as ComponentTabList
-let Panels = forwardRefWithAs(PanelsFn) as unknown as ComponentTabPanels
-let Panel = forwardRefWithAs(PanelFn) as unknown as ComponentTabPanel
+let TabRoot = forwardRefWithAs(TabFn) as unknown as _internal_ComponentTab
+let Group = forwardRefWithAs(GroupFn) as unknown as _internal_ComponentTabGroup
+let List = forwardRefWithAs(ListFn) as unknown as _internal_ComponentTabList
+let Panels = forwardRefWithAs(PanelsFn) as unknown as _internal_ComponentTabPanels
+let Panel = forwardRefWithAs(PanelFn) as unknown as _internal_ComponentTabPanel
 
 export let Tab = Object.assign(TabRoot, { Group, List, Panels, Panel })
diff --git a/packages/@headlessui-react/src/components/transitions/transition.tsx b/packages/@headlessui-react/src/components/transitions/transition.tsx
index 3dfdf1c..bd54f87 100644
--- a/packages/@headlessui-react/src/components/transitions/transition.tsx
+++ b/packages/@headlessui-react/src/components/transitions/transition.tsx
@@ -607,20 +607,24 @@ function ChildFn<TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>
   )
 }
 
-interface ComponentTransitionRoot extends HasDisplayName {
+export interface _internal_ComponentTransitionRoot extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(
     props: TransitionRootProps<TTag> & RefProp<typeof TransitionRootFn>
   ): JSX.Element
 }
 
-interface ComponentTransitionChild extends HasDisplayName {
+export interface _internal_ComponentTransitionChild extends HasDisplayName {
   <TTag extends ElementType = typeof DEFAULT_TRANSITION_CHILD_TAG>(
     props: TransitionChildProps<TTag> & RefProp<typeof TransitionChildFn>
   ): JSX.Element
 }
 
-let TransitionRoot = forwardRefWithAs(TransitionRootFn) as unknown as ComponentTransitionRoot
-let TransitionChild = forwardRefWithAs(TransitionChildFn) as unknown as ComponentTransitionChild
-let Child = forwardRefWithAs(ChildFn) as unknown as ComponentTransitionChild
+let TransitionRoot = forwardRefWithAs(
+  TransitionRootFn
+) as unknown as _internal_ComponentTransitionRoot
+let TransitionChild = forwardRefWithAs(
+  TransitionChildFn
+) as unknown as _internal_ComponentTransitionChild
+let Child = forwardRefWithAs(ChildFn) as unknown as _internal_ComponentTransitionChild
 
 export let Transition = Object.assign(TransitionRoot, { Child, Root: TransitionRoot })