@sanity/ui 3.3.2 → 3.3.3

package/src/theme/build/buildColorTheme.ts

@@ -1,507 +0,0 @@
-import {ThemeColorBadgeTokens, ThemeColorStateTokens, ThemeConfig} from '../config'
-import {
-  THEME_COLOR_BUTTON_MODES,
-  THEME_COLOR_CARD_TONES,
-  THEME_COLOR_STATE_TONES,
-  THEME_COLOR_STATES,
-  ThemeColorAvatar_v2,
-  ThemeColorAvatarColorKey,
-  ThemeColorAvatarHue_v2,
-  ThemeColorBadge_v2,
-  ThemeColorButton_v2,
-  ThemeColorButtonMode_v2,
-  ThemeColorButtonModeKey,
-  ThemeColorButtonTone_v2,
-  ThemeColorCard_v2,
-  ThemeColorCardToneKey,
-  ThemeColorInput_v2,
-  ThemeColorInputMode_v2,
-  ThemeColorInputState_v2,
-  ThemeColorScheme_v2,
-  ThemeColorSchemeKey,
-  ThemeColorSchemes_v2,
-  ThemeColorShadow,
-  ThemeColorState_v2,
-  ThemeColorStateKey,
-  ThemeColorStateToneKey,
-  ThemeColorSyntax,
-} from '../system'
-import {ColorTokenContext, resolveColorTokenValue as _color} from './colorToken'
-import {defineLazyProperty} from './lib/lazy'
-import {resolveColorTokens} from './resolveColorTokens'
-
-export function buildColorTheme(config?: ThemeConfig): ThemeColorSchemes_v2 {
-  const resolvedConfig: ThemeConfig = {
-    ...config,
-    color: resolveColorTokens(config?.color),
-  }
-
-  // Lazy schemes — each scheme's token tree is only built when first accessed
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  const schemes = {} as ThemeColorSchemes_v2
-
-  defineLazyProperty(schemes, 'light', () => buildColorScheme({scheme: 'light'}, resolvedConfig))
-  defineLazyProperty(schemes, 'dark', () => buildColorScheme({scheme: 'dark'}, resolvedConfig))
-
-  return schemes
-}
-
-function buildColorScheme(
-  options: {scheme: ThemeColorSchemeKey},
-  config: ThemeConfig,
-): ThemeColorScheme_v2 {
-  const {scheme} = options
-
-  // Lazy tones — each tone's token tree is only built when first accessed
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  const colorScheme = {} as ThemeColorScheme_v2
-
-  for (const tone of THEME_COLOR_CARD_TONES) {
-    defineLazyProperty(colorScheme, tone, () => buildCardColorTheme({scheme, tone}, config))
-  }
-
-  return colorScheme
-}
-
-function buildCardColorTheme(
-  options: {scheme: ThemeColorSchemeKey; tone: ThemeColorCardToneKey},
-  config?: ThemeConfig,
-): ThemeColorCard_v2 {
-  const {scheme, tone} = options
-  const tokens = config?.color?.base?.[tone]
-  const hue = tokens?._hue || 'gray'
-  const context: ColorTokenContext = {hue, scheme}
-  const blendMode = tokens?._blend || ['multiply', 'screen']
-
-  return {
-    _blend: blendMode[scheme === 'light' ? 0 : 1],
-    _dark: scheme === 'dark',
-    accent: {
-      fg: _color(context, tokens?.accent?.fg),
-    },
-    avatar: buildAvatarColorTheme({scheme}, tokens),
-    backdrop: _color(context, tokens?.backdrop),
-    badge: buildBadgeColorTheme(tokens?.badge, {scheme}, config),
-    bg: _color(context, tokens?.bg),
-    border: _color(context, tokens?.border),
-    button: buildButtonColorTheme({scheme, tone}, config),
-    code: {
-      bg: _color(context, tokens?.code?.bg),
-      fg: _color(context, tokens?.code?.fg),
-    },
-    fg: _color(context, tokens?.fg),
-    focusRing: _color(context, tokens?.focusRing),
-    icon: _color(context, tokens?.icon),
-    input: buildInputColorTheme({scheme, tone}, config),
-    kbd: {
-      bg: _color(context, tokens?.kbd?.bg),
-      fg: _color(context, tokens?.kbd?.fg),
-      border: _color(context, tokens?.kbd?.border),
-    },
-    link: {
-      fg: _color(context, tokens?.link?.fg),
-    },
-    muted: {
-      bg: _color(context, tokens?.muted?.bg),
-      fg: _color(context, tokens?.muted?.fg),
-    },
-    selectable: buildSelectableColorTheme({scheme, tone}, config),
-    shadow: buildShadowColorTheme({scheme, tone}, config),
-    skeleton: {
-      from: _color(context, tokens?.skeleton?.from),
-      to: _color(context, tokens?.skeleton?.to),
-    },
-    syntax: buildSyntaxColorTheme({scheme}, config),
-  }
-}
-
-function buildShadowColorTheme(
-  options: {scheme: ThemeColorSchemeKey; tone: ThemeColorCardToneKey},
-  config?: ThemeConfig,
-): ThemeColorShadow {
-  const {scheme, tone} = options
-  const tokens = config?.color?.base?.[tone]
-  const hue = tokens?._hue || 'gray'
-  const context: ColorTokenContext = {hue, scheme}
-
-  return {
-    outline: _color(context, tokens?.shadow?.outline),
-    umbra: _color(context, tokens?.shadow?.umbra),
-    penumbra: _color(context, tokens?.shadow?.penumbra),
-    ambient: _color(context, tokens?.shadow?.ambient),
-  }
-}
-
-function buildAvatarColorTheme(
-  options: {scheme: ThemeColorSchemeKey},
-  stateTokens?: ThemeColorStateTokens,
-): ThemeColorAvatar_v2 {
-  const {scheme} = options
-
-  return {
-    gray: _buildAvatarColorTheme({color: 'gray', scheme}, stateTokens),
-    blue: _buildAvatarColorTheme({color: 'blue', scheme}, stateTokens),
-    purple: _buildAvatarColorTheme({color: 'purple', scheme}, stateTokens),
-    magenta: _buildAvatarColorTheme({color: 'magenta', scheme}, stateTokens),
-    red: _buildAvatarColorTheme({color: 'red', scheme}, stateTokens),
-    orange: _buildAvatarColorTheme({color: 'orange', scheme}, stateTokens),
-    yellow: _buildAvatarColorTheme({color: 'yellow', scheme}, stateTokens),
-    green: _buildAvatarColorTheme({color: 'green', scheme}, stateTokens),
-    cyan: _buildAvatarColorTheme({color: 'cyan', scheme}, stateTokens),
-  }
-}
-
-function _buildAvatarColorTheme(
-  options: {color: ThemeColorAvatarColorKey; scheme: ThemeColorSchemeKey},
-  stateTokens?: ThemeColorStateTokens,
-): ThemeColorAvatarHue_v2 {
-  const {color, scheme} = options
-  const tokens = stateTokens?.avatar?.[color]
-  const context: ColorTokenContext = {hue: tokens?._hue || 'gray', scheme}
-  const blendMode = tokens?._blend || ['screen', 'multiply']
-
-  return {
-    _blend: blendMode[scheme === 'light' ? 0 : 1],
-    bg: _color(context, tokens?.bg),
-    fg: _color(context, tokens?.fg),
-  }
-}
-
-function buildBadgeColorTheme(
-  tokens: ThemeColorBadgeTokens | undefined,
-  options: {scheme: ThemeColorSchemeKey},
-  config?: ThemeConfig,
-): ThemeColorBadge_v2 {
-  const {scheme} = options
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  const colorBadge = {} as ThemeColorBadge_v2
-
-  for (const tone of THEME_COLOR_STATE_TONES) {
-    colorBadge[tone] = _buildBadgeColorTheme(tokens, {scheme, tone}, config)
-  }
-
-  return colorBadge
-}
-
-function _buildBadgeColorTheme(
-  parentTokens: ThemeColorBadgeTokens | undefined,
-  options: {scheme: ThemeColorSchemeKey; tone: ThemeColorStateToneKey},
-  config?: ThemeConfig,
-): ThemeColorBadge_v2['default'] {
-  const {scheme, tone} = options
-  const tokens = parentTokens?.[tone]
-  const hue = tokens?._hue || config?.color?.base?.[tone]?._hue || 'gray'
-  const context: ColorTokenContext = {hue, scheme}
-
-  return {
-    bg: _color(context, tokens?.bg),
-    fg: _color(context, tokens?.fg),
-    dot: _color(context, tokens?.dot),
-    icon: _color(context, tokens?.icon),
-  }
-}
-
-function buildButtonColorTheme(
-  options: {scheme: ThemeColorSchemeKey; tone: ThemeColorCardToneKey},
-  config?: ThemeConfig,
-): ThemeColorButton_v2 {
-  const {scheme, tone: cardTone} = options
-
-  const modes: Partial<ThemeColorButton_v2> = {}
-
-  for (const mode of THEME_COLOR_BUTTON_MODES) {
-    modes[mode] = buildButtonTonesColorTheme({cardTone, scheme, mode}, config)
-  }
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  return modes as ThemeColorButton_v2
-}
-
-function buildButtonTonesColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    scheme: ThemeColorSchemeKey
-    mode: ThemeColorButtonModeKey
-  },
-  config?: ThemeConfig,
-): ThemeColorButtonMode_v2 {
-  const {cardTone, mode, scheme} = options
-
-  const tones: Partial<ThemeColorButtonMode_v2> = {}
-
-  for (const tone of THEME_COLOR_STATE_TONES) {
-    tones[tone] = buildButtonStatesColorTheme({cardTone, mode, scheme, tone}, config)
-  }
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  return tones as ThemeColorButtonMode_v2
-}
-
-function buildButtonStatesColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    mode: ThemeColorButtonModeKey
-    scheme: ThemeColorSchemeKey
-    tone: ThemeColorStateToneKey
-  },
-  config?: ThemeConfig,
-): ThemeColorButtonTone_v2 {
-  const {cardTone, mode, scheme, tone} = options
-
-  const states: Partial<ThemeColorButtonTone_v2> = {}
-
-  for (const state of THEME_COLOR_STATES) {
-    states[state] = buildButtonStateColorTheme({cardTone, mode, tone, scheme, state}, config)
-  }
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  return states as ThemeColorButtonTone_v2
-}
-
-function buildButtonStateColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    mode: ThemeColorButtonModeKey
-    tone: ThemeColorStateToneKey
-    scheme: ThemeColorSchemeKey
-    state: ThemeColorStateKey
-  },
-  config?: ThemeConfig,
-): ThemeColorState_v2 {
-  const {cardTone, mode, tone, scheme, state} = options
-  const cardTokens = config?.color?.base?.[cardTone]
-  const tokens = config?.color?.button?.[mode]?.[tone]?.[state]
-  const hue = tokens?._hue || cardTokens?._hue || 'gray'
-  const blendMode = tokens?._blend || ['screen', 'multiply']
-  const context: ColorTokenContext = {hue, scheme}
-
-  return {
-    _blend: blendMode[scheme === 'light' ? 0 : 1],
-    accent: {
-      fg: _color(context, tokens?.accent?.fg),
-    },
-    avatar: buildAvatarColorTheme({scheme}, tokens),
-    badge: buildBadgeColorTheme(tokens?.badge, {scheme}, config),
-    bg: _color(context, tokens?.bg),
-    border: _color(context, tokens?.border),
-    code: {
-      bg: _color(context, tokens?.code?.bg),
-      fg: _color(context, tokens?.code?.fg),
-    },
-    fg: _color(context, tokens?.fg),
-    icon: _color(context, tokens?.icon),
-    muted: {
-      bg: _color(context, tokens?.muted?.bg),
-      fg: _color(context, tokens?.muted?.fg),
-    },
-    kbd: {
-      bg: _color(context, tokens?.kbd?.bg),
-      fg: _color(context, tokens?.kbd?.fg),
-      border: _color(context, tokens?.kbd?.border),
-    },
-    link: {
-      fg: _color(context, tokens?.link?.fg),
-    },
-    skeleton: {
-      from: _color(context, tokens?.skeleton?.from),
-      to: _color(context, tokens?.skeleton?.to),
-    },
-  }
-}
-
-function buildInputColorTheme(
-  options: {scheme: ThemeColorSchemeKey; tone: ThemeColorCardToneKey},
-  config?: ThemeConfig,
-): ThemeColorInput_v2 {
-  const {scheme, tone} = options
-
-  return {
-    default: buildInputStatesColorTheme({mode: 'default', scheme, tone}, config),
-    invalid: buildInputStatesColorTheme({mode: 'invalid', scheme, tone}, config),
-  }
-}
-
-function buildInputStatesColorTheme(
-  options: {
-    mode: 'default' | 'invalid'
-    scheme: ThemeColorSchemeKey
-    tone: ThemeColorCardToneKey
-  },
-  config?: ThemeConfig,
-): ThemeColorInputMode_v2 {
-  const {mode, scheme, tone} = options
-
-  return {
-    enabled: buildInputStateColorTheme({mode, scheme, state: 'enabled', cardTone: tone}, config),
-    hovered: buildInputStateColorTheme({mode, scheme, state: 'hovered', cardTone: tone}, config),
-    readOnly: buildInputStateColorTheme({mode, scheme, state: 'readOnly', cardTone: tone}, config),
-    disabled: buildInputStateColorTheme({mode, scheme, state: 'disabled', cardTone: tone}, config),
-  }
-}
-
-function buildInputStateColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    mode: 'default' | 'invalid'
-    scheme: ThemeColorSchemeKey
-    state: 'enabled' | 'hovered' | 'readOnly' | 'disabled'
-  },
-  config?: ThemeConfig,
-): ThemeColorInputState_v2 {
-  const {cardTone, mode, scheme, state} = options
-  const cardTokens = config?.color?.base?.[cardTone]
-  const tokens = config?.color?.input?.[mode]?.[state]
-  const hue = tokens?._hue || cardTokens?._hue || 'gray'
-  const blendMode = tokens?._blend || ['screen', 'multiply']
-  const context: ColorTokenContext = {hue, scheme}
-
-  return {
-    _blend: blendMode[scheme === 'light' ? 0 : 1],
-    bg: _color(context, tokens?.bg),
-    border: _color(context, tokens?.border),
-    fg: _color(context, tokens?.fg),
-    muted: {
-      bg: _color(context, tokens?.muted?.bg),
-    },
-    placeholder: _color(context, tokens?.placeholder),
-  }
-}
-
-function buildSelectableColorTheme(
-  options: {
-    scheme: ThemeColorSchemeKey
-    tone: ThemeColorCardToneKey
-  },
-  config?: ThemeConfig,
-): ThemeColorButtonMode_v2 {
-  const {scheme, tone: cardTone} = options
-
-  const tones: Partial<ThemeColorButtonMode_v2> = {}
-
-  for (const tone of THEME_COLOR_STATE_TONES) {
-    tones[tone] = buildSelectableStatesColorTheme({cardTone, scheme, tone}, config)
-  }
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  return tones as ThemeColorButtonMode_v2
-}
-
-function buildSelectableStatesColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    scheme: ThemeColorSchemeKey
-    tone: ThemeColorStateToneKey
-  },
-  config?: ThemeConfig,
-): ThemeColorButtonTone_v2 {
-  const {cardTone, scheme, tone} = options
-
-  const states: Partial<ThemeColorButtonTone_v2> = {}
-
-  for (const state of THEME_COLOR_STATES) {
-    states[state] = buildSelectableStateColorTheme({cardTone, tone, scheme, state}, config)
-  }
-
-  // oxlint-disable-next-line no-unsafe-type-assertion
-  return states as ThemeColorButtonTone_v2
-}
-
-function buildSelectableStateColorTheme(
-  options: {
-    cardTone: ThemeColorCardToneKey
-    scheme: ThemeColorSchemeKey
-    state: ThemeColorStateKey
-    tone: ThemeColorStateToneKey
-  },
-  config?: ThemeConfig,
-): ThemeColorState_v2 {
-  const {cardTone, scheme, state, tone} = options
-  const cardTokens = config?.color?.base?.[cardTone]
-  const tokens = config?.color?.selectable?.[tone]?.[state]
-
-  const hue = tokens?._hue || cardTokens?._hue || 'gray'
-  const blendMode = tokens?._blend || ['screen', 'multiply']
-  const context: ColorTokenContext = {hue, scheme}
-
-  return {
-    _blend: blendMode[scheme === 'light' ? 0 : 1],
-    accent: {
-      fg: _color(context, tokens?.accent?.fg),
-    },
-    avatar: buildAvatarColorTheme({scheme}, tokens),
-    badge: buildBadgeColorTheme(tokens?.badge, {scheme}, config),
-    bg: _color(context, tokens?.bg),
-    border: _color(context, tokens?.border),
-    code: {
-      bg: _color(context, tokens?.code?.bg),
-      fg: _color(context, tokens?.code?.fg),
-    },
-    fg: _color(context, tokens?.fg),
-    icon: _color(context, tokens?.icon),
-    muted: {
-      bg: _color(context, tokens?.muted?.bg),
-      fg: _color(context, tokens?.muted?.fg),
-    },
-    kbd: {
-      bg: _color(context, tokens?.kbd?.bg),
-      fg: _color(context, tokens?.kbd?.fg),
-      border: _color(context, tokens?.kbd?.border),
-    },
-    link: {
-      fg: _color(context, tokens?.link?.fg),
-    },
-    skeleton: {
-      from: _color(context, tokens?.skeleton?.from),
-      to: _color(context, tokens?.skeleton?.to),
-    },
-  }
-}
-
-function buildSyntaxColorTheme(
-  options: {scheme: ThemeColorSchemeKey},
-  config?: ThemeConfig,
-): ThemeColorSyntax {
-  const {scheme} = options
-  const tokens = config?.color?.syntax
-  const context: ColorTokenContext = {hue: 'gray', scheme}
-
-  return {
-    atrule: _color(context, tokens?.atrule),
-    attrName: _color(context, tokens?.attrName),
-    attrValue: _color(context, tokens?.attrValue),
-    attribute: _color(context, tokens?.attribute),
-    boolean: _color(context, tokens?.boolean),
-    builtin: _color(context, tokens?.builtin),
-    cdata: _color(context, tokens?.cdata),
-    char: _color(context, tokens?.char),
-    class: _color(context, tokens?.class),
-    className: _color(context, tokens?.className),
-    comment: _color(context, tokens?.comment),
-    constant: _color(context, tokens?.constant),
-    deleted: _color(context, tokens?.deleted),
-    doctype: _color(context, tokens?.doctype),
-    entity: _color(context, tokens?.entity),
-    function: _color(context, tokens?.function),
-    hexcode: _color(context, tokens?.hexcode),
-    id: _color(context, tokens?.id),
-    important: _color(context, tokens?.important),
-    inserted: _color(context, tokens?.inserted),
-    keyword: _color(context, tokens?.keyword),
-    number: _color(context, tokens?.number),
-    operator: _color(context, tokens?.operator),
-    prolog: _color(context, tokens?.prolog),
-    property: _color(context, tokens?.property),
-    pseudoClass: _color(context, tokens?.pseudoClass),
-    pseudoElement: _color(context, tokens?.pseudoElement),
-    punctuation: _color(context, tokens?.punctuation),
-    regex: _color(context, tokens?.regex),
-    selector: _color(context, tokens?.selector),
-    string: _color(context, tokens?.string),
-    symbol: _color(context, tokens?.symbol),
-    tag: _color(context, tokens?.tag),
-    unit: _color(context, tokens?.unit),
-    url: _color(context, tokens?.url),
-    variable: _color(context, tokens?.variable),
-  }
-}

