From a3716e8d3715481c160c52c7f105f81881ada3dd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pascal=20K=C3=BCsgen?= <pascalkuesgen@gmail.com>
Date: Fri, 19 Sep 2025 11:03:16 +0200
Subject: [PATCH 1/2] fix: close panel in direction of panelLocation

closes #146
---
 packages/devtools/src/components/main-panel.tsx | 2 +-
 packages/devtools/src/styles/use-styles.ts      | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/devtools/src/components/main-panel.tsx b/packages/devtools/src/components/main-panel.tsx
index f01e2082..9d20e24d 100644
--- a/packages/devtools/src/components/main-panel.tsx
+++ b/packages/devtools/src/components/main-panel.tsx
@@ -27,7 +27,7 @@ export const MainPanel = (props: {
           settings().panelLocation,
           Boolean(pip().pipWindow),
         ),
-        styles().devtoolsPanelContainerAnimation(props.isOpen(), height()),
+        styles().devtoolsPanelContainerAnimation(props.isOpen(), height(), settings().panelLocation),
         styles().devtoolsPanelContainerVisibility(props.isOpen()),
         styles().devtoolsPanelContainerResizing(props.isResizing),
       )}
diff --git a/packages/devtools/src/styles/use-styles.ts b/packages/devtools/src/styles/use-styles.ts
index 314dec1a..e6d81fb0 100644
--- a/packages/devtools/src/styles/use-styles.ts
+++ b/packages/devtools/src/styles/use-styles.ts
@@ -166,7 +166,7 @@ const stylesFactory = (theme: DevtoolsStore['settings']['theme']) => {
         transition: all 0.4s ease;
       `
     },
-    devtoolsPanelContainerAnimation: (isOpen: boolean, height: number) => {
+    devtoolsPanelContainerAnimation: (isOpen: boolean, height: number, panelLocation: TanStackDevtoolsConfig['panelLocation']) => {
       if (isOpen) {
         return css`
           pointer-events: auto;
@@ -175,7 +175,7 @@ const stylesFactory = (theme: DevtoolsStore['settings']['theme']) => {
       }
       return css`
         pointer-events: none;
-        transform: translateY(${height}px);
+        transform: translateY(${panelLocation === 'top' ? -height : height}px);
       `
     },
     devtoolsPanel: css`

From c8134affdc984307ab7170a93aa78939c4316d23 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Fri, 19 Sep 2025 10:19:23 +0000
Subject: [PATCH 2/2] ci: apply automated fixes

---
 packages/devtools/src/components/main-panel.tsx | 6 +++++-
 packages/devtools/src/styles/use-styles.ts      | 6 +++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/devtools/src/components/main-panel.tsx b/packages/devtools/src/components/main-panel.tsx
index 9d20e24d..17b1cfbf 100644
--- a/packages/devtools/src/components/main-panel.tsx
+++ b/packages/devtools/src/components/main-panel.tsx
@@ -27,7 +27,11 @@ export const MainPanel = (props: {
           settings().panelLocation,
           Boolean(pip().pipWindow),
         ),
-        styles().devtoolsPanelContainerAnimation(props.isOpen(), height(), settings().panelLocation),
+        styles().devtoolsPanelContainerAnimation(
+          props.isOpen(),
+          height(),
+          settings().panelLocation,
+        ),
         styles().devtoolsPanelContainerVisibility(props.isOpen()),
         styles().devtoolsPanelContainerResizing(props.isResizing),
       )}
diff --git a/packages/devtools/src/styles/use-styles.ts b/packages/devtools/src/styles/use-styles.ts
index e6d81fb0..6dcf5cf6 100644
--- a/packages/devtools/src/styles/use-styles.ts
+++ b/packages/devtools/src/styles/use-styles.ts
@@ -166,7 +166,11 @@ const stylesFactory = (theme: DevtoolsStore['settings']['theme']) => {
         transition: all 0.4s ease;
       `
     },
-    devtoolsPanelContainerAnimation: (isOpen: boolean, height: number, panelLocation: TanStackDevtoolsConfig['panelLocation']) => {
+    devtoolsPanelContainerAnimation: (
+      isOpen: boolean,
+      height: number,
+      panelLocation: TanStackDevtoolsConfig['panelLocation'],
+    ) => {
       if (isOpen) {
         return css`
           pointer-events: auto;