From f0229d618570b512ddfbaaac6052b19fa2e9a9be Mon Sep 17 00:00:00 2001
From: thororen1234 <78185467+thororen1234@users.noreply.github.com>
Date: Wed, 21 May 2025 16:07:38 -0400
Subject: [PATCH] Fixes For Merge

---
 .../components/BuilderButton.tsx                            | 3 +++
 .../components/BuilderColorButton.tsx                       | 5 ++++-
 .../holyNotes/components/modals/NoteBookTab.tsx             | 6 +++++-
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
index 9da8049b..d9aada06 100644
--- a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
+++ b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
@@ -7,6 +7,8 @@
 import { Text, Tooltip } from "@webpack/common";
 import type { ComponentProps } from "react";
 
+import { buttonRef } from "./BuilderColorButton";
+
 export interface BuilderButtonProps {
     label?: string | undefined;
     tooltip?: string | undefined;
@@ -32,6 +34,7 @@ export const BuilderButton = ({ label, tooltip, selectedStyle, buttonProps }: Bu
                         borderRadius: "4px",
                         cursor: "pointer"
                     }}
+                    ref={buttonRef}
                 >
                     {!selectedStyle && (
                         <svg
diff --git a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
index e29357a5..43f38e17 100644
--- a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
+++ b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import { Popout } from "@webpack/common";
+import { Popout, useRef } from "@webpack/common";
 
 import { BuilderButton, type BuilderButtonProps, CustomColorPicker, type CustomColorPickerProps } from ".";
 
@@ -13,9 +13,12 @@ export interface BuilderColorButtonProps extends Pick<BuilderButtonProps, "label
     setColor: (color: number | null) => void;
 }
 
+export const buttonRef = useRef(null);
+
 export const BuilderColorButton = ({ label, color, setColor, suggestedColors }: BuilderColorButtonProps) => (
     <Popout
         position="bottom"
+        targetElementRef={buttonRef}
         renderPopout={() => (
             <CustomColorPicker
                 value={color}
diff --git a/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx b/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
index f1c62dad..4dbdee51 100644
--- a/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
+++ b/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
@@ -6,7 +6,7 @@
 
 import { classes } from "@utils/misc";
 import { findByCode } from "@webpack";
-import { Button, Clickable, Menu, Popout, React } from "@webpack/common";
+import { Button, Clickable, Menu, Popout, React, useRef } from "@webpack/common";
 
 import { SvgOverFlowIcon } from "../icons/overFlowIcon";
 
@@ -101,6 +101,8 @@ export function NoteBookTabs({ tabs, selectedTabId, onSelectTab }: { tabs: strin
         );
     }, [tabs, selectedTabId, onSelectTab, overflowedTabs]);
 
+    const buttonRef = useRef(null);
+
     return (
         <div
             className={classes("vc-notebook-tabbar")}
@@ -137,9 +139,11 @@ export function NoteBookTabs({ tabs, selectedTabId, onSelectTab }: { tabs: strin
                     position="bottom"
                     align="right"
                     spacing={0}
+                    targetElementRef={buttonRef}
                 >
                     {props => (
                         <Button
+                            ref={buttonRef}
                             {...props}
                             className={"vc-notebook-overflow-chevron"}
                             size={Button.Sizes.ICON}