From 0358f48ec6308eed4cb4022098849be46a1155c7 Mon Sep 17 00:00:00 2001
From: creations <creations@creations.works>
Date: Sat, 25 Apr 2026 11:29:59 -0400
Subject: [PATCH] fix timout duration tooltip

---
 src/plugins/showTimeoutDuration/index.tsx  | 25 ++++++++++++++--------
 src/plugins/showTimeoutDuration/styles.css |  2 ++
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/src/plugins/showTimeoutDuration/index.tsx b/src/plugins/showTimeoutDuration/index.tsx
index 9960b4769..7fc356038 100644
--- a/src/plugins/showTimeoutDuration/index.tsx
+++ b/src/plugins/showTimeoutDuration/index.tsx
@@ -9,14 +9,13 @@ import "./styles.css";
 import { definePluginSettings } from "@api/Settings";
 import { BaseText } from "@components/BaseText";
 import ErrorBoundary from "@components/ErrorBoundary";
-import { TooltipContainer } from "@components/TooltipContainer";
 import { Devs } from "@utils/constants";
 import { getIntlMessage } from "@utils/discord";
 import { canonicalizeMatch } from "@utils/patches";
 import definePlugin, { OptionType } from "@utils/types";
 import { Message } from "@vencord/discord-types";
 import { findComponentLazy } from "@webpack";
-import { ChannelStore, GuildMemberStore } from "@webpack/common";
+import { ChannelStore, GuildMemberStore, Tooltip } from "@webpack/common";
 import { ReactNode } from "react";
 
 const countDownFilter = canonicalizeMatch(/#{intl::MAX_AGE_NEVER}/);
@@ -88,15 +87,23 @@ export default definePlugin({
 
     TooltipWrapper: ErrorBoundary.wrap(({ message, children, text }: { message: Message; children: ReactNode; text: ReactNode; }) => {
         if (settings.store.displayStyle === DisplayStyle.Tooltip)
-            return <TooltipContainer text={renderTimeout(message, false)}>{children}</TooltipContainer>;
+            return (
+                <Tooltip text={renderTimeout(message, false)}>
+                    {tooltipProps => <span {...tooltipProps}>{children}</span>}
+                </Tooltip>
+            );
 
         return (
-            <div className="vc-std-wrapper">
-                <TooltipContainer text={text}>{children}</TooltipContainer>
-                <BaseText size="md" color="text-danger">
-                    {renderTimeout(message, true)} timeout remaining
-                </BaseText>
-            </div>
+            <Tooltip text={renderTimeout(message, false)}>
+                {tooltipProps => (
+                    <div {...tooltipProps} className="vc-std-wrapper">
+                        {children}
+                        <BaseText tag="span" size="md" color="text-danger">
+                            {renderTimeout(message, true)} timeout remaining
+                        </BaseText>
+                    </div>
+                )}
+            </Tooltip>
         );
     }, { noop: true })
 });
diff --git a/src/plugins/showTimeoutDuration/styles.css b/src/plugins/showTimeoutDuration/styles.css
index a6f830c38..cb8fc677b 100644
--- a/src/plugins/showTimeoutDuration/styles.css
+++ b/src/plugins/showTimeoutDuration/styles.css
@@ -1,6 +1,8 @@
 .vc-std-wrapper {
     display: flex;
     align-items: center;
+    width: max-content;
+    max-width: 100%;
 }
 
 .vc-std-wrapper [class*="communicationDisabled"] {