@yahoo/uds 3.59.0-beta.1 → 3.59.0-beta.2

package/src/tokens/consts/fontDeclarationsMap.ts

@@ -1,509 +0,0 @@
-import type { FontID, FontType } from '../types';
-
-const UDS_FONTS_CDN_PREFIX = 'https://s.yimg.com/bw/fonts';
-
-const sansFallbacks = ['Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'];
-const serifFallbacks = ['Georgia', 'Times', 'Times New Roman', 'serif'];
-const monoFallbacks = [
-  'ui-monospace',
-  'SFMono-Regular',
-  'Menlo',
-  'Monaco',
-  'Consolas',
-  'Liberation Mono',
-  'Courier New',
-  'monospace',
-];
-
-export const FONT_DECLARATIONS_MAP = {
-  'centra-no2': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Centra No2',
-    isVariableFont: false,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Hairline', value: 50 },
-      { label: 'Thin', value: 100 },
-      { label: 'Light', value: 300 },
-      { label: 'Book', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Bold', value: 700 },
-      { label: 'ExtraBold', value: 800 },
-      { label: 'Black', value: 900 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        fontStyle: 'normal',
-        fontWeight: '50',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-hairline.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '50',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-hairline-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '100',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-thin.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '100',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-thin-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '300',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-light.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '300',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-light-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-book.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-book-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '500',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-medium.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '500',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-medium-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-bold.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-bold-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '800',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-extrabold.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '800',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-extrabold-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '900',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-black.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '900',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/centra-no2-black-italic.woff2') format('woff2')`,
-      },
-    ],
-  },
-  inter: {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Inter',
-    isVariableFont: true,
-    fontSlants: [
-      { label: 'Italic', value: -10 },
-      { label: 'None', value: 0 },
-    ],
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Thin', value: 100 },
-      { label: 'Extra Light', value: 200 },
-      { label: 'Light', value: 300 },
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Semi Bold', value: 600 },
-      { label: 'Bold', value: 700 },
-      { label: 'Extra Bold', value: 800 },
-      { label: 'Black', value: 900 },
-    ],
-    defaults: {
-      fontSlant: 0,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/inter-vf.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'roboto-mono': {
-    fallback: monoFallbacks,
-    type: 'mono',
-    fontFamily: 'Roboto Mono',
-    isVariableFont: false,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Thin', value: 100 },
-      { label: 'Light', value: 300 },
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Bold', value: 700 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        fontStyle: 'normal',
-        fontWeight: '100',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-100.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '100',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-100-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '300',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-300.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '300',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-300-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-400.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-400-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '500',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-500.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '500',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-500-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-700.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/roboto-mono-700-italic.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'yahoo-sans': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Yahoo Sans',
-    isVariableFont: true,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'ExtraLight', value: 200 },
-      { label: 'Light', value: 300 },
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Semibold', value: 585 },
-      { label: 'Bold', value: 700 },
-      { label: 'ExtraBold', value: 810 },
-      { label: 'Black', value: 900 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-sans-vf.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'yahoo-sans-cr4': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Yahoo CR4 BETA VF',
-
-    isVariableFont: true,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      /**
-       * brand guide https://www.figma.com/design/3gDo09eKkxvq6qgHw9Epa2/Product-Visual-Guidance?node-id=41-6148&p=f&t=8NHi3cv3QtiieZNv-0
-       * says Regular should be 450, but variable font has regular at 400
-       */
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Bold', value: 700 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 450,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-sans-cr4-vf.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'yahoo-product-sans': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Yahoo Product Sans VF',
-    isVariableFont: true,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      /**
-       * brand guide https://www.figma.com/design/3gDo09eKkxvq6qgHw9Epa2/Product-Visual-Guidance?node-id=41-6148&p=f&t=8NHi3cv3QtiieZNv-0
-       * says Regular should be 450, but variable font has regular at 400
-       */
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Bold', value: 700 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 450,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-product-sans-vf.woff2') format('woff2-variations')`,
-      },
-    ],
-  },
-  'yahoo-product-sans-extended': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'YahooPd_Eval202412',
-    isVariableFont: true,
-    fontSlants: [
-      { label: 'Italic', value: 9 },
-      { label: 'None', value: 0 },
-    ],
-    fontWidths: [
-      { label: 'Cond', value: 50 },
-      { label: 'Normal', value: 75 },
-      { label: 'Ext', value: 100 },
-    ],
-    fontWeights: [
-      { label: 'Light', value: 300 },
-      /**
-       * brand guide https://www.figma.com/design/3gDo09eKkxvq6qgHw9Epa2/Product-Visual-Guidance?node-id=41-6148&p=f&t=8NHi3cv3QtiieZNv-0
-       * says Regular should be 450, but variable font has regular at 400.
-       * Going to use value from brand guide of 450 vs font file value of 400.
-       */
-      { label: 'Regular', value: 450 },
-      { label: 'Medium', value: 500 },
-      /**
-       * Brand guide https://www.figma.com/design/3gDo09eKkxvq6qgHw9Epa2/Product-Visual-Guidance?node-id=41-6148&p=f&t=8NHi3cv3QtiieZNv-0
-       * says 600 should be labeled as Emphasized, but variable font has 600 labeled as Semibold.
-       * Going to use naming from brand guide of Emphasized vs font file name of Semibold.
-       */
-      { label: 'Semibold', value: 600 },
-      { label: 'Bold', value: 700 },
-      { label: 'Black', value: 850 },
-    ],
-    defaults: {
-      fontSlant: 0,
-      fontWidth: 75,
-      fontWeight: 450,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/YahooPd_Eval202412-v1.1.0.woff2') format("woff2 supports variations"), url('${UDS_FONTS_CDN_PREFIX}/YahooPd_Eval202412-v1.1.0.woff2') format('woff2-variations')`,
-      },
-    ],
-  },
-  'yahoo-sans-condensed': {
-    fallback: sansFallbacks,
-    type: 'sans',
-    fontFamily: 'Yahoo Sans Cond',
-    isVariableFont: true,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Light', value: 300 },
-      { label: 'Regular', value: 400 },
-      { label: 'Medium', value: 500 },
-      { label: 'Bold', value: 718 },
-      { label: 'XBold', value: 800 },
-      { label: 'Black', value: 900 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        /** TODO: We can make performant by only including font weights used for this font in config */
-        fontWeight: '1 1000',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-sans-condensed-vf.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'yahoo-serif-display': {
-    fallback: serifFallbacks,
-    type: 'serif',
-    fontFamily: 'Yahoo Serif Display',
-    isVariableFont: false,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Light', value: 300 },
-      { label: 'Regular', value: 400 },
-      { label: 'Bold', value: 700 },
-      { label: 'Extrabold', value: 800 },
-      { label: 'Black', value: 900 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        fontStyle: 'normal',
-        fontWeight: '300',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-display-light.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-display-regular.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-display-bold.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '800',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-display-extrabold.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '900',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-display-black.woff2') format('woff2')`,
-      },
-    ],
-  },
-  'yahoo-serif-text': {
-    fallback: serifFallbacks,
-    type: 'serif',
-    fontFamily: 'Yahoo Serif Text',
-    isVariableFont: false,
-    fontSlants: undefined,
-    fontWidths: undefined,
-    fontWeights: [
-      { label: 'Regular', value: 400 },
-      { label: 'Bold', value: 700 },
-    ],
-    defaults: {
-      fontSlant: undefined,
-      fontWidth: undefined,
-      fontWeight: 400,
-    },
-    declarations: [
-      {
-        fontStyle: 'normal',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-text-regular.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '400',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-text-italic.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'normal',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-text-bold.woff2') format('woff2')`,
-      },
-      {
-        fontStyle: 'italic',
-        fontWeight: '700',
-        src: `url('${UDS_FONTS_CDN_PREFIX}/yahoo-serif-text-bold-italic.woff2') format('woff2')`,
-      },
-    ],
-  },
-} as const satisfies Record<string, FontDeclarationConfig>;
-
-export type FontAxisConfig = { label: string; value: number };
-
-export type FontDeclarationItemConfig = {
-  /** @default to normal if not provided */
-  fontStyle?: 'normal' | 'italic';
-  fontWeight?: `${number}` | '1 1000';
-  /** @defaults to swap if not provided */
-  fontDisplay?: 'swap';
-  src: `url('${typeof UDS_FONTS_CDN_PREFIX}/${string}.woff2') ${string}`;
-};
-
-export type FontDeclarationConfig = {
-  fallback: string[];
-  type: FontType;
-  isVariableFont: boolean;
-  fontSlants: FontAxisConfig[] | undefined;
-  fontWidths: FontAxisConfig[] | undefined;
-  fontFamily: string;
-  fontWeights: FontAxisConfig[];
-  declarations: FontDeclarationItemConfig[];
-  defaults: {
-    fontSlant: number | undefined;
-    fontWidth: number | undefined;
-    fontWeight: number;
-  };
-};
-
-export type FontDeclarationMap = typeof FONT_DECLARATIONS_MAP;
-
-export type FontWeightForFont<T extends FontID> = FontDeclarationMap[T]['fontWeights'][number];