package/src/theme/build/buildTheme.test.ts

@@ -1,89 +0,0 @@
-import {expect, test} from 'vitest'
-
-import {defaultColorPalette} from '../defaults/colorPalette'
-import {buildTheme} from './buildTheme'
-
-test('build theme', () => {
-  const rootTheme = buildTheme({
-    palette: {
-      ...defaultColorPalette,
-      black: '#000000',
-      white: '#ffffff',
-    },
-    color: {
-      base: {
-        default: {
-          bg: ['white/0', 'black/0'],
-          fg: ['black', 'white'],
-        },
-      },
-      button: {
-        ghost: {
-          default: {
-            '*': {
-              border: ['white/0', 'black/0'],
-            },
-          },
-        },
-      },
-    },
-  })
-
-  const {color} = rootTheme.v2!
-
-  expect({
-    light: {
-      bg: color.light.default.bg,
-      fg: color.light.default.fg,
-      default: {
-        button: {
-          ghost: {
-            enabled: {
-              border: color.light.default.button.ghost.default.enabled.border,
-            },
-          },
-        },
-      },
-    },
-    dark: {
-      bg: color.dark.default.bg,
-      fg: color.dark.default.fg,
-      default: {
-        button: {
-          ghost: {
-            enabled: {
-              border: color.dark.default.button.ghost.default.enabled.border,
-            },
-          },
-        },
-      },
-    },
-  }).toEqual({
-    light: {
-      bg: 'rgba(255,255,255,0)',
-      fg: '#000000',
-      default: {
-        button: {
-          ghost: {
-            enabled: {
-              border: 'rgba(246,246,248,0)',
-            },
-          },
-        },
-      },
-    },
-    dark: {
-      bg: 'rgba(0,0,0,0)',
-      fg: '#ffffff',
-      default: {
-        button: {
-          ghost: {
-            enabled: {
-              border: 'rgba(19,20,27,0)',
-            },
-          },
-        },
-      },
-    },
-  })
-})

