@tamagui/themes 2.0.0-1768586279389 → 2.0.0-1768696252732

package/src/defaultColorThemes.ts

@@ -0,0 +1,120 @@
+import {
+  blue,
+  blueDark,
+  gray,
+  grayDark,
+  green,
+  greenDark,
+  red,
+  redDark,
+  yellow,
+  yellowDark,
+} from '@tamagui/colors'
+import { darkPalette, lightPalette, neutralPalette } from './v5-palettes'
+
+export type ColorPalette = string[]
+
+export type ColorTheme = {
+  palette: {
+    dark: ColorPalette
+    light: ColorPalette
+  }
+}
+
+/** Creates named color object from a 12-color palette array */
+function paletteToNamedColors<Name extends string>(
+  name: Name,
+  palette: ColorPalette
+): Record<`${Name}${1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12}`, string> {
+  return {
+    [`${name}1`]: palette[0]!,
+    [`${name}2`]: palette[1]!,
+    [`${name}3`]: palette[2]!,
+    [`${name}4`]: palette[3]!,
+    [`${name}5`]: palette[4]!,
+    [`${name}6`]: palette[5]!,
+    [`${name}7`]: palette[6]!,
+    [`${name}8`]: palette[7]!,
+    [`${name}9`]: palette[8]!,
+    [`${name}10`]: palette[9]!,
+    [`${name}11`]: palette[10]!,
+    [`${name}12`]: palette[11]!,
+  } as Record<`${Name}${1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12}`, string>
+}
+
+/**
+ * Default color themes for v5.
+ * Each theme has a light and dark palette variant.
+ */
+export const defaultColorThemes = {
+  black: {
+    palette: {
+      dark: Object.values(darkPalette),
+      light: Object.values(darkPalette),
+    },
+  },
+  white: {
+    palette: {
+      dark: Object.values(lightPalette),
+      light: Object.values(lightPalette),
+    },
+  },
+  gray: {
+    palette: {
+      dark: Object.values(grayDark),
+      light: Object.values(gray),
+    },
+  },
+  blue: {
+    palette: {
+      dark: Object.values(blueDark),
+      light: Object.values(blue),
+    },
+  },
+  red: {
+    palette: {
+      dark: Object.values(redDark),
+      light: Object.values(red),
+    },
+  },
+  yellow: {
+    palette: {
+      dark: Object.values(yellowDark),
+      light: Object.values(yellow),
+    },
+  },
+  green: {
+    palette: {
+      dark: Object.values(greenDark),
+      light: Object.values(green),
+    },
+  },
+  neutral: {
+    palette: {
+      dark: neutralPalette,
+      light: neutralPalette,
+    },
+  },
+}
+
+export type DefaultColorThemes = typeof defaultColorThemes
+
+/**
+ * Generates the extra colors for base theme from color themes.
+ * This ensures base.extra contains named colors (blue1-12, red1-12, etc.)
+ * for all provided color themes.
+ */
+export function colorThemesToExtra<T extends Record<string, ColorTheme>>(
+  colorThemes: T,
+  scheme: 'light' | 'dark'
+): Record<string, string> {
+  const extra: Record<string, string> = {}
+
+  for (const [name, theme] of Object.entries(colorThemes)) {
+    const palette = scheme === 'light' ? theme.palette.light : theme.palette.dark
+    const namedColors = paletteToNamedColors(name, palette)
+    Object.assign(extra, namedColors)
+  }
+
+  return extra
+}

package/src/defaultGrandChildrenThemes.ts

@@ -0,0 +1,27 @@
+export type GrandChildrenThemeDefinition = {
+  template: string
+}
+
+/** Default grandchildren theme names */
+export type DefaultGrandChildrenThemeName =
+  | 'accent'
+  | 'alt1'
+  | 'alt2'
+  | 'surface1'
+  | 'surface2'
+  | 'surface3'
+
+/**
+ * Default grandchildren themes for v5.
+ * These create sub-theme variants using different templates.
+ */
+export const defaultGrandChildrenThemes = {
+  accent: { template: 'inverse' },
+  alt1: { template: 'alt1' },
+  alt2: { template: 'alt2' },
+  surface1: { template: 'surface1' },
+  surface2: { template: 'surface2' },
+  surface3: { template: 'surface3' },
+} satisfies Record<DefaultGrandChildrenThemeName, GrandChildrenThemeDefinition>
+
+export type DefaultGrandChildrenThemes = typeof defaultGrandChildrenThemes

