From c1e1a6bad21c223132f319c342c15f60d835a857 Mon Sep 17 00:00:00 2001
From: TkDodo <dominik.dorfmeister@sentry.io>
Date: Mon, 15 Dec 2025 14:51:27 +0100
Subject: [PATCH] ref(scraps): move formTheme into commonTheme

---
 static/app/utils/theme/theme.tsx | 121 +++++++++++++++----------------
 1 file changed, 59 insertions(+), 62 deletions(-)

diff --git a/static/app/utils/theme/theme.tsx b/static/app/utils/theme/theme.tsx
index 1266bbd9744f52..824824e72fd071 100644
--- a/static/app/utils/theme/theme.tsx
+++ b/static/app/utils/theme/theme.tsx
@@ -444,23 +444,6 @@ export type FormSize = 'xs' | 'sm' | 'md';
 
 export type Space = keyof typeof space;
 
-type FormTheme = {
-  form: Record<
-    FormSize,
-    {
-      borderRadius: string;
-      fontSize: string;
-      height: string;
-      lineHeight: string;
-      minHeight: string;
-      paddingBottom: number;
-      paddingLeft: number;
-      paddingRight: number;
-      paddingTop: number;
-    }
-  >;
-};
-
 const iconSizes: Record<Size, string> = {
   xs: '12px',
   sm: '14px',
@@ -484,6 +467,64 @@ const legacyTypography = {
   },
 } as const;
 
+type FormTheme = {
+  form: Record<
+    FormSize,
+    {
+      borderRadius: string;
+      fontSize: string;
+      height: string;
+      lineHeight: string;
+      minHeight: string;
+      paddingBottom: number;
+      paddingLeft: number;
+      paddingRight: number;
+      paddingTop: number;
+    }
+  >;
+};
+const formTheme: FormTheme = {
+  /**
+   * Common styles for form inputs & buttons, separated by size.
+   * Should be used to ensure consistent sizing among form elements.
+   */
+  form: {
+    md: {
+      height: '36px',
+      minHeight: '36px',
+      fontSize: '0.875rem',
+      lineHeight: '1rem',
+      paddingLeft: 16,
+      paddingRight: 16,
+      paddingTop: 12,
+      paddingBottom: 12,
+      borderRadius: radius.lg,
+    },
+    sm: {
+      height: '32px',
+      minHeight: '32px',
+      fontSize: '0.875rem',
+      lineHeight: '1rem',
+      paddingLeft: 12,
+      paddingRight: 12,
+      paddingTop: 8,
+      paddingBottom: 8,
+      borderRadius: radius.md,
+    },
+    xs: {
+      height: '28px',
+      minHeight: '28px',
+      fontSize: '0.75rem',
+      lineHeight: '1rem',
+      paddingLeft: 8,
+      paddingRight: 8,
+      paddingTop: 6,
+      paddingBottom: 6,
+      borderRadius: radius.sm,
+    },
+  },
+};
+
 /**
  * Values shared between light and dark theme
  */
@@ -568,6 +609,7 @@ const commonTheme = {
   borderRadius: '6px',
   ...legacyTypography,
   ...typography,
+  ...formTheme,
 };
 
 export type Color = keyof ReturnType<typeof deprecatedColorMappings>;
@@ -967,48 +1009,6 @@ function makeChartColorPalette<T extends ChartColorPalette>(
   };
 }
 
-const formTheme: FormTheme = {
-  /**
-   * Common styles for form inputs & buttons, separated by size.
-   * Should be used to ensure consistent sizing among form elements.
-   */
-  form: {
-    md: {
-      height: '36px',
-      minHeight: '36px',
-      fontSize: '0.875rem',
-      lineHeight: '1rem',
-      paddingLeft: 16,
-      paddingRight: 16,
-      paddingTop: 12,
-      paddingBottom: 12,
-      borderRadius: radius.lg,
-    },
-    sm: {
-      height: '32px',
-      minHeight: '32px',
-      fontSize: '0.875rem',
-      lineHeight: '1rem',
-      paddingLeft: 12,
-      paddingRight: 12,
-      paddingTop: 8,
-      paddingBottom: 8,
-      borderRadius: radius.md,
-    },
-    xs: {
-      height: '28px',
-      minHeight: '28px',
-      fontSize: '0.75rem',
-      lineHeight: '1rem',
-      paddingLeft: 8,
-      paddingRight: 8,
-      paddingTop: 6,
-      paddingBottom: 6,
-      borderRadius: radius.sm,
-    },
-  },
-};
-
 // @TODO(jonasbadalic): eventually, we should port component usage to these values
 function generateChonkTokens(colorScheme: typeof lightColors) {
   return {
@@ -1631,8 +1631,6 @@ const lightThemeDefinition = {
   type: 'light' as 'light' | 'dark',
   // @TODO: color theme contains some colors (like chart color palette, diff, tag and level)
   ...commonTheme,
-
-  ...formTheme,
   ...deprecatedColorMappings(lightColors),
   ...lightAliases,
   ...lightShadows,
@@ -1682,7 +1680,6 @@ export const darkTheme: SentryTheme = {
   // @TODO: color theme contains some colors (like chart color palette, diff, tag and level)
   ...commonTheme,
 
-  ...formTheme,
   ...deprecatedColorMappings(darkColors),
   ...darkAliases,
   ...darkShadows,