package/src/theme/build/buildTheme.ts

@@ -1,36 +0,0 @@
-import {ThemeConfig} from '../config'
-import {defaultThemeConfig} from '../defaults/config'
-import {defaultThemeFonts} from '../defaults/fonts'
-import {RootTheme, RootTheme_v2} from '../system'
-import {v2_v0} from '../versioning'
-import {buildColorTheme} from './buildColorTheme'
-import {renderThemeColorSchemes} from './renderColorTheme'
-
-/** @internal */
-export function buildTheme(config?: ThemeConfig): RootTheme {
-  const colorTheme = buildColorTheme(config)
-
-  const v2: RootTheme_v2 = {
-    _version: 2,
-    avatar: config?.avatar ?? defaultThemeConfig.avatar,
-    button: config?.button ?? defaultThemeConfig.button,
-    card: config?.card ?? defaultThemeConfig.card,
-    // How colors are generated:
-    // 1. Merge custom tokens with default tokens
-    // 2. Generate tree of color keys (gray/500, black, white, etc.)
-    // 3. Apply mixing and render to hex values
-    // render(build(mergeWithDefaults()))
-    color: renderThemeColorSchemes(colorTheme, config),
-    container: config?.container ?? defaultThemeConfig.container,
-    font: config?.font ?? defaultThemeFonts,
-    input: config?.input ?? defaultThemeConfig.input,
-    layer: config?.layer ?? defaultThemeConfig.layer,
-    media: config?.media ?? defaultThemeConfig.media,
-    radius: config?.radius ?? defaultThemeConfig.radius,
-    shadow: config?.shadow ?? defaultThemeConfig.shadow,
-    space: config?.space ?? defaultThemeConfig.space,
-    style: config?.style ?? defaultThemeConfig.style,
-  }
-
-  return v2_v0(v2)
-}

