docs: update react tooltip docs to use the right version for v5 and v6 docs

danielbarion · danielbarion · commit f93a090aa101 · 2026-05-07T13:59:45.000-03:00
diff --git a/docs/package.json b/docs/package.json
@@ -23,7 +23,8 @@
     "prism-react-renderer": "2.4.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "react-tooltip": "6.0.1"
+    "react-tooltip": "6.0.2",
+    "react-tooltip-v5": "npm:react-tooltip@5.29.1"
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "3.10.0",
diff --git a/docs/versioned_docs/version-5.x/examples/anchor-select.mdx b/docs/versioned_docs/version-5.x/examples/anchor-select.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Using the ReactTooltip anchor select prop.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/basic-examples.mdx b/docs/versioned_docs/version-5.x/examples/basic-examples.mdx
@@ -6,7 +6,7 @@ sidebar_position: 0
 
 Some basic examples of how to use the ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/children.mdx b/docs/versioned_docs/version-5.x/examples/children.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Using children for setting the ReactTooltip content.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/content.mdx b/docs/versioned_docs/version-5.x/examples/content.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Setting the ReactTooltip content.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/delay.mdx b/docs/versioned_docs/version-5.x/examples/delay.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Delay showing/hiding the ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/events.mdx b/docs/versioned_docs/version-5.x/examples/events.mdx