package/src/generated-v4-tamagui.ts

@@ -1550,7 +1550,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_Card: n28,
   light_Progress: n28,
   light_TooltipArrow: n28,
-  light_SliderTrack: n28,
   light_Input: n28,
   light_TextArea: n28,
   light_white_ListItem: n28,
@@ -1559,7 +1558,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_white_Card: n28,
   light_white_Progress: n28,
   light_white_TooltipArrow: n28,
-  light_white_SliderTrack: n28,
   light_white_Input: n28,
   light_white_TextArea: n28,
   light_surface2: n29,
@@ -1568,16 +1566,16 @@ export const themes: Record<ThemeNames, Theme> = {
   light_Switch: n29,
   light_TooltipContent: n29,
   light_RadioGroupItem: n29,
+  light_SliderTrackActive: n29,
   light_white_Checkbox: n29,
   light_white_Switch: n29,
   light_white_TooltipContent: n29,
   light_white_RadioGroupItem: n29,
+  light_white_SliderTrackActive: n29,
   light_surface3: n30,
   light_white_surface3: n30,
   light_Button: n30,
-  light_SliderTrackActive: n30,
   light_white_Button: n30,
-  light_white_SliderTrackActive: n30,
   dark_accent: n31,
   dark_alt1_accent: n31,
   dark_alt2_accent: n31,
@@ -1653,7 +1651,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_Card: n34,
   dark_Progress: n34,
   dark_TooltipArrow: n34,
-  dark_SliderTrack: n34,
   dark_Input: n34,
   dark_TextArea: n34,
   dark_black_ListItem: n34,
@@ -1662,7 +1659,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_black_Card: n34,
   dark_black_Progress: n34,
   dark_black_TooltipArrow: n34,
-  dark_black_SliderTrack: n34,
   dark_black_Input: n34,
   dark_black_TextArea: n34,
   dark_surface2: n35,
@@ -1671,18 +1667,19 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_Switch: n35,
   dark_TooltipContent: n35,
   dark_RadioGroupItem: n35,
+  dark_SliderTrackActive: n35,
   dark_black_Checkbox: n35,
   dark_black_Switch: n35,
   dark_black_TooltipContent: n35,
   dark_black_RadioGroupItem: n35,
+  dark_black_SliderTrackActive: n35,
   dark_surface3: n36,
   dark_black_surface3: n36,
   dark_Button: n36,
-  dark_SliderTrackActive: n36,
   dark_black_Button: n36,
-  dark_black_SliderTrackActive: n36,
   light_black_accent: n37,
   light_black_SwitchThumb: n37,
+  light_black_SliderTrack: n37,
   light_black_SliderThumb: n37,
   light_black_Tooltip: n37,
   light_black_ProgressIndicator: n37,
@@ -1693,7 +1690,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_black_Card: n38,
   light_black_Progress: n38,
   light_black_TooltipArrow: n38,
-  light_black_SliderTrack: n38,
   light_black_Input: n38,
   light_black_TextArea: n38,
   light_black_surface2: n39,
@@ -1701,20 +1697,23 @@ export const themes: Record<ThemeNames, Theme> = {
   light_black_Switch: n39,
   light_black_TooltipContent: n39,
   light_black_RadioGroupItem: n39,
+  light_black_SliderTrackActive: n39,
   light_black_surface3: n40,
   light_black_Button: n40,
-  light_black_SliderTrackActive: n40,
   light_white_accent: n41,
   light_SwitchThumb: n41,
+  light_SliderTrack: n41,
   light_SliderThumb: n41,
   light_Tooltip: n41,
   light_ProgressIndicator: n41,
   light_white_SwitchThumb: n41,
+  light_white_SliderTrack: n41,
   light_white_SliderThumb: n41,
   light_white_Tooltip: n41,
   light_white_ProgressIndicator: n41,
   light_gray_accent: n42,
   light_gray_SwitchThumb: n42,
+  light_gray_SliderTrack: n42,
   light_gray_SliderThumb: n42,
   light_gray_Tooltip: n42,
   light_gray_ProgressIndicator: n42,
@@ -1727,7 +1726,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_gray_Card: n45,
   light_gray_Progress: n45,
   light_gray_TooltipArrow: n45,
-  light_gray_SliderTrack: n45,
   light_gray_Input: n45,
   light_gray_TextArea: n45,
   light_gray_surface2: n46,
@@ -1735,11 +1733,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_gray_Switch: n46,
   light_gray_TooltipContent: n46,
   light_gray_RadioGroupItem: n46,
+  light_gray_SliderTrackActive: n46,
   light_gray_surface3: n47,
   light_gray_Button: n47,
-  light_gray_SliderTrackActive: n47,
   light_blue_accent: n48,
   light_blue_SwitchThumb: n48,
+  light_blue_SliderTrack: n48,
   light_blue_SliderThumb: n48,
   light_blue_Tooltip: n48,
   light_blue_ProgressIndicator: n48,
@@ -1752,7 +1751,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_blue_Card: n51,
   light_blue_Progress: n51,
   light_blue_TooltipArrow: n51,
-  light_blue_SliderTrack: n51,
   light_blue_Input: n51,
   light_blue_TextArea: n51,
   light_blue_surface2: n52,
@@ -1760,11 +1758,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_blue_Switch: n52,
   light_blue_TooltipContent: n52,
   light_blue_RadioGroupItem: n52,
+  light_blue_SliderTrackActive: n52,
   light_blue_surface3: n53,
   light_blue_Button: n53,
-  light_blue_SliderTrackActive: n53,
   light_orange_accent: n54,
   light_orange_SwitchThumb: n54,
+  light_orange_SliderTrack: n54,
   light_orange_SliderThumb: n54,
   light_orange_Tooltip: n54,
   light_orange_ProgressIndicator: n54,
@@ -1777,7 +1776,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_orange_Card: n57,
   light_orange_Progress: n57,
   light_orange_TooltipArrow: n57,
-  light_orange_SliderTrack: n57,
   light_orange_Input: n57,
   light_orange_TextArea: n57,
   light_orange_surface2: n58,
@@ -1785,11 +1783,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_orange_Switch: n58,
   light_orange_TooltipContent: n58,
   light_orange_RadioGroupItem: n58,
+  light_orange_SliderTrackActive: n58,
   light_orange_surface3: n59,
   light_orange_Button: n59,
-  light_orange_SliderTrackActive: n59,
   light_red_accent: n60,
   light_red_SwitchThumb: n60,
+  light_red_SliderTrack: n60,
   light_red_SliderThumb: n60,
   light_red_Tooltip: n60,
   light_red_ProgressIndicator: n60,
@@ -1802,7 +1801,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_red_Card: n63,
   light_red_Progress: n63,
   light_red_TooltipArrow: n63,
-  light_red_SliderTrack: n63,
   light_red_Input: n63,
   light_red_TextArea: n63,
   light_red_surface2: n64,
@@ -1810,11 +1808,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_red_Switch: n64,
   light_red_TooltipContent: n64,
   light_red_RadioGroupItem: n64,
+  light_red_SliderTrackActive: n64,
   light_red_surface3: n65,
   light_red_Button: n65,
-  light_red_SliderTrackActive: n65,
   light_yellow_accent: n66,
   light_yellow_SwitchThumb: n66,
+  light_yellow_SliderTrack: n66,
   light_yellow_SliderThumb: n66,
   light_yellow_Tooltip: n66,
   light_yellow_ProgressIndicator: n66,
@@ -1827,7 +1826,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_yellow_Card: n69,
   light_yellow_Progress: n69,
   light_yellow_TooltipArrow: n69,
-  light_yellow_SliderTrack: n69,
   light_yellow_Input: n69,
   light_yellow_TextArea: n69,
   light_yellow_surface2: n70,
@@ -1835,11 +1833,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_yellow_Switch: n70,
   light_yellow_TooltipContent: n70,
   light_yellow_RadioGroupItem: n70,
+  light_yellow_SliderTrackActive: n70,
   light_yellow_surface3: n71,
   light_yellow_Button: n71,
-  light_yellow_SliderTrackActive: n71,
   light_green_accent: n72,
   light_green_SwitchThumb: n72,
+  light_green_SliderTrack: n72,
   light_green_SliderThumb: n72,
   light_green_Tooltip: n72,
   light_green_ProgressIndicator: n72,
@@ -1852,7 +1851,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_green_Card: n75,
   light_green_Progress: n75,
   light_green_TooltipArrow: n75,
-  light_green_SliderTrack: n75,
   light_green_Input: n75,
   light_green_TextArea: n75,
   light_green_surface2: n76,
@@ -1860,11 +1858,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_green_Switch: n76,
   light_green_TooltipContent: n76,
   light_green_RadioGroupItem: n76,
+  light_green_SliderTrackActive: n76,
   light_green_surface3: n77,
   light_green_Button: n77,
-  light_green_SliderTrackActive: n77,
   light_purple_accent: n78,
   light_purple_SwitchThumb: n78,
+  light_purple_SliderTrack: n78,
   light_purple_SliderThumb: n78,
   light_purple_Tooltip: n78,
   light_purple_ProgressIndicator: n78,
@@ -1877,7 +1876,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_purple_Card: n81,
   light_purple_Progress: n81,
   light_purple_TooltipArrow: n81,
-  light_purple_SliderTrack: n81,
   light_purple_Input: n81,
   light_purple_TextArea: n81,
   light_purple_surface2: n82,
@@ -1885,11 +1883,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_purple_Switch: n82,
   light_purple_TooltipContent: n82,
   light_purple_RadioGroupItem: n82,
+  light_purple_SliderTrackActive: n82,
   light_purple_surface3: n83,
   light_purple_Button: n83,
-  light_purple_SliderTrackActive: n83,
   light_pink_accent: n84,
   light_pink_SwitchThumb: n84,
+  light_pink_SliderTrack: n84,
   light_pink_SliderThumb: n84,
   light_pink_Tooltip: n84,
   light_pink_ProgressIndicator: n84,
@@ -1902,7 +1901,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_pink_Card: n87,
   light_pink_Progress: n87,
   light_pink_TooltipArrow: n87,
-  light_pink_SliderTrack: n87,
   light_pink_Input: n87,
   light_pink_TextArea: n87,
   light_pink_surface2: n88,
@@ -1910,11 +1908,12 @@ export const themes: Record<ThemeNames, Theme> = {
   light_pink_Switch: n88,
   light_pink_TooltipContent: n88,
   light_pink_RadioGroupItem: n88,
+  light_pink_SliderTrackActive: n88,
   light_pink_surface3: n89,
   light_pink_Button: n89,
-  light_pink_SliderTrackActive: n89,
   light_tan_accent: n90,
   light_tan_SwitchThumb: n90,
+  light_tan_SliderTrack: n90,
   light_tan_SliderThumb: n90,
   light_tan_Tooltip: n90,
   light_tan_ProgressIndicator: n90,
@@ -1927,7 +1926,6 @@ export const themes: Record<ThemeNames, Theme> = {
   light_tan_Card: n93,
   light_tan_Progress: n93,
   light_tan_TooltipArrow: n93,
-  light_tan_SliderTrack: n93,
   light_tan_Input: n93,
   light_tan_TextArea: n93,
   light_tan_surface2: n94,
@@ -1935,20 +1933,23 @@ export const themes: Record<ThemeNames, Theme> = {
   light_tan_Switch: n94,
   light_tan_TooltipContent: n94,
   light_tan_RadioGroupItem: n94,
+  light_tan_SliderTrackActive: n94,
   light_tan_surface3: n95,
   light_tan_Button: n95,
-  light_tan_SliderTrackActive: n95,
   dark_black_accent: n96,
   dark_SwitchThumb: n96,
+  dark_SliderTrack: n96,
   dark_SliderThumb: n96,
   dark_Tooltip: n96,
   dark_ProgressIndicator: n96,
   dark_black_SwitchThumb: n96,
+  dark_black_SliderTrack: n96,
   dark_black_SliderThumb: n96,
   dark_black_Tooltip: n96,
   dark_black_ProgressIndicator: n96,
   dark_white_accent: n97,
   dark_white_SwitchThumb: n97,
+  dark_white_SliderTrack: n97,
   dark_white_SliderThumb: n97,
   dark_white_Tooltip: n97,
   dark_white_ProgressIndicator: n97,
@@ -1959,7 +1960,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_white_Card: n98,
   dark_white_Progress: n98,
   dark_white_TooltipArrow: n98,
-  dark_white_SliderTrack: n98,
   dark_white_Input: n98,
   dark_white_TextArea: n98,
   dark_white_surface2: n99,
@@ -1967,11 +1967,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_white_Switch: n99,
   dark_white_TooltipContent: n99,
   dark_white_RadioGroupItem: n99,
+  dark_white_SliderTrackActive: n99,
   dark_white_surface3: n100,
   dark_white_Button: n100,
-  dark_white_SliderTrackActive: n100,
   dark_gray_accent: n101,
   dark_gray_SwitchThumb: n101,
+  dark_gray_SliderTrack: n101,
   dark_gray_SliderThumb: n101,
   dark_gray_Tooltip: n101,
   dark_gray_ProgressIndicator: n101,
@@ -1984,7 +1985,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_gray_Card: n104,
   dark_gray_Progress: n104,
   dark_gray_TooltipArrow: n104,
-  dark_gray_SliderTrack: n104,
   dark_gray_Input: n104,
   dark_gray_TextArea: n104,
   dark_gray_surface2: n105,
@@ -1992,11 +1992,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_gray_Switch: n105,
   dark_gray_TooltipContent: n105,
   dark_gray_RadioGroupItem: n105,
+  dark_gray_SliderTrackActive: n105,
   dark_gray_surface3: n106,
   dark_gray_Button: n106,
-  dark_gray_SliderTrackActive: n106,
   dark_blue_accent: n107,
   dark_blue_SwitchThumb: n107,
+  dark_blue_SliderTrack: n107,
   dark_blue_SliderThumb: n107,
   dark_blue_Tooltip: n107,
   dark_blue_ProgressIndicator: n107,
@@ -2009,7 +2010,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_blue_Card: n110,
   dark_blue_Progress: n110,
   dark_blue_TooltipArrow: n110,
-  dark_blue_SliderTrack: n110,
   dark_blue_Input: n110,
   dark_blue_TextArea: n110,
   dark_blue_surface2: n111,
@@ -2017,11 +2017,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_blue_Switch: n111,
   dark_blue_TooltipContent: n111,
   dark_blue_RadioGroupItem: n111,
+  dark_blue_SliderTrackActive: n111,
   dark_blue_surface3: n112,
   dark_blue_Button: n112,
-  dark_blue_SliderTrackActive: n112,
   dark_orange_accent: n113,
   dark_orange_SwitchThumb: n113,
+  dark_orange_SliderTrack: n113,
   dark_orange_SliderThumb: n113,
   dark_orange_Tooltip: n113,
   dark_orange_ProgressIndicator: n113,
@@ -2034,7 +2035,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_orange_Card: n116,
   dark_orange_Progress: n116,
   dark_orange_TooltipArrow: n116,
-  dark_orange_SliderTrack: n116,
   dark_orange_Input: n116,
   dark_orange_TextArea: n116,
   dark_orange_surface2: n117,
@@ -2042,11 +2042,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_orange_Switch: n117,
   dark_orange_TooltipContent: n117,
   dark_orange_RadioGroupItem: n117,
+  dark_orange_SliderTrackActive: n117,
   dark_orange_surface3: n118,
   dark_orange_Button: n118,
-  dark_orange_SliderTrackActive: n118,
   dark_red_accent: n119,
   dark_red_SwitchThumb: n119,
+  dark_red_SliderTrack: n119,
   dark_red_SliderThumb: n119,
   dark_red_Tooltip: n119,
   dark_red_ProgressIndicator: n119,
@@ -2059,7 +2060,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_red_Card: n122,
   dark_red_Progress: n122,
   dark_red_TooltipArrow: n122,
-  dark_red_SliderTrack: n122,
   dark_red_Input: n122,
   dark_red_TextArea: n122,
   dark_red_surface2: n123,
@@ -2067,11 +2067,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_red_Switch: n123,
   dark_red_TooltipContent: n123,
   dark_red_RadioGroupItem: n123,
+  dark_red_SliderTrackActive: n123,
   dark_red_surface3: n124,
   dark_red_Button: n124,
-  dark_red_SliderTrackActive: n124,
   dark_yellow_accent: n125,
   dark_yellow_SwitchThumb: n125,
+  dark_yellow_SliderTrack: n125,
   dark_yellow_SliderThumb: n125,
   dark_yellow_Tooltip: n125,
   dark_yellow_ProgressIndicator: n125,
@@ -2084,7 +2085,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_yellow_Card: n128,
   dark_yellow_Progress: n128,
   dark_yellow_TooltipArrow: n128,
-  dark_yellow_SliderTrack: n128,
   dark_yellow_Input: n128,
   dark_yellow_TextArea: n128,
   dark_yellow_surface2: n129,
@@ -2092,11 +2092,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_yellow_Switch: n129,
   dark_yellow_TooltipContent: n129,
   dark_yellow_RadioGroupItem: n129,
+  dark_yellow_SliderTrackActive: n129,
   dark_yellow_surface3: n130,
   dark_yellow_Button: n130,
-  dark_yellow_SliderTrackActive: n130,
   dark_green_accent: n131,
   dark_green_SwitchThumb: n131,
+  dark_green_SliderTrack: n131,
   dark_green_SliderThumb: n131,
   dark_green_Tooltip: n131,
   dark_green_ProgressIndicator: n131,
@@ -2109,7 +2110,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_green_Card: n134,
   dark_green_Progress: n134,
   dark_green_TooltipArrow: n134,
-  dark_green_SliderTrack: n134,
   dark_green_Input: n134,
   dark_green_TextArea: n134,
   dark_green_surface2: n135,
@@ -2117,11 +2117,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_green_Switch: n135,
   dark_green_TooltipContent: n135,
   dark_green_RadioGroupItem: n135,
+  dark_green_SliderTrackActive: n135,
   dark_green_surface3: n136,
   dark_green_Button: n136,
-  dark_green_SliderTrackActive: n136,
   dark_purple_accent: n137,
   dark_purple_SwitchThumb: n137,
+  dark_purple_SliderTrack: n137,
   dark_purple_SliderThumb: n137,
   dark_purple_Tooltip: n137,
   dark_purple_ProgressIndicator: n137,
@@ -2134,7 +2135,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_purple_Card: n140,
   dark_purple_Progress: n140,
   dark_purple_TooltipArrow: n140,
-  dark_purple_SliderTrack: n140,
   dark_purple_Input: n140,
   dark_purple_TextArea: n140,
   dark_purple_surface2: n141,
@@ -2142,11 +2142,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_purple_Switch: n141,
   dark_purple_TooltipContent: n141,
   dark_purple_RadioGroupItem: n141,
+  dark_purple_SliderTrackActive: n141,
   dark_purple_surface3: n142,
   dark_purple_Button: n142,
-  dark_purple_SliderTrackActive: n142,
   dark_pink_accent: n143,
   dark_pink_SwitchThumb: n143,
+  dark_pink_SliderTrack: n143,
   dark_pink_SliderThumb: n143,
   dark_pink_Tooltip: n143,
   dark_pink_ProgressIndicator: n143,
@@ -2159,7 +2160,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_pink_Card: n146,
   dark_pink_Progress: n146,
   dark_pink_TooltipArrow: n146,
-  dark_pink_SliderTrack: n146,
   dark_pink_Input: n146,
   dark_pink_TextArea: n146,
   dark_pink_surface2: n147,
@@ -2167,11 +2167,12 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_pink_Switch: n147,
   dark_pink_TooltipContent: n147,
   dark_pink_RadioGroupItem: n147,
+  dark_pink_SliderTrackActive: n147,
   dark_pink_surface3: n148,
   dark_pink_Button: n148,
-  dark_pink_SliderTrackActive: n148,
   dark_tan_accent: n149,
   dark_tan_SwitchThumb: n149,
+  dark_tan_SliderTrack: n149,
   dark_tan_SliderThumb: n149,
   dark_tan_Tooltip: n149,
   dark_tan_ProgressIndicator: n149,
@@ -2184,7 +2185,6 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_tan_Card: n152,
   dark_tan_Progress: n152,
   dark_tan_TooltipArrow: n152,
-  dark_tan_SliderTrack: n152,
   dark_tan_Input: n152,
   dark_tan_TextArea: n152,
   dark_tan_surface2: n153,
@@ -2192,7 +2192,7 @@ export const themes: Record<ThemeNames, Theme> = {
   dark_tan_Switch: n153,
   dark_tan_TooltipContent: n153,
   dark_tan_RadioGroupItem: n153,
+  dark_tan_SliderTrackActive: n153,
   dark_tan_surface3: n154,
   dark_tan_Button: n154,
-  dark_tan_SliderTrackActive: n154,
 }