package/src/theme/build/colorToken/colorToken.ts

@@ -1,19 +0,0 @@
-import {parseTokenValue, ThemeColorTokenValue} from '../../config'
-import {compileColorTokenValue} from './compileColorToken'
-import {ColorTokenContext} from './types'
-
-const DEFAULT_COLOR_TOKEN_VALUE: ThemeColorTokenValue = ['500', '500']
-
-export function resolveColorTokenValue(
-  context: ColorTokenContext,
-  value: ThemeColorTokenValue = DEFAULT_COLOR_TOKEN_VALUE,
-): string {
-  const {hue, scheme} = context
-  const node = parseTokenValue(value[scheme === 'light' ? 0 : 1])
-
-  if (!node || node.type !== 'color') {
-    throw new Error(`Invalid color token: ${value[0]}`)
-  }
-
-  return compileColorTokenValue({...node, hue: node.hue || hue})
-}

package/src/theme/build/colorToken/compileColorToken.ts

@@ -1,21 +0,0 @@
-import {TokenColorValueNode} from '../../config'
-
-export function compileColorTokenValue(node: TokenColorValueNode): string {
-  let key = ''
-
-  if (node.key === 'black' || node.key === 'white') {
-    key = node.key
-  } else {
-    key = `${node.hue}/${node.tint}`
-  }
-
-  if (node.mix !== undefined) {
-    return `${key} ${node.mix * 100}%`
-  }
-
-  if (node.opacity !== undefined) {
-    key += `/${node.opacity}`
-  }
-
-  return key
-}

package/src/theme/build/colorToken/index.ts

@@ -1,2 +0,0 @@
-export * from './colorToken'
-export * from './types'

package/src/theme/build/colorToken/types.ts

@@ -1,6 +0,0 @@
-import {ColorHueKey} from '@sanity/color'
-
-export interface ColorTokenContext {
-  hue: ColorHueKey
-  scheme: 'light' | 'dark'
-}

package/src/theme/build/index.ts

@@ -1,3 +0,0 @@
-export * from './_deprecated/color'
-export * from './buildTheme'
-export * from './lib/color-fns'

package/src/theme/build/lib/color-fns/blend/index.ts

@@ -1,3 +0,0 @@
-export * from './mix'
-export * from './multiply'
-export * from './screen'