From d46eb224f5ad981dec55ab0c27af952cd7e577bb Mon Sep 17 00:00:00 2001
From: atomiks <cc.glows@gmail.com>
Date: Thu, 2 Jan 2025 19:41:28 +1100
Subject: [PATCH 1/2] [Tooltip, PreviewCard] Use FloatingPortalLite

---
 .../react/src/utils/FloatingPortalLite.tsx    | 20 +++++++++++++++++++
 1 file changed, 20 insertions(+)
 create mode 100644 packages/react/src/utils/FloatingPortalLite.tsx

diff --git a/packages/react/src/utils/FloatingPortalLite.tsx b/packages/react/src/utils/FloatingPortalLite.tsx
new file mode 100644
index 0000000000..3568c28be1
--- /dev/null
+++ b/packages/react/src/utils/FloatingPortalLite.tsx
@@ -0,0 +1,20 @@
+'use client';
+import { useFloatingPortalNode } from '@floating-ui/react';
+import * as ReactDOM from 'react-dom';
+
+/**
+ * `FloatingPortal` includes tabbable logic handling for focus management.
+ * For components that don't need tabbable logic, use `FloatingPortalLite`.
+ * @ignore - internal component.
+ */
+export function FloatingPortalLite(props: FloatingPortalLite.Props) {
+  const node = useFloatingPortalNode({ root: props.root });
+  return node && ReactDOM.createPortal(props.children, node);
+}
+
+namespace FloatingPortalLite {
+  export interface Props {
+    children?: React.ReactNode;
+    root?: HTMLElement | null | React.RefObject<HTMLElement | null>;
+  }
+}

From 077387cc619f0f22cb02634c20000cf69dbe99c4 Mon Sep 17 00:00:00 2001
From: atomiks <cc.glows@gmail.com>
Date: Tue, 7 Jan 2025 22:15:00 +1100
Subject: [PATCH 2/2] Use FloatingPortalLite

---
 packages/react/src/preview-card/portal/PreviewCardPortal.tsx | 4 ++--
 packages/react/src/tooltip/portal/TooltipPortal.tsx          | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/react/src/preview-card/portal/PreviewCardPortal.tsx b/packages/react/src/preview-card/portal/PreviewCardPortal.tsx
index b9b92c7103..cd17087eef 100644
--- a/packages/react/src/preview-card/portal/PreviewCardPortal.tsx
+++ b/packages/react/src/preview-card/portal/PreviewCardPortal.tsx
@@ -1,10 +1,10 @@
 'use client';
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { FloatingPortal } from '@floating-ui/react';
 import { usePreviewCardRootContext } from '../root/PreviewCardContext';
 import { HTMLElementType, refType } from '../../utils/proptypes';
 import { PreviewCardPortalContext } from './PreviewCardPortalContext';
+import { FloatingPortalLite } from '../../utils/FloatingPortalLite';
 
 /**
  * A portal element that moves the popup to a different part of the DOM.
@@ -24,7 +24,7 @@ function PreviewCardPortal(props: PreviewCardPortal.Props) {
 
   return (
     <PreviewCardPortalContext.Provider value={keepMounted}>
-      <FloatingPortal root={container}>{children}</FloatingPortal>
+      <FloatingPortalLite root={container}>{children}</FloatingPortalLite>
     </PreviewCardPortalContext.Provider>
   );
 }
diff --git a/packages/react/src/tooltip/portal/TooltipPortal.tsx b/packages/react/src/tooltip/portal/TooltipPortal.tsx
index 02014be2f2..f72a402162 100644
--- a/packages/react/src/tooltip/portal/TooltipPortal.tsx
+++ b/packages/react/src/tooltip/portal/TooltipPortal.tsx
@@ -1,10 +1,10 @@
 'use client';
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { FloatingPortal } from '@floating-ui/react';
 import { useTooltipRootContext } from '../root/TooltipRootContext';
 import { HTMLElementType, refType } from '../../utils/proptypes';
 import { TooltipPortalContext } from './TooltipPortalContext';
+import { FloatingPortalLite } from '../../utils/FloatingPortalLite';
 
 /**
  * A portal element that moves the popup to a different part of the DOM.
@@ -24,7 +24,7 @@ function TooltipPortal(props: TooltipPortal.Props) {
 
   return (
     <TooltipPortalContext.Provider value={keepMounted}>
-      <FloatingPortal root={container}>{children}</FloatingPortal>
+      <FloatingPortalLite root={container}>{children}</FloatingPortalLite>
     </TooltipPortalContext.Provider>
   );
 }