[chore] Move Popover props to separate module and eliminate circular imports (#7572)

Author: ggdouglas

packages/core/src/common/alignment.ts

@@ -35,5 +35,5 @@ export const TextAlignment = {
     END: "end" as const,
     START: "start" as const,
 };
-// eslint-disable-next-line @typescript-eslint/no-redeclare
+
 export type TextAlignment = (typeof TextAlignment)[keyof typeof TextAlignment];

packages/core/src/components/breadcrumbs/breadcrumbs.tsx

@@ -20,7 +20,8 @@ import { AbstractPureComponent, Boundary, Classes, type Props, removeNonHTMLProp
 import { Menu } from "../menu/menu";
 import { MenuItem } from "../menu/menuItem";
 import { OverflowList, type OverflowListProps } from "../overflow-list/overflowList";
-import { Popover, type PopoverProps } from "../popover/popover";
+import { Popover } from "../popover/popover";
+import type { PopoverProps } from "../popover/popoverProps";
 
 import { Breadcrumb, type BreadcrumbProps } from "./breadcrumb";
 

packages/core/src/components/context-menu/contextMenuShared.ts

@@ -15,7 +15,7 @@
  */
 
 import type { OverlayLifecycleProps } from "../overlay/overlayProps";
-import type { PopoverProps } from "../popover/popover";
+import type { PopoverProps } from "../popover/popoverProps";
 
 export type Offset = {
     left: number;

packages/core/src/components/index.ts

@@ -77,7 +77,8 @@ export type { OverlayInstance } from "./overlay2/overlayInstance";
 export { Text, type TextProps } from "./text/text";
 export { PanelStack, type PanelStackProps, PanelStack2, type PanelStack2Props } from "./panel-stack/panelStack";
 export type { Panel, PanelProps } from "./panel-stack/panelTypes";
-export { type PopoverProps, Popover, PopoverInteractionKind } from "./popover/popover";
+export { Popover } from "./popover/popover";
+export { PopoverInteractionKind, type PopoverProps } from "./popover/popoverProps";
 export { PopoverPosition } from "./popover/popoverPosition";
 export type {
     DefaultPopoverTargetHTMLProps,

packages/core/src/components/menu/menuItem.tsx

@@ -23,7 +23,8 @@ import { Classes } from "../../common";
 import { type ActionProps, DISPLAYNAME_PREFIX, removeNonHTMLProps } from "../../common/props";
 import { clickElementOnKeyPress } from "../../common/utils";
 import { Icon } from "../icon/icon";
-import { Popover, type PopoverProps } from "../popover/popover";
+import { Popover } from "../popover/popover";
+import type { PopoverProps } from "../popover/popoverProps";
 import { Text } from "../text/text";
 
 import { Menu, type MenuProps } from "./menu";

packages/core/src/components/popover/popover.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import type { State as PopperState, PositioningStrategy } from "@popperjs/core";
+import type { State as PopperState } from "@popperjs/core";
 import classNames from "classnames";
 import { Children, cloneElement, createElement, createRef } from "react";
 import {
@@ -38,92 +38,17 @@ import {
 import * as Errors from "../../common/errors";
 import { Overlay2 } from "../overlay2/overlay2";
 import { ResizeSensor } from "../resize-sensor/resizeSensor";
-// eslint-disable-next-line import/no-cycle
-import { Tooltip } from "../tooltip/tooltip";
 
 import { matchReferenceWidthModifier } from "./customModifiers";
 import { POPOVER_ARROW_SVG_SIZE, PopoverArrow } from "./popoverArrow";
 import { positionToPlacement } from "./popoverPlacementUtils";
+import { PopoverInteractionKind, type PopoverProps } from "./popoverProps";
 import type {
     DefaultPopoverTargetHTMLProps,
     PopoverClickTargetHandlers,
     PopoverHoverTargetHandlers,
-    PopoverSharedProps,
 } from "./popoverSharedProps";
 import { getBasePlacement, getTransformOrigin } from "./popperUtils";
-import type { PopupKind } from "./popupKind";
-
-export const PopoverInteractionKind = {
-    CLICK: "click" as const,
-    CLICK_TARGET_ONLY: "click-target" as const,
-    HOVER: "hover" as const,
-    HOVER_TARGET_ONLY: "hover-target" as const,
-};
-export type PopoverInteractionKind = (typeof PopoverInteractionKind)[keyof typeof PopoverInteractionKind];
-
-export interface PopoverProps<TProps extends DefaultPopoverTargetHTMLProps = DefaultPopoverTargetHTMLProps>
-    extends PopoverSharedProps<TProps> {
-    /**
-     * Whether the popover/tooltip should acquire application focus when it first opens.
-     *
-     * @default true for click interactions, false for hover interactions
-     */
-    autoFocus?: boolean;
-
-    /** HTML props for the backdrop element. Can be combined with `backdropClassName`. */
-    backdropProps?: React.HTMLProps<HTMLDivElement>;
-
-    /**
-     * The kind of interaction that triggers the display of the popover.
-     *
-     * @default "click"
-     */
-    interactionKind?: PopoverInteractionKind;
-
-    /**
-     * The kind of popup displayed by the popover. Gets directly applied to the
-     * `aria-haspopup` attribute of the target element. This property is
-     * ignored if `interactionKind` is {@link PopoverInteractionKind.HOVER_TARGET_ONLY}.
-     *
-     * @default "menu" or undefined
-     */
-    popupKind?: PopupKind;
-
-    /**
-     * Enables an invisible overlay beneath the popover that captures clicks and
-     * prevents interaction with the rest of the document until the popover is
-     * closed. This prop is only available when `interactionKind` is
-     * `PopoverInteractionKind.CLICK`. When popovers with backdrop are opened,
-     * they become focused.
-     *
-     * @default false
-     */
-    hasBackdrop?: boolean;
-
-    /**
-     * Whether the application should return focus to the last active element in the
-     * document after this popover closes.
-     *
-     * This is automatically set (overridden) to:
-     *  - `false` for hover interaction popovers
-     *  - `true` when a popover closes due to an ESC keypress
-     *
-     * If you are attaching a popover _and_ a tooltip to the same target, you must take
-     * care to either disable this prop for the popover _or_ disable the tooltip's
-     * `openOnTargetFocus` prop.
-     *
-     * @default false
-     */
-    shouldReturnFocusOnClose?: boolean;
-
-    /**
-     * Popper.js positioning strategy.
-     *
-     * @see https://popper.js.org/docs/v2/constructors/#strategy
-     * @default "absolute"
-     */
-    positioningStrategy?: PositioningStrategy;
-}
 
 export interface PopoverState {
     hasDarkParent: boolean;
@@ -421,7 +346,7 @@ export class Popover<
                 ...childTargetProps,
                 className: classNames(childTarget.props.className, targetModifierClasses),
                 // force disable single Tooltip child when popover is open
-                disabled: isOpen && Utils.isElementOfType(childTarget, Tooltip) ? true : childTarget.props.disabled,
+                disabled: isOpen && isElementTooltip(childTarget) ? true : childTarget.props.disabled,
                 tabIndex: childTarget.props.tabIndex ?? targetTabIndex,
             });
             const wrappedTarget = createElement(
@@ -789,6 +714,10 @@ export class Popover<
     }
 }
 
+function isElementTooltip(element: any): boolean {
+    return element?.type?.displayName === `${DISPLAYNAME_PREFIX}.Tooltip`;
+}
+
 function isEscapeKeypressEvent(e?: Event) {
     return e instanceof KeyboardEvent && e.key === "Escape";
 }

packages/core/src/components/popover/popoverProps.ts

@@ -0,0 +1,81 @@
+/* !
+ * (c) Copyright 2025 Palantir Technologies Inc. All rights reserved.
+ */
+
+import type { PositioningStrategy } from "@popperjs/core";
+import type * as React from "react";
+
+import type { DefaultPopoverTargetHTMLProps, PopoverSharedProps } from "./popoverSharedProps";
+import type { PopupKind } from "./popupKind";
+
+export const PopoverInteractionKind = {
+    CLICK: "click" as const,
+    CLICK_TARGET_ONLY: "click-target" as const,
+    HOVER: "hover" as const,
+    HOVER_TARGET_ONLY: "hover-target" as const,
+};
+export type PopoverInteractionKind = (typeof PopoverInteractionKind)[keyof typeof PopoverInteractionKind];
+
+export interface PopoverProps<TProps extends DefaultPopoverTargetHTMLProps = DefaultPopoverTargetHTMLProps>
+    extends PopoverSharedProps<TProps> {
+    /**
+     * Whether the popover/tooltip should acquire application focus when it first opens.
+     *
+     * @default true for click interactions, false for hover interactions
+     */
+    autoFocus?: boolean;
+
+    /** HTML props for the backdrop element. Can be combined with `backdropClassName`. */
+    backdropProps?: React.HTMLProps<HTMLDivElement>;
+
+    /**
+     * The kind of interaction that triggers the display of the popover.
+     *
+     * @default "click"
+     */
+    interactionKind?: PopoverInteractionKind;
+
+    /**
+     * The kind of popup displayed by the popover. Gets directly applied to the
+     * `aria-haspopup` attribute of the target element. This property is
+     * ignored if `interactionKind` is {@link PopoverInteractionKind.HOVER_TARGET_ONLY}.
+     *
+     * @default "menu" or undefined
+     */
+    popupKind?: PopupKind;
+
+    /**
+     * Enables an invisible overlay beneath the popover that captures clicks and
+     * prevents interaction with the rest of the document until the popover is
+     * closed. This prop is only available when `interactionKind` is
+     * `PopoverInteractionKind.CLICK`. When popovers with backdrop are opened,
+     * they become focused.
+     *
+     * @default false
+     */
+    hasBackdrop?: boolean;
+
+    /**
+     * Whether the application should return focus to the last active element in the
+     * document after this popover closes.
+     *
+     * This is automatically set (overridden) to:
+     *  - `false` for hover interaction popovers
+     *  - `true` when a popover closes due to an ESC keypress
+     *
+     * If you are attaching a popover _and_ a tooltip to the same target, you must take
+     * care to either disable this prop for the popover _or_ disable the tooltip's
+     * `openOnTargetFocus` prop.
+     *
+     * @default false
+     */
+    shouldReturnFocusOnClose?: boolean;
+
+    /**
+     * Popper.js positioning strategy.
+     *
+     * @see https://popper.js.org/docs/v2/constructors/#strategy
+     * @default "absolute"
+     */
+    positioningStrategy?: PositioningStrategy;
+}

packages/core/src/components/tooltip/tooltip.tsx

@@ -19,9 +19,9 @@ import { createRef } from "react";
 
 import { AbstractPureComponent, DISPLAYNAME_PREFIX, type IntentProps } from "../../common";
 import * as Classes from "../../common/classes";
-// eslint-disable-next-line import/no-cycle
-import { Popover, type PopoverInteractionKind } from "../popover/popover";
+import { Popover } from "../popover/popover";
 import { TOOLTIP_ARROW_SVG_SIZE } from "../popover/popoverArrow";
+import type { PopoverInteractionKind } from "../popover/popoverProps";
 import type { DefaultPopoverTargetHTMLProps, PopoverSharedProps } from "../popover/popoverSharedProps";
 import { TooltipContext, type TooltipContextState, TooltipProvider } from "../popover/tooltipContext";
 

packages/core/test/popover/popoverTests.tsx

@@ -22,7 +22,8 @@ import sinon from "sinon";
 import { Classes } from "../../src";
 import * as Errors from "../../src/common/errors";
 import { Button, PopupKind, Tooltip } from "../../src/components";
-import { Popover, type PopoverInteractionKind } from "../../src/components/popover/popover";
+import { Popover } from "../../src/components/popover/popover";
+import { type PopoverInteractionKind } from "../../src/components/popover/popoverProps";
 import { hasClass } from "../utils";
 
 describe("<Popover>", () => {