@matteoaliano/forest-ui 0.3.0 → 0.3.2

package/dist/theme.js

@@ -5,181 +5,293 @@ var styles = require('@mui/material/styles');
 // src/theme/buildTheme.ts
 
 // src/theme/tokens.ts
-var colors = {
-  base: {
-    white: "#ffffff",
-    black: "#000000",
-    transparent: "#ffffff00"
-  },
-  brand: {
-    25: "#fcfaff",
-    50: "#f9f5ff",
-    100: "#f4ebff",
-    200: "#e9d7fe",
-    300: "#d6bbfb",
-    400: "#b692f6",
-    500: "#9e77ed",
-    600: "#7f56d9",
-    700: "#6941c6",
-    800: "#53389e",
-    900: "#42307d",
-    950: "#2c1c5f"
-  },
-  gray: {
-    25: "#fcfcfd",
-    50: "#f9fafb",
-    100: "#f2f4f7",
-    200: "#eaecf0",
-    300: "#d0d5dd",
-    400: "#98a2b3",
-    500: "#667085",
-    600: "#475467",
-    700: "#344054",
-    800: "#182230",
-    900: "#101828",
-    950: "#0c111d"
-  },
-  error: {
-    25: "#fffbfa",
-    50: "#fef3f2",
-    100: "#fee4e2",
-    200: "#fecdca",
-    300: "#fda29b",
-    400: "#f97066",
-    500: "#f04438",
-    600: "#d92d20",
-    700: "#b42318",
-    800: "#912018",
-    900: "#7a271a",
-    950: "#55160c"
-  },
-  warning: {
-    25: "#fffcf5",
-    50: "#fffaeb",
-    100: "#fef0c7",
-    200: "#fedf89",
-    300: "#fec84b",
-    400: "#fdb022",
-    500: "#f79009",
-    600: "#dc6803",
-    700: "#b54708",
-    800: "#93370d",
-    900: "#7a2e0e",
-    950: "#4e1d09"
-  },
-  success: {
-    25: "#f6fef9",
-    50: "#ecfdf3",
-    100: "#dcfae6",
-    200: "#abefc6",
-    300: "#75e0a7",
-    400: "#47cd89",
-    500: "#17b26a",
-    600: "#079455",
-    700: "#067647",
-    800: "#085d3a",
-    900: "#074d31",
-    950: "#053321"
-  },
-  blue: {
-    25: "#f5faff",
-    50: "#eff8ff",
-    100: "#d1e9ff",
-    200: "#b2ddff",
-    300: "#84caff",
-    400: "#53b1fd",
-    500: "#2e90fa",
-    600: "#1570ef",
-    700: "#175cd3",
-    800: "#1849a9",
-    900: "#194185",
-    950: "#102a56"
-  },
+var violet = {
+  25: "#faf8ff",
+  50: "#f5f0ff",
+  100: "#ebe0ff",
+  200: "#d6c0ff",
+  300: "#b090ff",
+  400: "#9D5FFF",
+  500: "#7c4de6",
+  600: "#5b3acc",
+  700: "#3a1aad",
+  800: "#190a8a",
+  900: "#000066",
+  950: "#000033"
+};
+var magenta = {
+  25: "#fff8fd",
+  50: "#fff0fa",
+  100: "#ffe0f5",
+  200: "#ffc0eb",
+  300: "#ff90d8",
+  400: "#FF78F3",
+  500: "#e650d4",
+  600: "#cc28b5",
+  700: "#a3008c",
+  800: "#7a0066",
+  900: "#520044",
+  950: "#290022"
+};
+var gray = {
+  25: "#fdfcfc",
+  50: "#faf9f8",
+  100: "#f5f3f1",
+  200: "#e8e5e3",
+  300: "#d8d8dc",
+  400: "#a0a0a6",
+  500: "#71717a",
+  600: "#52525b",
+  700: "#3f3f46",
+  800: "#27272a",
+  900: "#18181b",
+  950: "#09090b"
+};
+var red = {
+  25: "#fff8f7",
+  50: "#fff0ee",
+  100: "#ffe0dd",
+  200: "#ffc0bb",
+  300: "#ff9090",
+  400: "#FF2821",
+  500: "#e61a1a",
+  600: "#cc1010",
+  700: "#a30808",
+  800: "#7a0000",
+  900: "#520000",
+  950: "#290000"
+};
+var info = {
+  25: "#f5faff",
+  50: "#eff8ff",
+  100: "#d1e9ff",
+  200: "#b2ddff",
+  300: "#84caff",
+  400: "#53b1fd",
+  500: "#2e90fa",
+  600: "#1570ef",
+  700: "#175cd3",
+  800: "#1849a9",
+  900: "#194185",
+  950: "#102a56"
+};
+var misc = {
   teal: {
+    25: "#f6fefc",
     50: "#f0fdf9",
     100: "#ccfbef",
     200: "#99f6e0",
     300: "#5fe9d0",
     400: "#2ed3b7",
+    500: "#15b79e",
     600: "#0e9384",
-    700: "#107569"
+    700: "#107569",
+    800: "#125d56",
+    900: "#134e48",
+    950: "#0a2926"
   },
   orange: {
+    25: "#fefaf5",
+    50: "#fef6ee",
     100: "#fdead7",
     200: "#f9dbaf",
     300: "#f7b27a",
     400: "#f38744",
+    500: "#ef6820",
     600: "#e04f16",
-    700: "#b93815"
+    700: "#b93815",
+    800: "#932f19",
+    900: "#772917",
+    950: "#511c10"
   },
   purple: {
+    25: "#fafaff",
+    50: "#f4f3ff",
     100: "#ebe9fe",
     200: "#d9d6fe",
+    300: "#bdb4fe",
+    400: "#9b8afb",
+    500: "#7a5af8",
     600: "#6938ef",
-    700: "#5925dc"
+    700: "#5925dc",
+    800: "#4a1fb8",
+    900: "#3e1c96",
+    950: "#27115f"
   },
   pink: {
+    25: "#fef6fb",
+    50: "#fdf2fa",
     100: "#fce7f6",
     200: "#fcceee",
+    300: "#faa7e0",
     400: "#f670c7",
     500: "#ee46bc",
     600: "#dd2590",
-    700: "#c11574"
+    700: "#c11574",
+    800: "#9e165f",
+    900: "#851651",
+    950: "#4e0d30"
   },
   fuchsia: {
+    25: "#fefaff",
+    50: "#fdf4ff",
     100: "#fbe8ff",
     200: "#f6d0fe",
+    300: "#eeaafd",
     400: "#e478fa",
     500: "#d444f1",
     600: "#ba24d5",
-    700: "#9f1ab1"
+    700: "#9f1ab1",
+    800: "#821890",
+    900: "#6f1877",
+    950: "#47104c"
   },
   orangeDark: {
+    25: "#fff9f5",
+    50: "#fff4ed",
     100: "#ffe6d5",
     200: "#ffd6ae",
+    300: "#ff9c66",
     400: "#ff692e",
     500: "#ff4405",
     600: "#e62e05",
-    700: "#bc1b06"
+    700: "#bc1b06",
+    800: "#97180c",
+    900: "#771a0d",
+    950: "#57130a"
   },
   green: {
+    25: "#f6fef9",
+    50: "#edfcf2",
     100: "#d3f8df",
     200: "#aaf0c4",
+    300: "#73e2a3",
+    400: "#3ccb7f",
     500: "#16b364",
     600: "#099250",
-    700: "#087443"
+    700: "#087443",
+    800: "#095c37",
+    900: "#084c2e",
+    950: "#052e1c"
   },
   indigo: {
+    25: "#f5f8ff",
+    50: "#eef4ff",
     100: "#e0eaff",
     200: "#c7d7fe",
+    300: "#a4bcfd",
+    400: "#8098f9",
+    500: "#6172f3",
     600: "#444ce7",
-    700: "#3538cd"
-  },
-  violet: {
-    100: "#ece9fe",
-    200: "#ddd6fe",
-    500: "#875bf7",
-    600: "#7839ee"
+    700: "#3538cd",
+    800: "#2d31a6",
+    900: "#2d3282",
+    950: "#1f235b"
   },
   rose: {
+    25: "#fff5f6",
+    50: "#fff1f3",
     100: "#ffe4e8",
     200: "#fecdd6",
+    300: "#fea3b4",
     400: "#fd6f8e",
-    500: "#f63d68"
+    500: "#f63d68",
+    600: "#e31b54",
+    700: "#c01048",
+    800: "#a11043",
+    900: "#89123e",
+    950: "#510b24"
   },
   blueLight: {
+    25: "#f5fbff",
+    50: "#f0f9ff",
     100: "#e0f2fe",
     200: "#b9e6fe",
+    300: "#7cd4fd",
     400: "#36bffa",
-    500: "#0ba5ec"
+    500: "#0ba5ec",
+    600: "#0086c9",
+    700: "#026aa2",
+    800: "#065986",
+    900: "#0b4a6f",
+    950: "#062c41"
   },
   cyan: {
+    25: "#f5feff",
+    50: "#ecfdff",
     100: "#cff9fe",
     200: "#a5f0fc",
+    300: "#67e3f9",
+    400: "#22ccee",
+    500: "#06aed4",
     600: "#088ab2",
-    700: "#0e7090"
+    700: "#0e7090",
+    800: "#155b75",
+    900: "#164c63",
+    950: "#0d2d3a"
   }
 };
+var radiusSharp = {
+  xxs: 1,
+  xs: 2,
+  sm: 3,
+  md: 4,
+  lg: 5,
+  xl: 6,
+  "2xl": 8,
+  "3xl": 10,
+  "4xl": 12
+};
+var colors = {
+  base: {
+    white: "#ffffff",
+    black: "#000000",
+    transparent: "#ffffff00"
+  },
+  error: {
+    25: "#fffbfa",
+    50: "#fef3f2",
+    100: "#fee4e2",
+    200: "#fecdca",
+    300: "#fda29b",
+    400: "#f97066",
+    500: "#f04438",
+    600: "#d92d20",
+    700: "#b42318",
+    800: "#912018",
+    900: "#7a271a",
+    950: "#55160c"
+  },
+  warning: {
+    25: "#fffcf5",
+    50: "#fffaeb",
+    100: "#fef0c7",
+    200: "#fedf89",
+    300: "#fec84b",
+    400: "#fdb022",
+    500: "#f79009",
+    600: "#dc6803",
+    700: "#b54708",
+    800: "#93370d",
+    900: "#7a2e0e",
+    950: "#4e1d09"
+  },
+  success: {
+    25: "#f6fef9",
+    50: "#ecfdf3",
+    100: "#dcfae6",
+    200: "#abefc6",
+    300: "#75e0a7",
+    400: "#47cd89",
+    500: "#17b26a",
+    600: "#079455",
+    700: "#067647",
+    800: "#085d3a",
+    900: "#074d31",
+    950: "#053321"
+  },
+  info
+};
 var spacing = {
   none: 0,
   xxs: 2,
@@ -222,12 +334,12 @@ var shadows = {
   "3xl": "0px 32px 64px -12px #10182824"
 };
 var focusRings = {
-  brand: "0px 0px 0px 4px #9e77ed3d",
-  brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #9e77ed3d",
-  brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #9e77ed3d",
-  gray: "0px 0px 0px 4px #98a2b324",
-  grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #98a2b324",
-  grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #98a2b324",
+  brand: "0px 0px 0px 4px #7c4de63d",
+  brandShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #7c4de63d",
+  brandShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #7c4de63d",
+  gray: "0px 0px 0px 4px #a0a0a624",
+  grayShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #a0a0a624",
+  grayShadowSm: "0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #a0a0a624",
   error: "0px 0px 0px 4px #f044383d",
   errorShadowXs: "0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f044383d"
 };
@@ -281,51 +393,51 @@ var widths = {
   "6xl": 1920
 };
 var text = {
-  primary: colors.gray[900],
-  secondary: colors.gray[700],
-  secondaryHover: colors.gray[800],
-  tertiary: colors.gray[600],
-  tertiaryHover: colors.gray[700],
-  quaternary: colors.gray[500],
-  disabled: colors.gray[500],
-  placeholder: colors.gray[500],
-  placeholderSubtle: colors.gray[300],
+  primary: gray[900],
+  secondary: gray[700],
+  secondaryHover: gray[800],
+  tertiary: gray[600],
+  tertiaryHover: gray[700],
+  quaternary: gray[500],
+  disabled: gray[500],
+  placeholder: gray[500],
+  placeholderSubtle: gray[300],
   white: colors.base.white,
-  brandPrimary: colors.brand[900],
-  brandSecondary: colors.brand[700],
-  brandTertiary: colors.brand[600],
-  brandTertiaryAlt: colors.brand[600],
+  brandPrimary: violet[900],
+  brandSecondary: violet[700],
+  brandTertiary: violet[600],
+  brandTertiaryAlt: violet[600],
   primaryOnBrand: colors.base.white,
-  secondaryOnBrand: colors.brand[200],
-  tertiaryOnBrand: colors.brand[200],
-  quaternaryOnBrand: colors.brand[300],
+  secondaryOnBrand: violet[200],
+  tertiaryOnBrand: violet[200],
+  quaternaryOnBrand: violet[300],
   errorPrimary: colors.error[600],
   warningPrimary: colors.warning[600],
   successPrimary: colors.success[600]
 };
 var bg = {
-  primary: colors.gray[50],
-  primaryAlt: colors.gray[50],
-  primaryHover: colors.gray[100],
-  primarySolid: colors.gray[950],
+  primary: gray[50],
+  primaryAlt: gray[50],
+  primaryHover: gray[100],
+  primarySolid: gray[950],
   secondary: colors.base.white,
   secondaryAlt: colors.base.white,
-  secondarySubtle: colors.gray[25],
-  secondaryHover: colors.gray[50],
-  secondarySolid: colors.gray[600],
-  tertiary: colors.gray[100],
-  quaternary: colors.gray[200],
-  active: colors.gray[200],
-  disabled: colors.gray[100],
-  disabledSubtle: colors.gray[50],
-  overlay: colors.gray[950],
-  brandPrimary: colors.brand[50],
-  brandPrimaryAlt: colors.brand[50],
-  brandSecondary: colors.brand[100],
-  brandSolid: colors.brand[600],
-  brandSolidHover: colors.brand[700],
-  brandSection: colors.brand[800],
-  brandSectionSubtle: colors.brand[700],
+  secondarySubtle: gray[25],
+  secondaryHover: gray[50],
+  secondarySolid: gray[600],
+  tertiary: gray[100],
+  quaternary: gray[200],
+  active: gray[200],
+  disabled: gray[100],
+  disabledSubtle: gray[50],
+  overlay: gray[950],
+  brandPrimary: violet[50],
+  brandPrimaryAlt: violet[50],
+  brandSecondary: violet[100],
+  brandSolid: violet[600],
+  brandSolidHover: violet[700],
+  brandSection: violet[800],
+  brandSectionSubtle: violet[700],
   errorPrimary: colors.error[50],
   errorSecondary: colors.error[100],
   errorSolid: colors.error[600],
@@ -337,22 +449,22 @@ var bg = {
   successSolid: colors.success[600]
 };
 var fg = {
-  primary: colors.gray[900],
-  secondary: colors.gray[700],
-  secondaryHover: colors.gray[800],
-  tertiary: colors.gray[600],
-  tertiaryHover: colors.gray[700],
-  quaternary: colors.gray[500],
-  quaternaryHover: colors.gray[600],
-  quinary: colors.gray[400],
-  quinaryHover: colors.gray[500],
-  senary: colors.gray[300],
+  primary: gray[900],
+  secondary: gray[700],
+  secondaryHover: gray[800],
+  tertiary: gray[600],
+  tertiaryHover: gray[700],
+  quaternary: gray[500],
+  quaternaryHover: gray[600],
+  quinary: gray[400],
+  quinaryHover: gray[500],
+  senary: gray[300],
   white: colors.base.white,
-  disabled: colors.gray[400],
-  disabledSubtle: colors.gray[300],
-  brandPrimary: colors.brand[600],
-  brandPrimaryAlt: colors.brand[600],
-  brandSecondary: colors.brand[500],
+  disabled: gray[400],
+  disabledSubtle: gray[300],
+  brandPrimary: violet[600],
+  brandPrimaryAlt: violet[600],
+  brandSecondary: violet[500],
   errorPrimary: colors.error[600],
   errorSecondary: colors.error[500],
   warningPrimary: colors.warning[600],
@@ -361,51 +473,51 @@ var fg = {
   successSecondary: colors.success[500]
 };
 var border = {
-  primary: colors.gray[300],
-  secondary: colors.gray[200],
-  tertiary: colors.gray[100],
-  disabled: colors.gray[300],
-  disabledSubtle: colors.gray[200],
-  brand: colors.brand[300],
-  brandSolid: colors.brand[600],
-  brandSolidAlt: colors.brand[600],
+  primary: gray[300],
+  secondary: gray[200],
+  tertiary: gray[100],
+  disabled: gray[300],
+  disabledSubtle: gray[200],
+  brand: violet[300],
+  brandSolid: violet[600],
+  brandSolidAlt: violet[600],
   error: colors.error[300],
   errorSolid: colors.error[600]
 };
 var buttonColors = {
   primary: {
-    bg: colors.brand[600],
-    bgHover: colors.brand[700],
+    bg: violet[600],
+    bgHover: violet[700],
     fg: colors.base.white,
     fgHover: colors.base.white,
-    border: colors.brand[600],
-    borderHover: colors.brand[700]
+    border: violet[600],
+    borderHover: violet[700]
   },
   secondary: {
     bg: colors.base.white,
-    bgHover: colors.gray[50],
-    fg: colors.gray[700],
-    fgHover: colors.gray[800],
-    border: colors.gray[300],
-    borderHover: colors.gray[300]
+    bgHover: gray[50],
+    fg: gray[700],
+    fgHover: gray[800],
+    border: gray[300],
+    borderHover: gray[300]
   },
   secondaryColor: {
     bg: colors.base.white,
-    bgHover: colors.brand[50],
-    fg: colors.brand[700],
-    fgHover: colors.brand[800],
-    border: colors.brand[300],
-    borderHover: colors.brand[300]
+    bgHover: violet[50],
+    fg: violet[700],
+    fgHover: violet[800],
+    border: violet[300],
+    borderHover: violet[300]
   },
   tertiary: {
-    fg: colors.gray[600],
-    fgHover: colors.gray[700],
-    bgHover: colors.gray[50]
+    fg: gray[600],
+    fgHover: gray[700],
+    bgHover: gray[50]
   },
   tertiaryColor: {
-    fg: colors.brand[700],
-    fgHover: colors.brand[800],
-    bgHover: colors.brand[50]
+    fg: violet[700],
+    fgHover: violet[800],
+    bgHover: violet[50]
   },
   primaryError: {
     bg: colors.error[600],
@@ -430,27 +542,27 @@ var buttonColors = {
   }
 };
 var avatarColors = {
-  bg: colors.gray[100],
+  bg: gray[100],
   contrastBorder: "#00000014",
   profilePhotoBorder: colors.base.white,
-  focusBorder: "#98a2b324"
+  focusBorder: "#a0a0a624"
 };
 var breadcrumbColors = {
-  fg: colors.gray[600],
-  fgHover: colors.gray[700],
-  bgHover: colors.gray[50],
-  brandBgHover: colors.brand[50],
-  brandFgHover: colors.brand[700],
-  iconFg: colors.gray[500],
-  iconFgHover: colors.gray[700],
-  brandIconFgHover: colors.brand[700]
+  fg: gray[600],
+  fgHover: gray[700],
+  bgHover: gray[50],
+  brandBgHover: violet[50],
+  brandFgHover: violet[700],
+  iconFg: gray[500],
+  iconFgHover: gray[700],
+  brandIconFgHover: violet[700]
 };
 var iconColors = {
-  fgBrand: colors.brand[600],
-  fgBrandOnBrand: colors.brand[200],
-  featuredModernBorder: colors.gray[200],
-  featuredLightFgBrand: colors.brand[600],
-  featuredLightFgGray: colors.gray[500],
+  fgBrand: violet[600],
+  fgBrandOnBrand: violet[200],
+  featuredModernBorder: gray[200],
+  featuredLightFgBrand: violet[600],
+  featuredLightFgGray: gray[500],
   featuredLightFgError: colors.error[600],
   featuredLightFgWarning: colors.warning[600],
   featuredLightFgSuccess: colors.success[600],
@@ -461,42 +573,42 @@ var iconColors = {
   featuredDarkFgSuccess: colors.base.white
 };
 var navColors = {
-  itemIconFg: colors.gray[500],
-  itemIconFgActive: colors.gray[700],
-  itemButtonIconFg: colors.gray[500],
-  itemButtonIconFgActive: colors.gray[700]
+  itemIconFg: gray[500],
+  itemIconFgActive: gray[700],
+  itemButtonIconFg: gray[500],
+  itemButtonIconFgActive: gray[700]
 };
 var sliderColors = {
-  handleBorder: colors.brand[600],
+  handleBorder: violet[600],
   handleBg: colors.base.white
 };
 var toggleColors = {
-  buttonFgDisabled: colors.gray[50]
+  buttonFgDisabled: gray[50]
 };
 var chartColors = {
-  axisFg: colors.gray[100],
-  gridlineFg: colors.gray[100],
-  labelFg: colors.gray[600],
-  labelFgEmphasis: colors.gray[700],
+  axisFg: gray[100],
+  gridlineFg: gray[100],
+  labelFg: gray[600],
+  labelFgEmphasis: gray[700],
   bg: colors.base.white,
-  bgAlt: colors.gray[50],
-  tooltipBg: colors.gray[950],
+  bgAlt: gray[50],
+  tooltipBg: gray[950],
   tooltipFg: colors.base.white,
-  crosshairFg: colors.gray[500],
+  crosshairFg: gray[500],
   legendFg: text.tertiary,
   series: [
-    { fg: colors.violet[500], fgHover: colors.violet[600], bg: colors.violet[100], bgHover: colors.violet[200] },
-    { fg: colors.orangeDark[400], fgHover: colors.orangeDark[500], bg: colors.orangeDark[100], bgHover: colors.orangeDark[200] },
-    { fg: colors.teal[300], fgHover: colors.teal[400], bg: colors.teal[50], bgHover: colors.teal[100] },
+    { fg: misc.purple[500], fgHover: misc.purple[600], bg: misc.purple[100], bgHover: misc.purple[200] },
+    { fg: misc.orangeDark[400], fgHover: misc.orangeDark[500], bg: misc.orangeDark[100], bgHover: misc.orangeDark[200] },
+    { fg: misc.teal[300], fgHover: misc.teal[400], bg: misc.teal[50], bgHover: misc.teal[100] },
     { fg: colors.warning[400], fgHover: colors.warning[500], bg: colors.warning[100], bgHover: colors.warning[200] },
-    { fg: colors.rose[400], fgHover: colors.rose[500], bg: colors.rose[100], bgHover: colors.rose[200] },
-    { fg: colors.blueLight[400], fgHover: colors.blueLight[500], bg: colors.blueLight[100], bgHover: colors.blueLight[200] },
-    { fg: colors.orange[300], fgHover: colors.orange[400], bg: colors.orange[100], bgHover: colors.orange[200] },
-    { fg: colors.cyan[600], fgHover: colors.cyan[700], bg: colors.cyan[100], bgHover: colors.cyan[200] },
-    { fg: colors.green[500], fgHover: colors.green[600], bg: colors.green[100], bgHover: colors.green[200] },
-    { fg: colors.pink[400], fgHover: colors.pink[500], bg: colors.pink[100], bgHover: colors.pink[200] },
-    { fg: colors.fuchsia[400], fgHover: colors.fuchsia[500], bg: colors.fuchsia[100], bgHover: colors.fuchsia[200] },
-    { fg: colors.teal[600], fgHover: colors.teal[700], bg: colors.teal[100], bgHover: colors.teal[200] }
+    { fg: misc.rose[400], fgHover: misc.rose[500], bg: misc.rose[100], bgHover: misc.rose[200] },
+    { fg: misc.blueLight[400], fgHover: misc.blueLight[500], bg: misc.blueLight[100], bgHover: misc.blueLight[200] },
+    { fg: misc.orange[300], fgHover: misc.orange[400], bg: misc.orange[100], bgHover: misc.orange[200] },
+    { fg: misc.cyan[600], fgHover: misc.cyan[700], bg: misc.cyan[100], bgHover: misc.cyan[200] },
+    { fg: misc.green[500], fgHover: misc.green[600], bg: misc.green[100], bgHover: misc.green[200] },
+    { fg: misc.pink[400], fgHover: misc.pink[500], bg: misc.pink[100], bgHover: misc.pink[200] },
+    { fg: misc.fuchsia[400], fgHover: misc.fuchsia[500], bg: misc.fuchsia[100], bgHover: misc.fuchsia[200] },
+    { fg: misc.teal[600], fgHover: misc.teal[700], bg: misc.teal[100], bgHover: misc.teal[200] }
   ]
 };
 var alpha = {
@@ -532,16 +644,16 @@ function buildPalette(tokens) {
   const { colors: colors5, text: text5, bg: bg5, fg: fg5, border: border5 } = tokens;
   return {
     primary: {
-      main: colors5.brand[600],
-      light: colors5.brand[400],
-      dark: colors5.brand[700],
-      contrastText: colors5.base.white
+      main: violet[600],
+      light: violet[400],
+      dark: violet[700],
+      contrastText: tokens.colors.base.white
     },
     secondary: {
-      main: colors5.gray[600],
-      light: colors5.gray[400],
-      dark: colors5.gray[700],
-      contrastText: colors5.base.white
+      main: gray[600],
+      light: gray[400],
+      dark: gray[700],
+      contrastText: tokens.colors.base.white
     },
     error: {
       main: colors5.error[600],
@@ -562,10 +674,10 @@ function buildPalette(tokens) {
       contrastText: colors5.base.white
     },
     info: {
-      main: colors5.blue[600],
-      light: colors5.blue[300],
-      dark: colors5.blue[700],
-      contrastText: colors5.base.white
+      main: tokens.colors.info[600],
+      light: tokens.colors.info[300],
+      dark: tokens.colors.info[700],
+      contrastText: tokens.colors.base.white
     },
     background: {
       default: bg5.primary,
@@ -1036,7 +1148,7 @@ function buildComponents(tokens) {
             color: fg5.brandPrimary
           },
           "&.Mui-checked:hover": {
-            color: colors5.brand[700]
+            color: violet[700]
           },
           "&.Mui-focusVisible": {
             outline: "none",
@@ -1066,7 +1178,7 @@ function buildComponents(tokens) {
             color: fg5.brandPrimary
           },
           "&.Mui-checked:hover": {
-            color: colors5.brand[700]
+            color: violet[700]
           },
           "&.Mui-focusVisible": {
             outline: "none",
@@ -1101,7 +1213,7 @@ function buildComponents(tokens) {
             }
           },
           "&.Mui-checked:hover + .MuiSwitch-track": {
-            backgroundColor: colors5.brand[700]
+            backgroundColor: violet[700]
           },
           "&.Mui-focusVisible .MuiSwitch-thumb": {
             boxShadow: focusRings5.brand
@@ -1372,23 +1484,23 @@ function buildComponents(tokens) {
         },
         colorDefault: {
           "&.MuiChip-filled": {
-            backgroundColor: colors5.gray[50],
-            color: colors5.gray[700],
-            "& .MuiChip-deleteIcon": { color: colors5.gray[400] }
+            backgroundColor: gray[50],
+            color: gray[700],
+            "& .MuiChip-deleteIcon": { color: gray[400] }
           }
         },
         colorPrimary: {
           "&.MuiChip-filled": {
-            backgroundColor: colors5.brand[50],
-            color: colors5.brand[700],
-            "& .MuiChip-deleteIcon": { color: colors5.brand[400] }
+            backgroundColor: violet[50],
+            color: violet[700],
+            "& .MuiChip-deleteIcon": { color: violet[400] }
           }
         },
         colorSecondary: {
           "&.MuiChip-filled": {
-            backgroundColor: colors5.gray[50],
-            color: colors5.gray[700],
-            "& .MuiChip-deleteIcon": { color: colors5.gray[400] }
+            backgroundColor: gray[50],
+            color: gray[700],
+            "& .MuiChip-deleteIcon": { color: gray[400] }
           }
         },
         colorError: {
@@ -1414,9 +1526,9 @@ function buildComponents(tokens) {
         },
         colorInfo: {
           "&.MuiChip-filled": {
-            backgroundColor: colors5.blue[50],
-            color: colors5.blue[700],
-            "& .MuiChip-deleteIcon": { color: colors5.blue[400] }
+            backgroundColor: info[50],
+            color: info[700],
+            "& .MuiChip-deleteIcon": { color: info[400] }
           }
         }
       }
@@ -1644,11 +1756,11 @@ function buildComponents(tokens) {
           }
         },
         standardInfo: {
-          backgroundColor: colors5.blue[50],
-          color: colors5.blue[700],
-          border: `1px solid ${colors5.blue[300]}`,
+          backgroundColor: info[50],
+          color: info[700],
+          border: `1px solid ${info[300]}`,
           "& .MuiAlert-icon": {
-            color: colors5.blue[600]
+            color: info[600]
           }
         },
         icon: {
@@ -1881,20 +1993,20 @@ function buildTheme(tokens) {
 // src/theme/presets/forest-external.ts
 var colors2 = {
   ...colors,
-  /** Brand scale — black-based for primary actions */
+  /** Brand scale — purple for client-facing products (#9D5FFF) */
   brand: {
-    25: "#fafafa",
-    50: "#f5f5f5",
-    100: "#ebebeb",
-    200: "#d6d6d6",
-    300: "#b0b0b0",
-    400: "#737373",
-    500: "#404040",
-    600: "#1a1a1a",
-    700: "#0d0d0d",
-    800: "#050505",
-    900: "#000000",
-    950: "#000000"
+    25: "#faf8ff",
+    50: "#f5f0ff",
+    100: "#ebe0ff",
+    200: "#d6c0ff",
+    300: "#b090ff",
+    400: "#9D5FFF",
+    500: "#7c4de6",
+    600: "#5b3acc",
+    700: "#3a1aad",
+    800: "#190a8a",
+    900: "#000066",
+    950: "#000033"
   },
   /** Warm-neutral gray scale */
   gray: {
@@ -2130,18 +2242,18 @@ var chartColors2 = {
   crosshairFg: colors2.gray[500],
   legendFg: text2.tertiary,
   series: [
-    { fg: colors2.violet[500], fgHover: colors2.violet[600], bg: colors2.violet[100], bgHover: colors2.violet[200] },
-    { fg: colors2.orangeDark[400], fgHover: colors2.orangeDark[500], bg: colors2.orangeDark[100], bgHover: colors2.orangeDark[200] },
-    { fg: colors2.teal[300], fgHover: colors2.teal[400], bg: colors2.teal[50], bgHover: colors2.teal[100] },
+    { fg: misc.purple[500], fgHover: misc.purple[600], bg: misc.purple[100], bgHover: misc.purple[200] },
+    { fg: misc.orangeDark[400], fgHover: misc.orangeDark[500], bg: misc.orangeDark[100], bgHover: misc.orangeDark[200] },
+    { fg: misc.teal[300], fgHover: misc.teal[400], bg: misc.teal[50], bgHover: misc.teal[100] },
     { fg: colors2.warning[400], fgHover: colors2.warning[500], bg: colors2.warning[100], bgHover: colors2.warning[200] },
-    { fg: colors2.rose[400], fgHover: colors2.rose[500], bg: colors2.rose[100], bgHover: colors2.rose[200] },
-    { fg: colors2.blueLight[400], fgHover: colors2.blueLight[500], bg: colors2.blueLight[100], bgHover: colors2.blueLight[200] },
-    { fg: colors2.orange[300], fgHover: colors2.orange[400], bg: colors2.orange[100], bgHover: colors2.orange[200] },
-    { fg: colors2.cyan[600], fgHover: colors2.cyan[700], bg: colors2.cyan[100], bgHover: colors2.cyan[200] },
-    { fg: colors2.green[500], fgHover: colors2.green[600], bg: colors2.green[100], bgHover: colors2.green[200] },
-    { fg: colors2.pink[400], fgHover: colors2.pink[500], bg: colors2.pink[100], bgHover: colors2.pink[200] },
-    { fg: colors2.fuchsia[400], fgHover: colors2.fuchsia[500], bg: colors2.fuchsia[100], bgHover: colors2.fuchsia[200] },
-    { fg: colors2.teal[600], fgHover: colors2.teal[700], bg: colors2.teal[100], bgHover: colors2.teal[200] }
+    { fg: misc.rose[400], fgHover: misc.rose[500], bg: misc.rose[100], bgHover: misc.rose[200] },
+    { fg: misc.blueLight[400], fgHover: misc.blueLight[500], bg: misc.blueLight[100], bgHover: misc.blueLight[200] },
+    { fg: misc.orange[300], fgHover: misc.orange[400], bg: misc.orange[100], bgHover: misc.orange[200] },
+    { fg: misc.cyan[600], fgHover: misc.cyan[700], bg: misc.cyan[100], bgHover: misc.cyan[200] },
+    { fg: misc.green[500], fgHover: misc.green[600], bg: misc.green[100], bgHover: misc.green[200] },
+    { fg: misc.pink[400], fgHover: misc.pink[500], bg: misc.pink[100], bgHover: misc.pink[200] },
+    { fg: misc.fuchsia[400], fgHover: misc.fuchsia[500], bg: misc.fuchsia[100], bgHover: misc.fuchsia[200] },
+    { fg: misc.teal[600], fgHover: misc.teal[700], bg: misc.teal[100], bgHover: misc.teal[200] }
   ]
 };
 var focusRings2 = {
@@ -2208,6 +2320,21 @@ var colors3 = {
     900: "#000000",
     950: "#000000"
   },
+  /** Accent color — red/orange sparingly used (#FF2821) */
+  accent: {
+    25: "#fff8f7",
+    50: "#fff0ee",
+    100: "#ffe0dd",
+    200: "#ffc0bb",
+    300: "#ff9090",
+    400: "#FF2821",
+    500: "#e61a1a",
+    600: "#cc1010",
+    700: "#a30808",
+    800: "#7a0000",
+    900: "#520000",
+    950: "#290000"
+  },
   /** Warm-neutral gray scale */
   gray: {
     25: "#fdfcfc",
@@ -2442,18 +2569,18 @@ var chartColors3 = {
   crosshairFg: colors3.gray[500],
   legendFg: text3.tertiary,
   series: [
-    { fg: colors3.violet[500], fgHover: colors3.violet[600], bg: colors3.violet[100], bgHover: colors3.violet[200] },
-    { fg: colors3.orangeDark[400], fgHover: colors3.orangeDark[500], bg: colors3.orangeDark[100], bgHover: colors3.orangeDark[200] },
-    { fg: colors3.teal[300], fgHover: colors3.teal[400], bg: colors3.teal[50], bgHover: colors3.teal[100] },
+    { fg: misc.purple[500], fgHover: misc.purple[600], bg: misc.purple[100], bgHover: misc.purple[200] },
+    { fg: misc.orangeDark[400], fgHover: misc.orangeDark[500], bg: misc.orangeDark[100], bgHover: misc.orangeDark[200] },
+    { fg: misc.teal[300], fgHover: misc.teal[400], bg: misc.teal[50], bgHover: misc.teal[100] },
     { fg: colors3.warning[400], fgHover: colors3.warning[500], bg: colors3.warning[100], bgHover: colors3.warning[200] },
-    { fg: colors3.rose[400], fgHover: colors3.rose[500], bg: colors3.rose[100], bgHover: colors3.rose[200] },
-    { fg: colors3.blueLight[400], fgHover: colors3.blueLight[500], bg: colors3.blueLight[100], bgHover: colors3.blueLight[200] },
-    { fg: colors3.orange[300], fgHover: colors3.orange[400], bg: colors3.orange[100], bgHover: colors3.orange[200] },
-    { fg: colors3.cyan[600], fgHover: colors3.cyan[700], bg: colors3.cyan[100], bgHover: colors3.cyan[200] },
-    { fg: colors3.green[500], fgHover: colors3.green[600], bg: colors3.green[100], bgHover: colors3.green[200] },
-    { fg: colors3.pink[400], fgHover: colors3.pink[500], bg: colors3.pink[100], bgHover: colors3.pink[200] },
-    { fg: colors3.fuchsia[400], fgHover: colors3.fuchsia[500], bg: colors3.fuchsia[100], bgHover: colors3.fuchsia[200] },
-    { fg: colors3.teal[600], fgHover: colors3.teal[700], bg: colors3.teal[100], bgHover: colors3.teal[200] }
+    { fg: misc.rose[400], fgHover: misc.rose[500], bg: misc.rose[100], bgHover: misc.rose[200] },
+    { fg: misc.blueLight[400], fgHover: misc.blueLight[500], bg: misc.blueLight[100], bgHover: misc.blueLight[200] },
+    { fg: misc.orange[300], fgHover: misc.orange[400], bg: misc.orange[100], bgHover: misc.orange[200] },
+    { fg: misc.cyan[600], fgHover: misc.cyan[700], bg: misc.cyan[100], bgHover: misc.cyan[200] },
+    { fg: misc.green[500], fgHover: misc.green[600], bg: misc.green[100], bgHover: misc.green[200] },
+    { fg: misc.pink[400], fgHover: misc.pink[500], bg: misc.pink[100], bgHover: misc.pink[200] },
+    { fg: misc.fuchsia[400], fgHover: misc.fuchsia[500], bg: misc.fuchsia[100], bgHover: misc.fuchsia[200] },
+    { fg: misc.teal[600], fgHover: misc.teal[700], bg: misc.teal[100], bgHover: misc.teal[200] }
   ]
 };
 var focusRings3 = {
@@ -2505,20 +2632,20 @@ var forestAgencyPreset = {
 // src/theme/presets/forest-internal.ts
 var colors4 = {
   ...colors,
-  /** Brand scale — black-based for primary actions */
+  /** Brand scale — pink/magenta for internal tools (#FF78F3) */
   brand: {
-    25: "#fafafa",
-    50: "#f5f5f5",
-    100: "#ebebeb",
-    200: "#d6d6d6",
-    300: "#b0b0b0",
-    400: "#737373",
-    500: "#404040",
-    600: "#1a1a1a",
-    700: "#0d0d0d",
-    800: "#050505",
-    900: "#000000",
-    950: "#000000"
+    25: "#fff8fd",
+    50: "#fff0fa",
+    100: "#ffe0f5",
+    200: "#ffc0eb",
+    300: "#ff90d8",
+    400: "#FF78F3",
+    500: "#e650d4",
+    600: "#cc28b5",
+    700: "#a3008c",
+    800: "#7a0066",
+    900: "#520044",
+    950: "#290022"
   },
   /** Warm-neutral gray scale */
   gray: {
@@ -2754,18 +2881,18 @@ var chartColors4 = {
   crosshairFg: colors4.gray[500],
   legendFg: text4.tertiary,
   series: [
-    { fg: colors4.violet[500], fgHover: colors4.violet[600], bg: colors4.violet[100], bgHover: colors4.violet[200] },
-    { fg: colors4.orangeDark[400], fgHover: colors4.orangeDark[500], bg: colors4.orangeDark[100], bgHover: colors4.orangeDark[200] },
-    { fg: colors4.teal[300], fgHover: colors4.teal[400], bg: colors4.teal[50], bgHover: colors4.teal[100] },
+    { fg: misc.purple[500], fgHover: misc.purple[600], bg: misc.purple[100], bgHover: misc.purple[200] },
+    { fg: misc.orangeDark[400], fgHover: misc.orangeDark[500], bg: misc.orangeDark[100], bgHover: misc.orangeDark[200] },
+    { fg: misc.teal[300], fgHover: misc.teal[400], bg: misc.teal[50], bgHover: misc.teal[100] },
     { fg: colors4.warning[400], fgHover: colors4.warning[500], bg: colors4.warning[100], bgHover: colors4.warning[200] },
-    { fg: colors4.rose[400], fgHover: colors4.rose[500], bg: colors4.rose[100], bgHover: colors4.rose[200] },
-    { fg: colors4.blueLight[400], fgHover: colors4.blueLight[500], bg: colors4.blueLight[100], bgHover: colors4.blueLight[200] },
-    { fg: colors4.orange[300], fgHover: colors4.orange[400], bg: colors4.orange[100], bgHover: colors4.orange[200] },
-    { fg: colors4.cyan[600], fgHover: colors4.cyan[700], bg: colors4.cyan[100], bgHover: colors4.cyan[200] },
-    { fg: colors4.green[500], fgHover: colors4.green[600], bg: colors4.green[100], bgHover: colors4.green[200] },
-    { fg: colors4.pink[400], fgHover: colors4.pink[500], bg: colors4.pink[100], bgHover: colors4.pink[200] },
-    { fg: colors4.fuchsia[400], fgHover: colors4.fuchsia[500], bg: colors4.fuchsia[100], bgHover: colors4.fuchsia[200] },
-    { fg: colors4.teal[600], fgHover: colors4.teal[700], bg: colors4.teal[100], bgHover: colors4.teal[200] }
+    { fg: misc.rose[400], fgHover: misc.rose[500], bg: misc.rose[100], bgHover: misc.rose[200] },
+    { fg: misc.blueLight[400], fgHover: misc.blueLight[500], bg: misc.blueLight[100], bgHover: misc.blueLight[200] },
+    { fg: misc.orange[300], fgHover: misc.orange[400], bg: misc.orange[100], bgHover: misc.orange[200] },
+    { fg: misc.cyan[600], fgHover: misc.cyan[700], bg: misc.cyan[100], bgHover: misc.cyan[200] },
+    { fg: misc.green[500], fgHover: misc.green[600], bg: misc.green[100], bgHover: misc.green[200] },
+    { fg: misc.pink[400], fgHover: misc.pink[500], bg: misc.pink[100], bgHover: misc.pink[200] },
+    { fg: misc.fuchsia[400], fgHover: misc.fuchsia[500], bg: misc.fuchsia[100], bgHover: misc.fuchsia[200] },
+    { fg: misc.teal[600], fgHover: misc.teal[700], bg: misc.teal[100], bgHover: misc.teal[200] }
   ]
 };
 var focusRings4 = {
@@ -2859,11 +2986,17 @@ exports.forestTheme = forestTheme;
 exports.forestThemeOptions = forestThemeOptions;
 exports.getAvailablePresets = getAvailablePresets;
 exports.getPreset = getPreset;
+exports.gray = gray;
 exports.iconColors = iconColors;
+exports.info = info;
 exports.lineHeight = lineHeight;
+exports.magenta = magenta;
+exports.misc = misc;
 exports.navColors = navColors;
 exports.palette = palette;
 exports.radius = radius;
+exports.radiusSharp = radiusSharp;
+exports.red = red;
 exports.registerPreset = registerPreset;
 exports.shadows = shadows2;
 exports.sliderColors = sliderColors;
@@ -2871,6 +3004,7 @@ exports.spacing = spacing;
 exports.text = text;
 exports.toggleColors = toggleColors;
 exports.typography = typography;
+exports.violet = violet;
 exports.widths = widths;
 //# sourceMappingURL=theme.js.map
 //# sourceMappingURL=theme.js.map