package/src/tokens/index.ts

@@ -1,15 +0,0 @@
-export * from '../styles/variants';
-/* eslint-disable @typescript-eslint/consistent-type-exports */
-export * from './automation';
-export * from './configs/button';
-export { alwaysPalette } from './configs/palette';
-export * from './configs/shadow';
-export { fontWeightMap } from './configs/typography';
-export * from './consts/cssTokens';
-export * from './consts/defaultModes';
-export * from './consts/fontDeclarationsMap';
-export * from './parseButtonVariants';
-export type * from './types';
-export * from './utils/entries';
-export * from './utils/fromEntries';
-export * from './utils/mapValues';

package/src/tokens/parseButtonVariants.ts

@@ -1,59 +0,0 @@
-import type { ButtonPalette, ButtonVariant, ButtonVariantFlat } from './types';
-
-interface ParseButtonVariantFlatArgs {
-  palette?: ButtonPalette;
-  variant?: ButtonVariant;
-}
-
-function parseButtonVariantFlat({
-  palette = 'accent',
-  variant = 'primary',
-}: ParseButtonVariantFlatArgs): ButtonVariantFlat {
-  if (palette === 'accent') {
-    return variant; // primary, secondary, tertiary
-  }
-
-  if (variant === 'primary') {
-    return palette; // brand, alert, positive, warning
-  }
-
-  return `${palette}-${variant}`; // brand-secondary, alert-tertiary, etc.
-}
-
-interface parseDeprecatedButtonPaletteVariantArgs {
-  flatVariant?: ButtonVariantFlat;
-}
-
-interface DeprecatedButtonVariant {
-  palette: ButtonPalette | undefined;
-  variant: ButtonVariant | undefined;
-}
-
-function parseDeprecatedButtonPaletteVariant({
-  flatVariant,
-}: parseDeprecatedButtonPaletteVariantArgs): DeprecatedButtonVariant {
-  if (!flatVariant) {
-    return { palette: undefined, variant: undefined };
-  }
-
-  const [palette, variant] = flatVariant.split('-') as [
-    ButtonPalette | undefined,
-    ButtonVariant | undefined,
-  ];
-
-  if (!variant) {
-    // If there's no "-", it must be a primary variant or standalone palette
-    if (['primary', 'secondary', 'tertiary'].includes(flatVariant)) {
-      return { palette: 'accent', variant: flatVariant as ButtonVariant };
-    }
-
-    return { palette: flatVariant as Exclude<ButtonPalette, 'accent'>, variant: 'primary' };
-  }
-
-  return {
-    palette: palette as Exclude<ButtonPalette, 'accent'>,
-    variant: variant as Exclude<ButtonVariant, 'primary'>,
-  };
-}
-
-export { parseButtonVariantFlat, parseDeprecatedButtonPaletteVariant };