@@ -14,7 +14,7 @@ See the [options page](../options.mdx#available-props) for more details.
 
 :::
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/html.mdx b/docs/versioned_docs/version-5.x/examples/html.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Using HTML content in ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/imperative-mode.mdx b/docs/versioned_docs/version-5.x/examples/imperative-mode.mdx
@@ -7,7 +7,7 @@ sidebar_position: 1
 Using the ReactTooltip imperative mode to control the tooltip programmatically.
 
 import { useRef } from 'react';
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/multiline.mdx b/docs/versioned_docs/version-5.x/examples/multiline.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Multiline content in ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/offset.mdx b/docs/versioned_docs/version-5.x/examples/offset.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Offset option for the ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/place.mdx b/docs/versioned_docs/version-5.x/examples/place.mdx
@@ -7,7 +7,7 @@ sidebar_position: 1
 Changing the placement for the ReactTooltip component.
 
 import { useState } from 'react';
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/provider-wrapper.mdx b/docs/versioned_docs/version-5.x/examples/provider-wrapper.mdx
@@ -4,15 +4,15 @@ sidebar_position: 1
 
 # Provider/wrapper
 
-Using multiple anchors elements with a single ReactTooltip component.
+Using multiple anchor elements with a single ReactTooltip component.
 
 :::danger
 
 This has been deprecated. Use the `data-tooltip-id` attribute, or the `anchorSelect` prop instead. [Click here](../getting-started.mdx) for more details.
 
 :::
 
-import { Tooltip, TooltipProvider, TooltipWrapper } from 'react-tooltip'
+import { Tooltip, TooltipProvider, TooltipWrapper } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/render.mdx b/docs/versioned_docs/version-5.x/examples/render.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Using the ReactTooltip render prop to render dynamic content based on the active anchor element.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/state.mdx b/docs/versioned_docs/version-5.x/examples/state.mdx
@@ -7,7 +7,7 @@ sidebar_position: 1
 Controlled state example for the ReactTooltip component.
 
 import { useState } from 'react'
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, background, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/examples/styling.mdx b/docs/versioned_docs/version-5.x/examples/styling.mdx
@@ -8,7 +8,7 @@ How to customize tooltip styles in ReactTooltip styles.
 
 The tooltip arrow inherits its background color from the tooltip (its parent).
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 import CodeBlock from '@theme/CodeBlock'
 import TooltipStyles from '@site/src/generated/tooltipStylesSource'
 import TooltipCoreStyles from '@site/src/generated/tooltipCoreStylesSource'
diff --git a/docs/versioned_docs/version-5.x/examples/variant.mdx b/docs/versioned_docs/version-5.x/examples/variant.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 Default color stylings available for the ReactTooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/getting-started.mdx b/docs/versioned_docs/version-5.x/getting-started.mdx
@@ -6,7 +6,7 @@ sidebar_position: 1
 
 A react tooltip is a floating react element that displays information related to an anchor element when it receives keyboard focus or the mouse hovers over it.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/options.mdx b/docs/versioned_docs/version-5.x/options.mdx
@@ -6,7 +6,7 @@ sidebar_position: 3
 
 All available data attributes for the anchor element and props for the tooltip component.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/troubleshooting.mdx b/docs/versioned_docs/version-5.x/troubleshooting.mdx
@@ -6,7 +6,7 @@ sidebar_position: 4
 
 Some tips on how to solve common issues with ReactTooltip.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/versioned_docs/version-5.x/upgrade-guide/basic-examples-v4-v5.mdx b/docs/versioned_docs/version-5.x/upgrade-guide/basic-examples-v4-v5.mdx
@@ -6,7 +6,7 @@ sidebar_position: 4
 
 Examples of use in V4 -> V5.
 
-import { Tooltip } from 'react-tooltip'
+import { Tooltip } from 'react-tooltip-v5'
 
 export const TooltipAnchor = ({ children, id, ...rest }) => {
   return (
diff --git a/docs/yarn.lock b/docs/yarn.lock
@@ -2278,7 +2278,7 @@
   dependencies:
     "@floating-ui/utils" "^0.2.11"
 
-"@floating-ui/dom@1.7.6":
+"@floating-ui/dom@1.7.6", "@floating-ui/dom@^1.6.1":
   version "1.7.6"
   resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.7.6.tgz#f915bba5abbb177e1f227cacee1b4d0634b187bf"
   integrity sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==
@@ -3940,6 +3940,11 @@ ci-info@^3.2.0:
   resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.9.0.tgz#4279a62028a7b1f262f3473fc9605f5e218c59b4"
   integrity sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==
 
+classnames@^2.3.0:
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b"
+  integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==
+
 clean-css@^5.2.2, clean-css@^5.3.3, clean-css@~5.3.2:
   version "5.3.3"
   resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-5.3.3.tgz#b330653cd3bd6b75009cc25c714cae7b93351ccd"
@@ -8298,10 +8303,18 @@ react-router@5.3.4, react-router@^5.3.4:
     tiny-invariant "^1.0.2"
     tiny-warning "^1.0.0"
 
-react-tooltip@6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-6.0.1.tgz#76c26506e43c9cb9170111aa0ade6e4da27d59c2"
-  integrity sha512-Zc83Y1x1QE0ErNnzoEkQT5GSj0HUVZPQmlezIUu4oDUQzvf1trt7Rba3QMPmeHGMTB6qsWUatUURl9AcCYPZlQ==
+"react-tooltip-v5@npm:react-tooltip@5.29.1":
+  version "5.29.1"
+  resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-5.29.1.tgz#ba0b80b04d66822590976d2a32f47544fd9feee2"
+  integrity sha512-rmJmEb/p99xWhwmVT7F7riLG08wwKykjHiMGbDPloNJk3tdI73oHsVOwzZ4SRjqMdd5/xwb/4nmz0RcoMfY7Bw==
+  dependencies:
+    "@floating-ui/dom" "^1.6.1"
+    classnames "^2.3.0"
+
+react-tooltip@6.0.2:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-6.0.2.tgz#475d020f8bbdba9e3d9ebbb68d297982ac54d9e8"
+  integrity sha512-34/RxCkIu+MzIUGZIdRr/BR6heuopU1m1k8EeVEkApFQdloM8nzgYdiigrJ/DniCoMHyx/PcFe0pbG2MtlDwnw==
   dependencies:
     "@floating-ui/dom" "1.7.6"
     clsx "2.1.1"
