@sanity/ui 3.0.0-static.15 → 3.0.0-static.17

package/dist/theme.js

@@ -1,6 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: !0 });
-var color = require("@sanity/color");
+import { COLOR_HUES, COLOR_TINTS } from "@sanity/color";
 const AVATAR_SIZE = [0, 1, 2, 3], CONTAINER = [0, 1, 2, 3, 4, 5, "auto"], RADIUS = [0, 1, 2, 3, 4, 5, 6, "full"], SPACE = [0, 0.5, 1, 2, 3, 4, 5, 6, 7, 8, 9], FONT_CODE_SIZE = [0, 1, 2, 3, 4], FONT_HEADING_SIZE = [0, 1, 2, 3, 4, 5], FONT_LABEL_SIZE = [0, 1, 2, 3, 4, 5], FONT_TEXT_SIZE = [0, 1, 2, 3, 4], SHADOW = [0, 1, 2, 3, 4, 5];
 function createSelectableTones(opts, base, dark, solid, muted) {
   return {
@@ -508,13 +506,13 @@ const black = "hsl(0, 0%, 0%)", white = "hsl(0, 0%, 100%)", colors = {
     state,
     tone
   }) => {
-    const color2 = colors[tone];
+    const color = colors[tone];
     return state === "hovered" ? {
-      bg: dark ? color2.light : color2.dark,
-      bg2: dark ? color2.light : color2.dark,
-      border: dark ? color2.lighter : color2.darker,
-      fg: dark ? color2.darkest : color2.lightest,
-      icon: dark ? color2.darkest : color2.lightest,
+      bg: dark ? color.light : color.dark,
+      bg2: dark ? color.light : color.dark,
+      border: dark ? color.lighter : color.darker,
+      fg: dark ? color.darkest : color.lightest,
+      icon: dark ? color.darkest : color.lightest,
       muted: {
         fg: black
       },
@@ -530,11 +528,11 @@ const black = "hsl(0, 0%, 0%)", white = "hsl(0, 0%, 100%)", colors = {
       },
       skeleton: base.skeleton
     } : {
-      bg: color2.base,
-      bg2: color2.base,
-      border: dark ? color2.light : color2.dark,
-      fg: dark ? color2.darkest : color2.lightest,
-      icon: dark ? color2.darkest : color2.lightest,
+      bg: color.base,
+      bg2: color.base,
+      border: dark ? color.light : color.dark,
+      fg: dark ? color.darkest : color.lightest,
+      icon: dark ? color.darkest : color.lightest,
       muted: {
         fg: black
       },
@@ -557,13 +555,13 @@ const black = "hsl(0, 0%, 0%)", white = "hsl(0, 0%, 100%)", colors = {
     state,
     tone
   }) => {
-    const color2 = colors[tone];
+    const color = colors[tone];
     return state === "hovered" ? {
-      bg: dark ? color2.darker : color2.lighter,
-      bg2: dark ? color2.darker : color2.lighter,
-      border: dark ? color2.lighter : color2.darker,
-      fg: dark ? color2.lightest : color2.darkest,
-      icon: dark ? color2.lightest : color2.darkest,
+      bg: dark ? color.darker : color.lighter,
+      bg2: dark ? color.darker : color.lighter,
+      border: dark ? color.lighter : color.darker,
+      fg: dark ? color.lightest : color.darkest,
+      icon: dark ? color.lightest : color.darkest,
       muted: {
         fg: black
       },
@@ -579,11 +577,11 @@ const black = "hsl(0, 0%, 0%)", white = "hsl(0, 0%, 100%)", colors = {
       },
       skeleton: base.skeleton
     } : {
-      bg: dark ? color2.darkest : color2.lightest,
-      bg2: dark ? color2.darkest : color2.lightest,
-      border: dark ? color2.darker : color2.lighter,
-      fg: dark ? color2.lighter : color2.darker,
-      icon: dark ? color2.lighter : color2.darker,
+      bg: dark ? color.darkest : color.lightest,
+      bg2: dark ? color.darkest : color.lightest,
+      border: dark ? color.darker : color.lighter,
+      fg: dark ? color.lighter : color.darker,
+      icon: dark ? color.lighter : color.darker,
       muted: {
         fg: black
       },
@@ -1454,15 +1452,15 @@ const defaultThemeConfig = {
   "positive",
   "caution",
   "critical"
-], THEME_COLOR_STATES = ["enabled", "hovered", "pressed", "selected", "disabled"], THEME_COLOR_BUTTON_MODES = ["default", "ghost", "bleed"], THEME_COLOR_INPUT_MODES = ["default", "invalid"], THEME_COLOR_INPUT_STATES = ["enabled", "hovered", "readOnly", "disabled"], THEME_COLOR_AVATAR_COLORS = color.COLOR_HUES;
+], THEME_COLOR_STATES = ["enabled", "hovered", "pressed", "selected", "disabled"], THEME_COLOR_BUTTON_MODES = ["default", "ghost", "bleed"], THEME_COLOR_INPUT_MODES = ["default", "invalid"], THEME_COLOR_INPUT_STATES = ["enabled", "hovered", "readOnly", "disabled"], THEME_COLOR_AVATAR_COLORS = COLOR_HUES;
 function isColorBlendModeValue(str) {
   return THEME_COLOR_BLEND_MODES.includes(str);
 }
 function isColorHueKey(str) {
-  return color.COLOR_HUES.includes(str);
+  return COLOR_HUES.includes(str);
 }
 function isColorTintKey(str) {
-  return color.COLOR_TINTS.includes(str);
+  return COLOR_TINTS.includes(str);
 }
 function isColorButtonMode(str) {
   return THEME_COLOR_BUTTON_MODES.includes(str);
@@ -1470,12 +1468,12 @@ function isColorButtonMode(str) {
 const HUES = ["gray", "blue", "purple", "magenta", "red", "orange", "yellow", "green", "cyan"], TINTS = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], RE_PERCENTAGE = /^([0-9]+)%/, RE_OPACITY = /^(1|0\.[0-9]+)?/;
 function parseColor$1(str) {
   let cursor = 0;
-  const color2 = getColor();
-  if (!color2)
+  const color = getColor();
+  if (!color)
     throw new Error(`Invalid color: ${str}`);
   const opacity = getOpacity(), mix2 = getMixPercentage();
   return {
-    color: color2,
+    color,
     mix: mix2,
     opacity
   };
@@ -1545,10 +1543,14 @@ function parseColor$1(str) {
 }
 function renderColor(token, context) {
   const {
+    bgValue,
     bgVar,
     hue,
     scheme
-  } = context, result = parseColor$1(token[scheme === "dark" ? 0 : 1]), colorVar = result.color.type === "hue" ? `--${result.color.hue ?? hue}-${result.color.tint}` : `--${result.color.type}`;
+  } = context, t = token[scheme === "dark" ? 0 : 1];
+  if (t === "inherit")
+    return bgValue;
+  const result = parseColor$1(t), colorVar = result.color.type === "hue" ? `--${result.color.hue ?? hue}-${result.color.tint}` : `--${result.color.type}`;
   return result.mix !== void 0 ? `color-mix(in srgb, var(${bgVar}), var(${colorVar}) ${result.mix}%)` : result.opacity !== void 0 ? `color-mix(in srgb, transparent, var(${colorVar}) ${result.opacity * 100}%)` : `var(${colorVar})`;
 }
 function buildColor_v3(tokens) {
@@ -1575,21 +1577,27 @@ function buildColorCard_v3(tokens, options) {
   const {
     scheme
   } = options, context = {
-    bgVar: "--color-bg-1",
+    bgVar: "--color-bg",
+    bgValue: "transparent",
     hue: tokens._hue,
     scheme
-  };
+  }, tintedDefaultVariant = buildColorElement_v3(tokens.variant.tinted.default, {
+    bgValue: "transparent",
+    scheme
+  }), bgValue = tintedDefaultVariant.bg[0];
   return {
     _hue: tokens._hue ?? "gray",
     avatar: THEME_COLOR_AVATAR_COLORS.reduce((acc, hue) => {
       const avatarTokens = tokens.avatar[hue];
       return acc[hue] = {
         bg: renderColor(avatarTokens.bg, {
+          bgValue,
           bgVar: "--color-bg-1",
           hue: avatarTokens._hue,
           scheme
         }),
         fg: renderColor(avatarTokens.fg, {
+          bgValue,
           bgVar: "--color-bg-1",
           hue: avatarTokens._hue,
           scheme
@@ -1652,29 +1660,27 @@ function buildColorCard_v3(tokens, options) {
     },
     variant: {
       solid: {
-        ...THEME_COLOR_STATE_TONES.reduce((acc, tone) => ({
-          ...acc,
-          [tone]: buildColorElement_v3(tokens.variant.solid[tone], {
-            scheme
-          })
-        }), {})
+        ...THEME_COLOR_STATE_TONES.reduce((acc, tone) => (acc[tone] = buildColorElement_v3(tokens.variant.solid[tone], {
+          bgValue,
+          scheme
+        }), acc), {})
       },
       tinted: {
-        ...THEME_COLOR_STATE_TONES.reduce((acc, tone) => ({
-          ...acc,
-          [tone]: buildColorElement_v3(tokens.variant.tinted[tone], {
-            scheme
-          })
-        }), {})
+        ...THEME_COLOR_STATE_TONES.reduce((acc, tone) => (tone === "default" ? acc[tone] = tintedDefaultVariant : acc[tone] = buildColorElement_v3(tokens.variant.tinted[tone], {
+          bgValue,
+          scheme
+        }), acc), {})
       }
     }
   };
 }
 function buildColorElement_v3(tokens, options) {
   const {
+    bgValue,
     scheme
   } = options, context = {
-    bgVar: "--bg",
+    bgValue,
+    bgVar: "--color-bg",
     hue: tokens._hue,
     scheme
   };
@@ -1766,19 +1772,34 @@ const defaultTokens = {
             }
           },
           primary: {
-            _hue: "blue"
+            _hue: "blue",
+            bg: {
+              0: ["inherit", "inherit"]
+            }
           },
           suggest: {
-            _hue: "purple"
+            _hue: "purple",
+            bg: {
+              0: ["inherit", "inherit"]
+            }
           },
           positive: {
-            _hue: "green"
+            _hue: "green",
+            bg: {
+              0: ["inherit", "inherit"]
+            }
           },
           caution: {
-            _hue: "yellow"
+            _hue: "yellow",
+            bg: {
+              0: ["inherit", "inherit"]
+            }
           },
           critical: {
-            _hue: "red"
+            _hue: "red",
+            bg: {
+              0: ["inherit", "inherit"]
+            }
           }
         },
         solid: {
@@ -1793,7 +1814,7 @@ const defaultTokens = {
             },
             fg: {
               0: ["black", "white"],
-              4: ["600", "400"]
+              4: ["700", "200"]
             }
           },
           default: {
@@ -1854,7 +1875,7 @@ const defaultTokens = {
             },
             border: {
               0: ["800", "100"],
-              4: ["600", "300"]
+              4: ["600", "400"]
             },
             fg: {
               0: ["white", "black"],
@@ -2095,7 +2116,7 @@ function v2_v0(v2, v3) {
   const {
     avatar,
     button,
-    color: color2,
+    color,
     container,
     font: fonts,
     input,
@@ -2112,20 +2133,20 @@ function v2_v0(v2, v3) {
     container,
     color: {
       light: {
-        transparent: themeColor_v2_v0(color2.light.transparent),
-        default: themeColor_v2_v0(color2.light.default),
-        primary: themeColor_v2_v0(color2.light.primary),
-        positive: themeColor_v2_v0(color2.light.positive),
-        caution: themeColor_v2_v0(color2.light.caution),
-        critical: themeColor_v2_v0(color2.light.critical)
+        transparent: themeColor_v2_v0(color.light.transparent),
+        default: themeColor_v2_v0(color.light.default),
+        primary: themeColor_v2_v0(color.light.primary),
+        positive: themeColor_v2_v0(color.light.positive),
+        caution: themeColor_v2_v0(color.light.caution),
+        critical: themeColor_v2_v0(color.light.critical)
       },
       dark: {
-        transparent: themeColor_v2_v0(color2.dark.transparent),
-        default: themeColor_v2_v0(color2.dark.default),
-        primary: themeColor_v2_v0(color2.dark.primary),
-        positive: themeColor_v2_v0(color2.dark.positive),
-        caution: themeColor_v2_v0(color2.dark.caution),
-        critical: themeColor_v2_v0(color2.dark.critical)
+        transparent: themeColor_v2_v0(color.dark.transparent),
+        default: themeColor_v2_v0(color.dark.default),
+        primary: themeColor_v2_v0(color.dark.primary),
+        positive: themeColor_v2_v0(color.dark.positive),
+        caution: themeColor_v2_v0(color.dark.caution),
+        critical: themeColor_v2_v0(color.dark.critical)
       }
     },
     focusRing: input.text.focusRing,
@@ -2198,36 +2219,36 @@ function inputStateThemeColor_v2_v0(t) {
 }
 function themeColor_v3_v2(options) {
   const {
-    color: color2,
+    color,
     dark
   } = options;
   return {
     _blend: "screen",
     _dark: dark,
     ...buildColorState({
-      cardColor: color2,
+      cardColor: color,
       state: "enabled",
       tone: "default",
       variant: "tinted"
     }),
-    backdrop: color2.backdrop,
+    backdrop: color.backdrop,
     button: THEME_COLOR_BUTTON_MODES.reduce((modes, mode) => (modes[mode] = THEME_COLOR_STATE_TONES.reduce((tones2, tone) => (tones2[tone] = THEME_COLOR_STATES.reduce((states, state) => (states[state] = buildColorState({
-      cardColor: color2,
+      cardColor: color,
       state,
       tone,
       variant: mode === "default" ? "solid" : "tinted"
     }), mode === "bleed" && (states[state].border = "transparent"), states), {}), tones2), {}), modes), {}),
-    focusRing: color2.focusRing,
-    input: THEME_COLOR_INPUT_MODES.reduce((modes, mode) => (modes[mode] = THEME_COLOR_INPUT_STATES.reduce((states, state) => (states[state] = buildInputState(color2.variant.tinted.default), states), {}), modes), {}),
+    focusRing: color.focusRing,
+    input: THEME_COLOR_INPUT_MODES.reduce((modes, mode) => (modes[mode] = THEME_COLOR_INPUT_STATES.reduce((states, state) => (states[state] = buildInputState(color.variant.tinted.default), states), {}), modes), {}),
     selectable: THEME_COLOR_STATE_TONES.reduce((tones2, tone) => (tones2[tone] = THEME_COLOR_STATES.reduce((states, state) => (states[state] = buildColorState({
-      cardColor: color2,
+      cardColor: color,
       // cardVars: vars,
       state,
       tone,
       variant: "tinted"
     }), states), {}), tones2), {}),
-    shadow: color2.shadow,
-    syntax: color2.code.token
+    shadow: color.shadow,
+    syntax: color.code.token
   };
 }
 const stateShades = {
@@ -2266,37 +2287,37 @@ function buildColorState(options) {
     state,
     tone,
     variant
-  } = options, color2 = cardColor.variant[variant][tone], shades = stateShades[state];
+  } = options, color = cardColor.variant[variant][tone], shades = stateShades[state];
   return {
     accent: {
-      fg: color2.fg[4]
+      fg: color.fg[4]
     },
     avatar: cardColor.avatar,
     badge: THEME_COLOR_STATE_TONES.reduce((tones2, tone2) => (tones2[tone2] = {
-      bg: mix$1(color2.bg, 1),
-      fg: mix$1(color2.fg, 1),
-      dot: mix$1(color2.fg, 3),
-      icon: mix$1(color2.fg, 3)
+      bg: mix$1(color.bg, 1),
+      fg: mix$1(color.fg, 1),
+      dot: mix$1(color.fg, 3),
+      icon: mix$1(color.fg, 3)
     }, tones2), {}),
-    bg: mix$1(color2.bg, shades.bg[0]),
-    border: mix$1(color2.border, shades.border[0]),
-    fg: mix$1(color2.fg, shades.fg[0]),
+    bg: mix$1(color.bg, shades.bg[0]),
+    border: mix$1(color.border, shades.border[0]),
+    fg: mix$1(color.fg, shades.fg[0]),
     code: {
-      bg: mix$1(color2.bg, shades.bg[1]),
-      fg: mix$1(color2.fg, shades.fg[2])
+      bg: mix$1(color.bg, shades.bg[1]),
+      fg: mix$1(color.fg, shades.fg[2])
     },
-    icon: mix$1(color2.fg, shades.fg[2]),
+    icon: mix$1(color.fg, shades.fg[2]),
     kbd: {
-      bg: mix$1(color2.bg, 0),
-      fg: mix$1(color2.fg, 0),
-      border: mix$1(color2.bg, 0)
+      bg: mix$1(color.bg, 0),
+      fg: mix$1(color.fg, 0),
+      border: mix$1(color.bg, 0)
     },
     link: {
-      fg: mix$1(color2.fg, shades.fg[2])
+      fg: mix$1(color.fg, shades.fg[2])
     },
     muted: {
-      bg: mix$1(color2.bg, shades.bg[1]),
-      fg: mix$1(color2.fg, shades.fg[2])
+      bg: mix$1(color.bg, shades.bg[1]),
+      fg: mix$1(color.fg, shades.fg[2])
     },
     skeleton: cardColor.skeleton
   };
@@ -2481,9 +2502,9 @@ function rgbaToRGBA(rgba2) {
     a: parseFloat(values[3])
   };
 }
-function rgbToHex(color2) {
-  const r = round(clamp(Math.round(color2.r), 0, 255)), g = round(clamp(Math.round(color2.g), 0, 255)), b = round(clamp(Math.round(color2.b), 0, 255));
-  return "a" in color2 ? `rgba(${r},${g},${b},${color2.a})` : "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
+function rgbToHex(color) {
+  const r = round(clamp(Math.round(color.r), 0, 255)), g = round(clamp(Math.round(color.g), 0, 255)), b = round(clamp(Math.round(color.b), 0, 255));
+  return "a" in color ? `rgba(${r},${g},${b},${color.a})` : "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
 }
 function rgbToHsl({
   r,
@@ -2528,21 +2549,21 @@ function parseHsl(str) {
     l: parseFloat(res[5])
   };
 }
-function parseColor(color2) {
-  if (!color2) return {
+function parseColor(color) {
+  if (!color) return {
     r: 0,
     g: 0,
     b: 0
   };
-  if (typeof color2 != "string")
+  if (typeof color != "string")
     throw new Error("parseColor: expected a string");
-  if (isHex(color2))
-    return hexToRgb(color2);
-  if (color2.startsWith("hsl("))
-    return hslToRgb(parseHsl(color2));
-  if (color2.startsWith("rgba("))
-    return rgbaToRGBA(color2);
-  throw new Error(`parseColor: unexpected color format: "${color2}"`);
+  if (isHex(color))
+    return hexToRgb(color);
+  if (color.startsWith("hsl("))
+    return hslToRgb(parseHsl(color));
+  if (color.startsWith("rgba("))
+    return rgbaToRGBA(color);
+  throw new Error(`parseColor: unexpected color format: "${color}"`);
 }
 function getContrastRatio(bg, fg) {
   const rgb1 = parseColor(bg), rgb2 = parseColor(fg), c1 = rgb_lrgb(rgb1), c2 = rgb_lrgb(rgb2), l1 = lrgb_luminance(c1), l2 = lrgb_luminance(c2);
@@ -2561,10 +2582,10 @@ function rgb_lrgb1(v) {
 function lrgb_luminance([r, g, b]) {
   return 0.2126 * r + 0.7152 * g + 0.0722 * b;
 }
-function rgba(color2, a) {
-  if (typeof color2 == "string" && color2.startsWith("var("))
-    return `color-mix(in srgb, transparent, ${color2} ${a * 100}%)`;
-  const rgb = parseColor(color2);
+function rgba(color, a) {
+  if (typeof color == "string" && color.startsWith("var("))
+    return `color-mix(in srgb, transparent, ${color} ${a * 100}%)`;
+  const rgb = parseColor(color);
   return `rgba(${rgb.r},${rgb.g},${rgb.b},${a})`;
 }
 const COLOR_CONFIG_STATE_KEYS = ["_hue", "bg", "fg", "border", "focusRing", "muted/fg", "accent/fg", "link/fg", "code/bg", "code/fg", "skeleton/from", "skeleton/to", "status/dot", "status/icon"], COLOR_CONFIG_CARD_KEYS = [...COLOR_CONFIG_STATE_KEYS, "_hue", "bg", "fg", "border", "focusRing", "shadow/outline", "shadow/umbra", "shadow/penumbra", "shadow/ambient"], COLOR_CONFIG_BLEND_KEYS = ["_blend"], COLOR_CONFIG_AVATAR_COLORS = ["*", ...THEME_COLOR_AVATAR_COLORS], COLOR_CONFIG_CARD_TONES = ["*", ...THEME_COLOR_CARD_TONES], COLOR_CONFIG_STATE_TONES = ["*", ...THEME_COLOR_STATE_TONES], COLOR_CONFIG_STATES = ["*", ...THEME_COLOR_STATES], COLOR_CONFIG_INPUT_MODES = ["*", ...THEME_COLOR_INPUT_MODES], COLOR_CONFIG_INPUT_STATES = ["*", ...THEME_COLOR_INPUT_STATES];
@@ -2730,10 +2751,10 @@ function isColorOpacityValue(str) {
 function is_v2(themeProp) {
   return themeProp._version === 2;
 }
-function themeColor_v0_v2_9(color2) {
-  if ("neutral" in color2.badge)
-    return color2;
-  const colors2 = color2;
+function themeColor_v0_v2_9(color) {
+  if ("neutral" in color.badge)
+    return color;
+  const colors2 = color;
   return {
     ...colors2,
     badge: {
@@ -2987,7 +3008,7 @@ function v0_v2(v0) {
   const {
     avatar,
     button,
-    color: color2,
+    color,
     container,
     fonts: font,
     input,
@@ -3010,24 +3031,24 @@ function v0_v2(v0) {
     card: defaultThemeConfig.card,
     color: {
       light: {
-        transparent: themeColor_v0_v2(color2.light.transparent),
-        default: themeColor_v0_v2(color2.light.default),
-        neutral: themeColor_v0_v2(color2.light.transparent),
-        primary: themeColor_v0_v2(color2.light.primary),
-        suggest: themeColor_v0_v2(color2.light.primary),
-        positive: themeColor_v0_v2(color2.light.positive),
-        caution: themeColor_v0_v2(color2.light.caution),
-        critical: themeColor_v0_v2(color2.light.critical)
+        transparent: themeColor_v0_v2(color.light.transparent),
+        default: themeColor_v0_v2(color.light.default),
+        neutral: themeColor_v0_v2(color.light.transparent),
+        primary: themeColor_v0_v2(color.light.primary),
+        suggest: themeColor_v0_v2(color.light.primary),
+        positive: themeColor_v0_v2(color.light.positive),
+        caution: themeColor_v0_v2(color.light.caution),
+        critical: themeColor_v0_v2(color.light.critical)
       },
       dark: {
-        transparent: themeColor_v0_v2(color2.dark.transparent),
-        default: themeColor_v0_v2(color2.dark.default),
-        neutral: themeColor_v0_v2(color2.dark.transparent),
-        primary: themeColor_v0_v2(color2.dark.primary),
-        suggest: themeColor_v0_v2(color2.dark.primary),
-        positive: themeColor_v0_v2(color2.dark.positive),
-        caution: themeColor_v0_v2(color2.dark.caution),
-        critical: themeColor_v0_v2(color2.dark.critical)
+        transparent: themeColor_v0_v2(color.dark.transparent),
+        default: themeColor_v0_v2(color.dark.default),
+        neutral: themeColor_v0_v2(color.dark.transparent),
+        primary: themeColor_v0_v2(color.dark.primary),
+        suggest: themeColor_v0_v2(color.dark.primary),
+        positive: themeColor_v0_v2(color.dark.positive),
+        caution: themeColor_v0_v2(color.dark.caution),
+        critical: themeColor_v0_v2(color.dark.critical)
       }
     },
     container,
@@ -3133,67 +3154,69 @@ function getTheme_v2(theme) {
   };
   return cache.set(theme, v2), v2;
 }
-exports.AVATAR_SIZE = AVATAR_SIZE;
-exports.COLOR_CONFIG_AVATAR_COLORS = COLOR_CONFIG_AVATAR_COLORS;
-exports.COLOR_CONFIG_BLEND_KEYS = COLOR_CONFIG_BLEND_KEYS;
-exports.COLOR_CONFIG_CARD_KEYS = COLOR_CONFIG_CARD_KEYS;
-exports.COLOR_CONFIG_CARD_TONES = COLOR_CONFIG_CARD_TONES;
-exports.COLOR_CONFIG_INPUT_MODES = COLOR_CONFIG_INPUT_MODES;
-exports.COLOR_CONFIG_INPUT_STATES = COLOR_CONFIG_INPUT_STATES;
-exports.COLOR_CONFIG_STATES = COLOR_CONFIG_STATES;
-exports.COLOR_CONFIG_STATE_KEYS = COLOR_CONFIG_STATE_KEYS;
-exports.COLOR_CONFIG_STATE_TONES = COLOR_CONFIG_STATE_TONES;
-exports.CONTAINER = CONTAINER;
-exports.FONT_CODE_SIZE = FONT_CODE_SIZE;
-exports.FONT_HEADING_SIZE = FONT_HEADING_SIZE;
-exports.FONT_LABEL_SIZE = FONT_LABEL_SIZE;
-exports.FONT_TEXT_SIZE = FONT_TEXT_SIZE;
-exports.HUES = HUES;
-exports.RADIUS = RADIUS;
-exports.SHADOW = SHADOW;
-exports.SPACE = SPACE;
-exports.THEME_COLOR_AVATAR_COLORS = THEME_COLOR_AVATAR_COLORS;
-exports.THEME_COLOR_BLEND_MODES = THEME_COLOR_BLEND_MODES;
-exports.THEME_COLOR_BUTTON_MODES = THEME_COLOR_BUTTON_MODES;
-exports.THEME_COLOR_CARD_TONES = THEME_COLOR_CARD_TONES;
-exports.THEME_COLOR_INPUT_MODES = THEME_COLOR_INPUT_MODES;
-exports.THEME_COLOR_INPUT_STATES = THEME_COLOR_INPUT_STATES;
-exports.THEME_COLOR_SCHEMES = THEME_COLOR_SCHEMES;
-exports.THEME_COLOR_STATES = THEME_COLOR_STATES;
-exports.THEME_COLOR_STATE_TONES = THEME_COLOR_STATE_TONES;
-exports.TINTS = TINTS;
-exports.buildColor_v3 = buildColor_v3;
-exports.buildTheme = buildTheme;
-exports.buildTheme_v3 = buildTheme_v3;
-exports.createColorTheme = createColorTheme;
-exports.defaultTokens = defaultTokens;
-exports.getContrastRatio = getContrastRatio;
-exports.getScopedTheme = getScopedTheme;
-exports.getTheme_v2 = getTheme_v2;
-exports.hexToRgb = hexToRgb;
-exports.hslToRgb = hslToRgb;
-exports.isColorBlendModeValue = isColorBlendModeValue;
-exports.isColorButtonMode = isColorButtonMode;
-exports.isColorConfigBaseKey = isColorConfigBaseKey;
-exports.isColorConfigBaseTone = isColorConfigBaseTone;
-exports.isColorConfigBlendKey = isColorConfigBlendKey;
-exports.isColorConfigStateKey = isColorConfigStateKey;
-exports.isColorConfigStateTone = isColorConfigStateTone;
-exports.isColorHueKey = isColorHueKey;
-exports.isColorOpacityValue = isColorOpacityValue;
-exports.isColorTintKey = isColorTintKey;
-exports.isColorTokenValue = isColorTokenValue;
-exports.isColorValue = isColorValue;
-exports.mix = mix;
-exports.multiply = multiply;
-exports.parseColor = parseColor;
-exports.parseTokenKey = parseTokenKey;
-exports.parseTokenValue = parseTokenValue;
-exports.renderColor = renderColor;
-exports.resolveTokens = resolveTokens;
-exports.rgbToHex = rgbToHex;
-exports.rgbToHsl = rgbToHsl;
-exports.rgba = rgba;
-exports.rgbaToRGBA = rgbaToRGBA;
-exports.screen = screen;
+export {
+  AVATAR_SIZE,
+  COLOR_CONFIG_AVATAR_COLORS,
+  COLOR_CONFIG_BLEND_KEYS,
+  COLOR_CONFIG_CARD_KEYS,
+  COLOR_CONFIG_CARD_TONES,
+  COLOR_CONFIG_INPUT_MODES,
+  COLOR_CONFIG_INPUT_STATES,
+  COLOR_CONFIG_STATES,
+  COLOR_CONFIG_STATE_KEYS,
+  COLOR_CONFIG_STATE_TONES,
+  CONTAINER,
+  FONT_CODE_SIZE,
+  FONT_HEADING_SIZE,
+  FONT_LABEL_SIZE,
+  FONT_TEXT_SIZE,
+  HUES,
+  RADIUS,
+  SHADOW,
+  SPACE,
+  THEME_COLOR_AVATAR_COLORS,
+  THEME_COLOR_BLEND_MODES,
+  THEME_COLOR_BUTTON_MODES,
+  THEME_COLOR_CARD_TONES,
+  THEME_COLOR_INPUT_MODES,
+  THEME_COLOR_INPUT_STATES,
+  THEME_COLOR_SCHEMES,
+  THEME_COLOR_STATES,
+  THEME_COLOR_STATE_TONES,
+  TINTS,
+  buildColor_v3,
+  buildTheme,
+  buildTheme_v3,
+  createColorTheme,
+  defaultTokens,
+  getContrastRatio,
+  getScopedTheme,
+  getTheme_v2,
+  hexToRgb,
+  hslToRgb,
+  isColorBlendModeValue,
+  isColorButtonMode,
+  isColorConfigBaseKey,
+  isColorConfigBaseTone,
+  isColorConfigBlendKey,
+  isColorConfigStateKey,
+  isColorConfigStateTone,
+  isColorHueKey,
+  isColorOpacityValue,
+  isColorTintKey,
+  isColorTokenValue,
+  isColorValue,
+  mix,
+  multiply,
+  parseColor,
+  parseTokenKey,
+  parseTokenValue,
+  renderColor,
+  resolveTokens,
+  rgbToHex,
+  rgbToHsl,
+  rgba,
+  rgbaToRGBA,
+  screen
+};
 //# sourceMappingURL=theme.js.map