package/src/tokens/parseTokens.ts

@@ -1,122 +0,0 @@
-import {
-  AVATAR_SIZE_PREFIX,
-  BORDER_RADIUS_PREFIX,
-  BORDER_WIDTH_PREFIX,
-  ICON_SIZE_PREFIX,
-  SPECTRUM_COLOR_PREFIX,
-  UDS_PREFIX,
-} from './consts/cssTokens';
-import type {
-  ColorMode,
-  ColorsConfig,
-  Hue,
-  HueStep,
-  PaletteConfig,
-  PaletteType,
-  ScaleMode,
-  UniversalTokensConfig,
-} from './types';
-import { entries } from './utils/entries';
-import { mapValues } from './utils/mapValues';
-
-function transformColors(colors: ColorsConfig) {
-  const { palette, spectrum } = colors;
-  const rootVars: Record<string, string> = {};
-  const tailwindConfig = {
-    spectrum: {} as Record<Hue, Record<HueStep, string>>,
-    palette: {} as {
-      [key in PaletteType]: Record<keyof PaletteConfig[key], string>;
-    },
-  };
-
-  for (const [hue, hueSteps] of entries(spectrum)) {
-    for (const [hueStep, value] of entries(hueSteps)) {
-      const name = `${hue}-${hueStep}`;
-      const varKey = `--${SPECTRUM_COLOR_PREFIX}-${name}`;
-      if (!tailwindConfig.spectrum[hue]) {
-        tailwindConfig.spectrum[hue] = {} as Record<HueStep, string>;
-      }
-      tailwindConfig.spectrum[hue][hueStep] = `rgb(var(${varKey}))`;
-      rootVars[varKey] = value;
-    }
-  }
-
-  entries(palette).forEach(([paletteType, paletteConfig]) => {
-    for (const [paletteKey, { hue, step, opacity }] of Object.entries(paletteConfig)) {
-      if (!(paletteType in tailwindConfig.palette)) {
-        // @ts-expect-error we fill this object later
-        tailwindConfig.palette[paletteType] = {};
-      }
-      const name = `--${UDS_PREFIX}-${paletteType}-color-${paletteKey}`;
-      rootVars[name] = `var(--${SPECTRUM_COLOR_PREFIX}-${hue}-${step})`;
-      // @ts-expect-error this is fine
-      tailwindConfig.palette[paletteType][paletteKey] = opacity
-        ? `rgb(var(${name}) / ${opacity})`
-        : `rgb(var(${name}))`;
-    }
-  });
-
-  return {
-    _vars: rootVars,
-    _raw: colors,
-    tailwindConfig,
-  };
-}
-
-function transformNumericToPx<T extends Record<string, number>>(prefix: string, config: T) {
-  if (!config) {
-    return {
-      _vars: {} as Record<string, string>,
-      _raw: {} as Record<string, number>,
-      tailwindConfig: {} as Record<string, string>,
-    };
-  }
-  const rootVars: Record<string, string> = {};
-  const tailwindConfig = {} as Record<string, string>;
-  for (const [variant, value] of entries(config)) {
-    const rootVarKey = `--${prefix}-${variant}`;
-    const rootVarValue = `${value}px`;
-    rootVars[rootVarKey] = rootVarValue;
-    tailwindConfig[variant] = `var(${rootVarKey})`;
-  }
-  return {
-    _vars: rootVars,
-    _raw: config,
-    tailwindConfig,
-  };
-}
-
-type WebTokens = Omit<UniversalTokensConfig, 'colorMode' | 'scaleMode' | 'fontFamily'> & {
-  colorMode: Record<ColorMode, ReturnType<typeof transformColors>>;
-  scaleMode: Record<
-    ScaleMode,
-    {
-      borderRadius: ReturnType<typeof transformNumericToPx>;
-      borderWidth: ReturnType<typeof transformNumericToPx>;
-      avatarSizes: ReturnType<typeof transformNumericToPx>;
-      iconSizes: ReturnType<typeof transformNumericToPx>;
-    }
-  >;
-};
-
-export function parseTokens(config: UniversalTokensConfig): WebTokens {
-  const { colorMode, scaleMode } = config;
-
-  return {
-    ...config,
-    colorMode: {
-      light: transformColors(colorMode.light),
-      dark: transformColors(colorMode.dark),
-    },
-    scaleMode: mapValues(scaleMode, ({ borderRadius, borderWidth, avatarSizes, iconSizes }) => {
-      return {
-        borderRadius: transformNumericToPx(BORDER_RADIUS_PREFIX, borderRadius),
-        borderWidth: transformNumericToPx(BORDER_WIDTH_PREFIX, borderWidth),
-        avatarSizes: transformNumericToPx(AVATAR_SIZE_PREFIX, avatarSizes),
-        iconSizes: transformNumericToPx(ICON_SIZE_PREFIX, iconSizes),
-      };
-    }),
-  };
-}
-
-export { type WebTokens };