@yahoo/uds 3.59.0-beta.1 → 3.60.0

package/dist/tokens/types.d.cts

@@ -1,1076 +0,0 @@
-import { UniversalTokensConfigAuto } from "../generated/universalTokensConfigAuto.cjs";
-import { alwaysPalette } from "./configs/palette.cjs";
-import { BUTTON_CSS_VAR_MAP, ICON_BUTTON_CSS_VAR_MAP, MOTION_PREFIX, UDS_PREFIX } from "./consts/cssTokens.cjs";
-import { FONT_DECLARATIONS_MAP } from "./consts/fontDeclarationsMap.cjs";
-import { CSSProperties, ElementType, HTMLAttributes, PropsWithChildren, ReactElement, ReactNode, Ref } from "react";
-import { IconSize, IconVariant, SvgIcon } from "@yahoo/uds-icons/types";
-import { Spring } from "motion/react";
-import { IntRange } from "type-fest";
-
-//#region src/tokens/types.d.ts
-type ClassNameWithoutDot<T extends string> = T extends `.${infer U}` ? U : never;
-type ExtractUrlFromFontFaceRule<T extends string> = T extends `url('${infer U}') format('woff2')` ? U : never;
-type UnjoinClassNames<T extends string> = T extends `${infer U}.${infer V}` ? U | V : T;
-/** Ensure an array has a max length of N */
-type MaxLengthArray<T, N extends number, A extends T[] = []> = A['length'] extends N ? A : T[] extends A ? T[] : A | MaxLengthArray<T, N, [...A, T]>;
-type PaletteType = keyof PaletteConfig;
-type PaletteValue = {
-  hue: Hue;
-  step: HueStep;
-  opacity?: OpacityStep;
-};
-type Palette = { [key in PaletteType]: keyof PaletteConfig[key] };
-type Hue = 'gray' | 'purple' | 'indigo' | 'blue' | 'cyan' | 'teal' | 'mint' | 'green' | 'lime' | 'citron' | 'yellow' | 'brown' | 'nude' | 'orange' | 'sunset' | 'red' | 'rose' | 'pink' | 'magenta' | 'carbon';
-type HueStep = '0' | '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '13' | '14' | '15';
-type SpectrumColor = `${Hue}-${HueStep}`;
-type SharedPrimaryPaletteAlias = 'brand' | 'alert' | 'positive' | 'warning' | 'info';
-type SharedSecondaryPaletteAlias = `${SharedPrimaryPaletteAlias}-secondary`;
-type SharedPaletteAlias = SharedPrimaryPaletteAlias | SharedSecondaryPaletteAlias;
-type DeprecatedAccentAlias = 'accent';
-type OpacityStep = `${Percentage}`;
-type BackgroundPaletteAlias = 'primary' | 'secondary' | DeprecatedAccentAlias | SharedPaletteAlias;
-type BackgroundPalette = Record<BackgroundPaletteAlias, PaletteValue>;
-type ForegroundPaletteAlias = 'primary' | 'secondary' | 'tertiary' | 'muted' | 'on-color' | DeprecatedAccentAlias | SharedPaletteAlias;
-type ForegroundPalette = Record<ForegroundPaletteAlias, PaletteValue>;
-type LinePaletteAlias = 'primary' | 'secondary' | 'tertiary' | 'muted' | DeprecatedAccentAlias | SharedPaletteAlias;
-type LinePalette = Record<LinePaletteAlias, PaletteValue>;
-type ShadowPaletteAlias = 'primary' | 'secondary';
-type ShadowPalette = Record<ShadowPaletteAlias, PaletteValue>;
-type AlwaysPalette = typeof alwaysPalette;
-type AlwaysPaletteAlias = keyof AlwaysPalette;
-type ForegroundColor = ForegroundPaletteAlias | AlwaysPaletteAlias;
-type LineColor = LinePaletteAlias | AlwaysPaletteAlias;
-type BackgroundColor = BackgroundPaletteAlias | AlwaysPaletteAlias;
-type ShadowColor = ShadowPaletteAlias | SpectrumColor | AlwaysPaletteAlias;
-type PropertyToPaletteAliasMap = {
-  backgroundColor: BackgroundColor;
-  borderColor: LineColor;
-  color: ForegroundColor;
-};
-type ShadowSpectrumColor = {
-  type: 'spectrum';
-  value: SpectrumColor;
-};
-type ShadowPaletteColor = {
-  type: 'palette';
-  value: ShadowColor;
-};
-type ShadowAlwaysColor = {
-  type: 'always';
-  value: AlwaysPaletteAlias;
-};
-type ShadowColorConfig = ShadowPaletteColor | ShadowSpectrumColor | ShadowAlwaysColor;
-type ShadowOffset = `-${Exclude<SpacingAlias, '0'>}` | SpacingAlias;
-type ShadowOpacity = `${IntRange<0, 101>}`;
-type ShadowSpreadRadius = `-${Exclude<SpacingAlias, '0'>}` | SpacingAlias;
-type ShadowPreset = {
-  offsetX: ShadowOffset;
-  offsetY: ShadowOffset;
-  blur: SpacingAlias;
-  spread: ShadowSpreadRadius;
-  color: ShadowColorConfig;
-  opacity: ShadowOpacity;
-};
-type ShadowVariant = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
-type ShadowVariantInvert = `${Exclude<ShadowVariant, 'none'>}-invert`;
-type ShadowVariantWithInvert = ShadowVariant | ShadowVariantInvert;
-type ShadowVariantConfig = MaxLengthArray<ShadowPreset, 3>;
-type ShadowType = 'drop' | 'inset';
-type ShadowTypeConfig = Record<ShadowVariant, ShadowVariantConfig>;
-type ShadowConfig = {
-  drop: Record<ShadowVariant, ShadowVariantConfig>;
-  inset: Record<ShadowVariant | ShadowVariantInvert, ShadowVariantConfig>;
-};
-type Percentage = IntRange<0, 101>;
-type PixelsUnit = {
-  value: number;
-  type: 'px';
-};
-type RemsUnit = {
-  value: number;
-  type: 'rem';
-};
-type UnitlessUnit = {
-  value: number;
-  type: 'unitless';
-};
-type PercentageUnit = {
-  value: Percentage;
-  type: 'percentage';
-};
-type BreakpointValue = PixelsUnit;
-type BreakpointsConfig = {
-  sm: BreakpointValue;
-  md: BreakpointValue;
-  lg: BreakpointValue;
-  xl: BreakpointValue;
-  '2xl': BreakpointValue;
-};
-type Breakpoint = keyof BreakpointsConfig;
-type BreakpointWithBase = Breakpoint | 'base';
-type TextVariantTypography = 'display1' | 'display2' | 'display3' | 'title1' | 'title2' | 'title3' | 'title4' | 'headline1' | 'body1' | 'label1' | 'label2' | 'label3' | 'label4' | 'caption1' | 'caption2' | 'legal1';
-type TextVariantUi = 'ui1' | 'ui2' | 'ui3' | 'ui4' | 'ui5' | 'ui6';
-type TextVariantWithoutEmphasized = TextVariantTypography | TextVariantUi;
-type TextVariant = TextVariantWithoutEmphasized | `${TextVariantWithoutEmphasized}/emphasized`;
-type FontAlias = 'sans' | 'sans-alt' | 'serif' | 'serif-alt' | 'mono';
-type FontType = 'sans' | 'serif' | 'mono';
-type FontID = keyof typeof FONT_DECLARATIONS_MAP;
-type FontDeclaration = (typeof FONT_DECLARATIONS_MAP)[FontID]['declarations'][number];
-type FontFamilyCDNUrl = ExtractUrlFromFontFaceRule<FontDeclaration['src']>;
-type FontConfig = Record<FontAlias, FontID>;
-type FontCssVar = `--${typeof UDS_PREFIX}-font-${FontAlias}`;
-type FontWeightNumeric = `${IntRange<100, 901, 100>}`;
-type FontWeightDescriptive = 'thin' | 'extralight' | 'light' | 'regular' | 'medium' | 'semibold' | 'bold' | 'extrabold' | 'black';
-type TextTransform = 'none' | 'uppercase' | 'lowercase' | 'capitalize';
-type TextDecorationLine = 'none' | 'underline';
-type LetterSpacing = 'tighter' | 'tight' | 'normal' | 'wide' | 'wider' | 'widest';
-type LineClampAlias = `${IntRange<1, 7>}`;
-type LineHeight = number;
-type FontSize = number;
-type TextTransformConfig = Record<TextVariantWithoutEmphasized, TextTransform>;
-type FontSizeConfig = Record<TextVariantWithoutEmphasized, FontSize>;
-type FontFamilyConfig = Record<TextVariantWithoutEmphasized, FontAlias>;
-type FontWeightConfig = Record<TextVariantWithoutEmphasized, number>;
-type FontSlantConfig = Record<TextVariantWithoutEmphasized, number>;
-type FontWidthConfig = Record<TextVariantWithoutEmphasized, number>;
-type LineHeightConfig = Record<TextVariantWithoutEmphasized, LineHeight>;
-type TextProperty = 'fontFamily' | 'fontSize' | 'fontWeight' | 'lineHeight' | 'textTransform';
-/**
- * Defines a structured CSS value, separating the raw value from its unit type.
- * 'unitless' is for unitless values like line-height or font-weight.
- */
-type TypographyUnitValue = PixelsUnit | UnitlessUnit;
-/**
- * Defines the structure for a single, responsive CSS property.
- * The value can now be a simple string (for properties like fontFamily)
- * or a structured CssValue object (for properties like fontSize).
- */
-type TypographyResponsiveProperty<T> = {
-  /**
-   * The base value for the property, applying from 0px up to the 'sm' breakpoint.
-   */
-  base: T;
-  /**
-   * Responsive overrides for each breakpoint. If this key is present, it must
-   * contain a value for every defined breakpoint.
-   */
-  breakpoints: Record<Breakpoint, T>;
-};
-type TypographyStyleProperty = 'fontFamily' | 'fontSize' | 'fontWeight' | 'lineHeight' | 'textTransform' | 'fontSlant' | 'fontWidth';
-type TypographyStyle = {
-  fontFamily: TypographyResponsiveProperty<FontAlias>;
-  textTransform: TypographyResponsiveProperty<TextTransform>;
-  fontSize: TypographyResponsiveProperty<TypographyUnitValue>;
-  fontWeight: TypographyResponsiveProperty<TypographyUnitValue>;
-  lineHeight: TypographyResponsiveProperty<TypographyUnitValue>;
-  fontSlant: TypographyResponsiveProperty<TypographyUnitValue>;
-  fontWidth: TypographyResponsiveProperty<TypographyUnitValue>;
-};
-type TypographyConfig = Record<TextVariant, TypographyStyle>;
-type GlobalDefaultsConfig = {
-  breakpoint: Breakpoint | 'base';
-  enableResponsiveType: boolean;
-};
-type TShirtSize = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
-type TShirtSizeCommon = Extract<TShirtSize, 'sm' | 'md' | 'lg'>;
-type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-type AvatarSizeConfig = Record<AvatarSize, number>;
-type AvatarShape = BorderRadius;
-type IconSizeConfig = Record<IconSize, number>;
-type SpacingAlias = '0' | 'px' | '0.5' | '1' | '1.5' | '2' | '2.5' | '3' | '3.5' | '4' | '4.5' | '5' | '5.5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '14' | '16' | '20' | '24' | '28' | '32' | '36' | '40' | '44' | '48' | '52' | '56' | '60' | '64' | '72' | '80' | '96';
-type SpacingConfig = Record<SpacingAlias, number>;
-type BorderRadius = TShirtSize;
-type BorderRadiusConfig = Record<BorderRadius, number>;
-type BorderWidth = 'none' | 'thin' | 'medium' | 'thick';
-type BorderWidthConfig = Record<BorderWidth, number>;
-type ColorModeConfig = Record<ColorMode, ColorsConfig>;
-type ColorsConfig = {
-  palette: PaletteConfig;
-  spectrum: SpectrumConfig;
-};
-type SpectrumValue = Record<HueStep, string>;
-type SpectrumConfig = Record<Hue, SpectrumValue>;
-type PaletteConfig = {
-  background: BackgroundPalette;
-  foreground: ForegroundPalette;
-  line: LinePalette;
-  shadow: ShadowPalette;
-};
-type ScaleConfig = {
-  avatarSizes: AvatarSizeConfig;
-  iconSizes: IconSizeConfig;
-  borderRadius: BorderRadiusConfig;
-  borderWidth: BorderWidthConfig;
-};
-type ScaleModeConfig = Record<ScaleMode, ScaleConfig>;
-type ButtonSize = TShirtSizeCommon;
-type ButtonPalette = 'brand' | 'accent' | 'alert' | 'positive' | 'warning' | 'info';
-type ButtonVariant = 'primary' | 'secondary' | 'tertiary';
-type ButtonState = 'hover' | 'pressed';
-type ButtonKind = 'fill' | 'outline' | 'ghost';
-type ButtonMotionProperty = 'scale';
-type ButtonMotionEffect = 'up' | 'down' | 'none';
-type ButtonColorEffect = 'none' | 'custom';
-type ButtonColorProperty = 'backgroundColor' | 'borderColor' | 'color';
-type ButtonSizeProperty = keyof ButtonSizeConfig;
-type ButtonVariantFlat = ButtonVariant | `${Exclude<ButtonPalette, 'accent'>}` | `${Exclude<ButtonPalette, 'accent'>}-${Exclude<ButtonVariant, 'primary'>}`;
-type ButtonColorEffectConfig = {
-  options: ButtonColorEffect[];
-  value: ButtonColorEffect;
-};
-type ButtonMotionEffectConfig = {
-  options: ButtonMotionEffect[];
-  value: ButtonMotionEffect;
-};
-type ButtonSpectrumColor = {
-  type: 'spectrum';
-  value: SpectrumColor;
-};
-type ButtonPaletteColor<T> = {
-  type: 'palette';
-  value: T;
-};
-type AlwaysPaletteColor<T> = {
-  type: 'always';
-  value: T;
-};
-type ButtonColorConfig<Property extends ButtonColorProperty> = ButtonPaletteColor<PropertyToPaletteAliasMap[Property]> | ButtonSpectrumColor;
-type ButtonColorPropertyConfig = { [key in ButtonColorProperty]: ButtonColorConfig<key> };
-type ButtonMotionPropertyConfig = { [key in ButtonMotionProperty]: ButtonMotionEffect };
-type ConfigurableShadowField<T> = {
-  value: T | 'custom';
-  config: ShadowVariantConfig | null;
-};
-type ConfigurableDropShadowValues = ConfigurableShadowField<ShadowVariant>['value'];
-type ConfigurableInsetShadowValues = ConfigurableShadowField<ShadowVariantWithInvert>['value'];
-type ButtonShadowPropertyConfig = {
-  dropShadow: ConfigurableShadowField<ShadowVariant>;
-  insetShadow: ConfigurableShadowField<ShadowVariantWithInvert>;
-};
-type ButtonBaseConfig = {
-  borderWidth: BorderWidth;
-  borderRadius: BorderRadius;
-} & ButtonColorPropertyConfig & ButtonMotionPropertyConfig & ButtonShadowPropertyConfig;
-type ButtonSizeConfig = {
-  spacingHorizontal: SpacingAlias;
-  spacingVertical: SpacingAlias;
-  gap: SpacingAlias;
-  iconSize: IconSize;
-  textVariant: TextVariant;
-};
-type ButtonVariantConfig = {
-  kind: ButtonKind;
-  base: ButtonBaseConfig;
-  effect: ButtonStateEffectConfig;
-  state: ButtonStateConfig;
-};
-type ButtonPaletteConfig = { [variant in ButtonVariant]: ButtonVariantConfig };
-type ButtonStateConfig = { [state in ButtonState]: ButtonColorPropertyConfig & ButtonMotionPropertyConfig & ButtonShadowPropertyConfig };
-type ButtonColorEffectConfigMap = { [property in ButtonColorProperty]: ButtonColorEffectConfig };
-type ButtonMotionEffectConfigMap = { [property in ButtonMotionProperty]: ButtonMotionEffectConfig };
-type ButtonStateEffectConfig = { [state in ButtonState]: ButtonColorEffectConfigMap & ButtonMotionEffectConfigMap };
-type ButtonDefaultsConfig = {
-  palette: ButtonPalette;
-  variant: ButtonVariant;
-  size: ButtonSize;
-};
-interface ButtonConfig {
-  defaults: ButtonDefaultsConfig;
-  size: { [size in ButtonSize]: ButtonSizeConfig };
-  palette: { [palette in ButtonPalette]: ButtonPaletteConfig };
-}
-type ButtonCssVarMap = typeof BUTTON_CSS_VAR_MAP;
-type ButtonCssVar = ButtonCssVarMap[keyof ButtonCssVarMap];
-type ButtonStateCssProperty = keyof Omit<ButtonBaseConfig, 'scale'>;
-type ButtonSizeCssProperty = keyof Pick<ButtonCssVarMap, 'padding' | 'columnGap' | 'fontWeight' | 'fontSize' | 'lineHeight' | 'textTransform' | 'iconSize'>;
-type ButtonStateCssVar = Pick<ButtonCssVarMap, ButtonStateCssProperty>[ButtonStateCssProperty];
-type ButtonSizeCssVar = Pick<ButtonCssVarMap, ButtonSizeCssProperty>[ButtonSizeCssProperty];
-type ButtonStateVarsMap = Record<ButtonStateCssVar, string>;
-type ButtonSizeVarsMap = Record<ButtonSizeCssVar, string>;
-type ButtonPseudoStyles<ClassName extends string> = { [key in `.${ButtonState}`]: Record<ClassName, ButtonStateVarsMap> };
-type ButtonStateVarsWithPseudoStyles<T extends string> = Record<T, ButtonStateVarsMap> & ButtonPseudoStyles<T>;
-type ButtonClassMap = {
-  '.uds-button': {
-    /** Hardcoded in tailwind plugin */
-    display: CSSProperties['display'];
-    alignItems: CSSProperties['alignItems'];
-    whiteSpace: CSSProperties['whiteSpace'];
-    /** Driven by css variables */
-    borderRadius: string;
-    color: string;
-    backgroundColor: string;
-    boxShadow: string;
-    padding: string;
-    columnGap: string;
-    fontFamily: string;
-    fontWeight: string;
-    fontSize: string;
-    lineHeight: string;
-    textTransform: string;
-  };
-} & ButtonStateVarsWithPseudoStyles<`.uds-button-${ButtonPalette}` | `.uds-button-${ButtonVariant}` | `.uds-button-${ButtonPalette}.uds-button-${ButtonVariant}`> & Record<`.uds-button-${ButtonSize}`, ButtonSizeVarsMap> & ButtonPseudoStyles<'.uds-button'>;
-type ButtonClassName = UnjoinClassNames<ClassNameWithoutDot<Exclude<keyof ButtonClassMap, `.${ButtonState}`>>>;
-type IconButtonSize = Extract<TShirtSize, 'xs' | TShirtSizeCommon | 'xl'>;
-interface IconButtonSizeConfig {
-  spacing: SpacingAlias;
-  iconSize: IconSize;
-}
-interface IconButtonDefaultsConfig extends Omit<ButtonDefaultsConfig, 'size'> {
-  size: IconButtonSize;
-}
-interface IconButtonConfig {
-  defaults: IconButtonDefaultsConfig;
-  size: { [size in IconButtonSize]: IconButtonSizeConfig };
-}
-type IconButtonCssVarMap = typeof ICON_BUTTON_CSS_VAR_MAP;
-type IconButtonCssVar = IconButtonCssVarMap[keyof IconButtonCssVarMap];
-type IconButtonSizeCssVar = IconButtonCssVarMap[keyof IconButtonCssVarMap];
-type IconButtonSizeVarsMap = Record<IconButtonSizeCssVar, string>;
-type IconButtonClassMap = {
-  '.uds-icon-button': {
-    /** Hardcoded in tailwind plugin */
-    display: CSSProperties['display'];
-    alignItems: CSSProperties['alignItems'];
-    padding: string;
-  };
-} & Record<`.uds-icon-button-${IconButtonSize}`, IconButtonSizeVarsMap>;
-type IconButtonClassName = UnjoinClassNames<ClassNameWithoutDot<keyof IconButtonClassMap>>;
-type InputSize = Extract<TShirtSizeCommon, 'md' | 'lg'>;
-interface UniversalTokensConfig extends UniversalTokensConfigAuto {
-  version: string;
-  colorMode: ColorModeConfig;
-  scaleMode: ScaleModeConfig;
-  font: FontConfig;
-  button: ButtonConfig;
-  iconButton: IconButtonConfig;
-  motion: MotionConfig;
-  shadow: ShadowConfig;
-  breakpoints: BreakpointsConfig;
-  typography: TypographyConfig;
-  globalDefaults: GlobalDefaultsConfig;
-}
-type UdsCssVar = FontCssVar | ButtonCssVar | IconButtonCssVar;
-type PlatformMode = 'web' | 'ios' | 'android';
-type ColorMode = 'light' | 'dark';
-type ColorModeForApp = ColorMode | 'system';
-type ScaleMode = 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
-type ScaleModeForApp = ScaleMode | 'system';
-type HighContrastMode = boolean;
-type RegionMode = '🇺🇸 US' | '🇩🇪 DE' | '🇫🇷 FR' | '🇨🇳 CN';
-interface Modes {
-  colorMode: ColorMode;
-  scaleMode: ScaleMode;
-}
-type Animation = 'none' | 'spin' | 'ping' | 'pulse' | 'bounce';
-type TransitionDelay = '0' | '75' | '100' | '150' | '200' | '300' | '500' | '700' | '1000';
-type TransitionDuration = '0' | '75' | '100' | '150' | '200' | '300' | '500' | '700' | '1000';
-type TransitionTiming = 'linear' | 'in' | 'out' | 'in-out';
-type MotionVariant = 'damped' | 'smooth' | 'subtle' | 'bouncy' | 'veryBouncy';
-type MotionVariantSpeed = '1' | '2' | '3' | '4';
-type MotionSpringConfigOptions = 'damping' | 'stiffness';
-type MotionSpringConfig = Required<Pick<Spring, MotionSpringConfigOptions>>;
-type MotionCssVar = `--${typeof MOTION_PREFIX}-${MotionVariant}-${MotionVariantSpeed}-${keyof MotionSpringConfig}`;
-type MotionVariantValues = { [key in MotionVariantSpeed]: MotionSpringConfig };
-type MotionConfig = Record<MotionVariant, MotionVariantValues>;
-type AriaAttribute = 'busy' | 'checked' | 'disabled' | 'expanded' | 'hidden' | 'pressed' | 'readonly' | 'required' | 'selected' | 'invalid';
-type DataAttribute = 'active' | 'active-item' | 'autofill' | 'backdrop' | 'enter' | 'leave' | 'focus-visible';
-type Flex = '1' | 'auto' | 'initial' | 'none';
-type FlexGrow = '0' | '1' | '2' | '3';
-type FlexShrink = '0' | '1';
-type FlexAlignContent = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'space-between' | 'space-around';
-type FlexAlignItems = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-type FlexAlignSelf = 'auto' | 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-type FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';
-type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
-type FlexJustifyContent = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
-type FlexBasis = 'min-content';
-type Display = 'block' | 'inline-block' | 'inline' | 'flex' | 'inline-flex' | 'table' | 'inline-table' | 'table-caption' | 'table-cell' | 'table-column' | 'table-column-group' | 'table-footer-group' | 'table-header-group' | 'table-row-group' | 'table-row' | 'flow-root' | 'grid' | 'contents';
-type Overflow = 'auto' | 'hidden' | 'clip' | 'visible' | 'scroll';
-type Position = 'static' | 'fixed' | 'absolute' | 'relative' | 'sticky';
-type ScaleEffectMap = {
-  none: { [key in Exclude<TShirtSize, 'none' | 'full'>]: '1' };
-  down: {
-    xs: '0.9875';
-    sm: '0.97';
-    md: '0.875';
-    lg: '0.75';
-    xl: '0.5';
-  };
-  up: {
-    xs: '1.0125';
-    sm: '1.03';
-    md: '1.125';
-    lg: '1.25';
-    xl: '2';
-  };
-};
-type ImageStyleProps = {
-  /**
-   * Determines how the image should be resized to fit its container.
-   */
-  contentFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
-};
-interface BorderStyleProps {
-  /** Add a border radius to all corners of the box. */
-  borderRadius?: BorderRadius;
-  /** Add a border radius to top left corner of the box. */
-  borderTopStartRadius?: BorderRadius;
-  /** Add a border radius to top right corner of the box. */
-  borderTopEndRadius?: BorderRadius;
-  /** Add a border radius to bottom left corner of the box. */
-  borderBottomStartRadius?: BorderRadius;
-  /** Add a border radius to bottom right corner of the box. */
-  borderBottomEndRadius?: BorderRadius;
-  /** Adds a custom border color from the palette */
-  borderColor?: LineColor;
-  /** Start border color */
-  borderStartColor?: LineColor;
-  /** End border color */
-  borderEndColor?: LineColor;
-  /** Top border color */
-  borderTopColor?: LineColor;
-  /** Bottom border color */
-  borderBottomColor?: LineColor;
-  /** Shorthand property to the width of an element's border. */
-  borderWidth?: BorderWidth;
-  /** Sets the width of the top and bottom border of an element. */
-  borderVerticalWidth?: BorderWidth;
-  /** Sets the width of the start (left) and end (right) border of an element. */
-  borderHorizontalWidth?: BorderWidth;
-  /** Sets the width of the start (left) border of an element. */
-  borderStartWidth?: BorderWidth;
-  /** Sets the width of the end (right) border of an element. */
-  borderEndWidth?: BorderWidth;
-  /** Sets the width of the top border of an element. */
-  borderTopWidth?: BorderWidth;
-  /** Sets the width of the bottom border of an element. */
-  borderBottomWidth?: BorderWidth;
-}
-interface ShadowStyleProps {
-  /** Sets the variant of the shadow. */
-  dropShadow?: ShadowVariant;
-  /** Sets the variant of the inset shadow. */
-  insetShadow?: ShadowVariant | ShadowVariantInvert;
-}
-interface LayoutStyleProps {
-  /** Sets whether an element is treated as a block or inline box and the layout used for its children, such as flow layout, grid or flex. */
-  display?: Display;
-  /** Shorthand property which sets the desired behavior when content does not fit in the parent element box (overflows) in the horizontal and/or vertical direction. */
-  overflow?: Overflow;
-  /** Sets what shows when content overflows a block-level element's left and right edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property. */
-  overflowX?: Overflow;
-  /** sets what shows when content overflows a block-level element's top and bottom edges. This may be nothing, a scroll bar, or the overflow content. This property may also be set by using the overflow shorthand property. */
-  overflowY?: Overflow;
-  /** Sets how an element is positioned in a document. The top, right, bottom, and left properties determine the final location of positioned elements. */
-  position?: Position;
-}
-interface SpacingStyleProps {
-  /** Apply inner spacing on all sides. */
-  spacing?: SpacingAlias;
-  /** Apply inner spacing on the leading and trailing sides. */
-  spacingHorizontal?: SpacingAlias;
-  /** Apply inner spacing on the top and bottom sides. */
-  spacingVertical?: SpacingAlias;
-  /** Apply inner spacing on the bottom side. */
-  spacingBottom?: SpacingAlias;
-  /** Apply inner spacing on the trailing side. */
-  spacingEnd?: SpacingAlias;
-  /** Apply inner spacing on the leading side. */
-  spacingStart?: SpacingAlias;
-  /** Apply inner spacing on the top side. */
-  spacingTop?: SpacingAlias;
-  /** Apply negative outer spacing on all sides. */
-  offset?: SpacingAlias;
-  /** Apply negative outer spacing on the top and bottom sides. */
-  offsetVertical?: SpacingAlias;
-  /** Apply negative outer spacing on the leading and trailing sides. */
-  offsetHorizontal?: SpacingAlias;
-  /** Apply negative outer spacing on the bottom side. */
-  offsetBottom?: SpacingAlias;
-  /** Apply negative outer spacing on the trailing side. */
-  offsetEnd?: SpacingAlias;
-  /** Apply negative outer spacing on the leading side. */
-  offsetStart?: SpacingAlias;
-  /** Apply negative outer spacing on the top side. */
-  offsetTop?: SpacingAlias;
-  /** Control the horizontal gutters between grid and flexbox items. */
-  columnGap?: SpacingAlias;
-  /** Control the vertical gutters between grid and flexbox items. */
-  rowGap?: SpacingAlias;
-}
-interface FlexStyleProps {
-  /** Sets the distribution of space between and around content items along a flexbox's cross-axis or a grid's block axis. */
-  alignContent?: FlexAlignContent;
-  /** Sets the align-self value on all direct children as a group. In Flexbox, it controls the alignment of items on the Cross Axis. In Grid Layout, it controls the alignment of items on the Block Axis within their grid area. */
-  alignItems?: FlexAlignItems;
-  /** Overrides a grid or flex item's align-items value. In Grid, it aligns the item inside the grid area. In Flexbox, it aligns the item on the cross axis. */
-  alignSelf?: FlexAlignSelf;
-  /** Sets how a flex item will grow or shrink to fit the space available in its flex container. */
-  flex?: Flex;
-  /** Sets how flex items are placed in the flex container defining the main axis and the direction (normal or reversed). */
-  flexDirection?: FlexDirection;
-  /** Sets the flex grow factor, which specifies how much of the flex container's remaining space should be assigned to the flex item's main size. */
-  flexGrow?: FlexGrow;
-  /** Sets the flex shrink factor of a flex item. If the size of all flex items is larger than the flex container, items shrink to fit according to flex-shrink. */
-  flexShrink?: FlexShrink;
-  /** Sets whether flex items are forced onto one line or can wrap onto multiple lines. If wrapping is allowed, it sets the direction that lines are stacked. */
-  flexWrap?: FlexWrap;
-  /** Defines how the browser distributes space between and around content items along the main-axis of a flex container, and the inline axis of a grid container. */
-  justifyContent?: FlexJustifyContent;
-  /** Sets the initial main size of a flex item. It sets the size of the content box unless otherwise set with box-sizing. https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis */
-  flexBasis?: FlexBasis;
-}
-interface StateStyleProps {
-  interactable?: boolean;
-  focusable?: boolean;
-}
-interface TextStyleProps {
-  /** Color of a Text or Icon element */
-  color?: ForegroundColor;
-  /** Color of placeholder text */
-  placeholderColor?: ForegroundColor;
-  /** Font family for the text */
-  fontFamily?: TextVariant | FontAlias;
-  /** Font size of the text */
-  fontSize?: TextVariant;
-  /**
-   * Font weight of the text
-   *
-   * @deprecated Consider using an `emphasized` text variant instead. For example: `display1/emphasized`
-   */
-  fontWeight?: TextVariant | FontWeightDescriptive;
-  /** Line height of the text */
-  lineHeight?: TextVariant;
-  /** Text alignment of the text */
-  textAlign?: 'center' | 'justify' | 'start' | 'end';
-  /** Sets the text transform for the text  */
-  textTransform?: TextVariant | TextTransform;
-}
-interface BackgroundStyleProps {
-  /** Sets the background color. */
-  backgroundColor?: BackgroundColor;
-}
-type CustomSizingStyleProps = {
-  iconSize?: IconSize;
-  avatarSize?: AvatarSize;
-};
-interface SizeStyleProps {
-  /** Sets the width of an element. */
-  width?: 'full' | 'fit' | 'screen';
-  /** Sets the height of an element. */
-  height?: 'full' | 'fit' | 'screen';
-}
-type StyleProps = BackgroundStyleProps & BorderStyleProps & LayoutStyleProps & FlexStyleProps & SpacingStyleProps & TextStyleProps & ImageStyleProps & CustomSizingStyleProps & ShadowStyleProps & SizeStyleProps;
-interface UniversalBoxProps extends PropsWithChildren, BackgroundStyleProps, BorderStyleProps, FlexStyleProps, LayoutStyleProps, SpacingStyleProps, SizeStyleProps, ShadowStyleProps {
-  /**
-   * When asChild is set to true, the component's child will be cloned and passed
-   * the props and behavior required to make it functional.
-   */
-  asChild?: boolean;
-  /**
-   * Customize tag name.
-   */
-  as?: ElementType;
-}
-interface UniversalStackProps extends Omit<UniversalBoxProps, 'flexDirection'> {
-  gap?: SpacingAlias;
-  separator?: ReactNode | ((index: number) => ReactNode);
-}
-interface UniversalTextProps extends PropsWithChildren, TextStyleProps, UniversalBoxProps {
-  /** Style of text. */
-  variant?: TextVariant;
-  /** Color of the text. */
-  color?: ForegroundColor;
-}
-interface UniversalIconProps {
-  /** Icon to render from the icons package. */
-  name: SvgIcon;
-  /** Size of the icon. */
-  size?: IconSize;
-  /** Variant for icon. Either fill or outline. */
-  variant?: IconVariant;
-  /** Color of the icon. */
-  color?: ForegroundColor;
-}
-type SVGElementProps = Omit<React.HTMLAttributes<SVGSVGElement>, 'color'>;
-interface IconPropsWithSVGProps extends UniversalIconProps, SVGElementProps {}
-type IconSlotRenderProps = Omit<IconPropsWithSVGProps, 'name'>;
-/**
- * We are changing the slot prop from ReactNode to ReactElement to avoid
- * confusing and useless options like number and string, however,
- * there are cases where folks are using null/undefined to dynamically opt-out
- * of rendering the icon. We want to still allow that.
- */
-type BackwardsCompatibleReactElement = null | undefined | ReactElement;
-/**
- * Used anywhere we offer an icon which can be customized.
- *
- * Passing an SvgIcon is the happy path.
- *
- * @example
- * import { Calendar } from "@yahoo/uds-icons"
- * <IconSlot icon={Calendar} />
- */
-type UniversalIconSlot = SvgIcon | BackwardsCompatibleReactElement | ((iconProps: IconSlotRenderProps) => BackwardsCompatibleReactElement);
-interface UniversalPressableProps extends Omit<UniversalBoxProps, 'as'> {
-  onPress?: () => void;
-}
-interface UniversalIconButtonProps {
-  /**
-   * The variant of the button
-   * @default is assigned in the configurator
-   */
-  variant?: ButtonVariantFlat;
-  /** The size of the button. */
-  size?: IconButtonSize;
-  /** The icon variant
-   * @default 'outline'
-   */
-  iconVariant?: IconVariant;
-  /** Icon to render from the icons package. */
-  name: SvgIcon;
-  /** Allows setting the HTML `name` attribute on `button` because we are using `name` for an `SVGIcon` instead. */
-  htmlName?: string;
-  /** Render the button with a loading state. */
-  loading?: boolean;
-  /** Disable any motion effects configured in the configurator */
-  disableEffects?: boolean;
-}
-interface UniversalButtonProps extends Pick<SizeStyleProps, 'width'> {
-  /**
-   * The variant of the button
-   * @default is assigned in the configurator
-   */
-  variant?: ButtonVariantFlat;
-  /**
-   * The size of the button
-   * @default is assigned in the configurator
-   */
-  size?: ButtonSize;
-  /** The icon variant for start and end icons
-   * @default 'outline'
-   */
-  iconVariant?: IconVariant;
-  /** The icon to render at the start of the button. Can be a UDS icon, an Icon component, ReactNode, or a function that returns a ReactNode. */
-  startIcon?: UniversalIconSlot;
-  /** The icon to render at the end of the button. Can be a UDS icon, an Icon component, ReactNode, or a function that returns a ReactNode. */
-  endIcon?: UniversalIconSlot;
-  /** Render the button with a loading state. */
-  loading?: boolean;
-  /** Disable any motion effects configured in the configurator */
-  disableEffects?: boolean;
-  /**
-   * When asChild is set to true, the component's child will be cloned and passed
-   * the props and behavior required to make it functional.
-   */
-  asChild?: boolean;
-}
-interface UniversalImageProps extends Omit<UniversalBoxProps, 'width' | 'height'>, ImageStyleProps {
-  /** The source URL of the image. */
-  src: string;
-  /**  Provides fallback (alternate) text to display when the image specified by the Image element is not loaded. */
-  alt?: string;
-  /** Width of the image in px. */
-  width?: number;
-  /** Height of the image in pixel. */
-  height?: number;
-}
-type ImgElementProps = Omit<React.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
-interface ImagePropsWithImgProps extends UniversalImageProps, ImgElementProps {}
-interface UniversalFormLabelProps extends Omit<UniversalTextProps, 'variant' | 'color'> {
-  /**
-   * Customize tag name.
-   */
-  as?: ElementType;
-  /** The style of text. @default 'label2' */
-  variant?: UniversalTextProps['variant'] | 'inherit';
-  /** If true, renders a red asterisk to indicate the field is required. */
-  required?: boolean;
-  /**
-   * Sets the color of the label text.
-   * @default muted
-   */
-  color?: ForegroundColor | 'inherit';
-  /** If true, the required * is styled with an alert color if the input is required. */
-  hasError?: boolean;
-  /** Whether to show an asterisk on required labels. @default false */
-  showRequiredAsterisk?: boolean;
-  /** The contents of the label. If missing, uses children. **/
-  label?: string | ReactNode | (() => ReactNode);
-}
-interface UniversalInputProps extends Pick<UniversalBoxProps, 'width'> {
-  /** Label text to associate with the input. */
-  label?: string | ReactNode | (() => ReactNode);
-  /** If true, the input is disabled and non-interactive. */
-  disabled?: boolean;
-  /** If true, the `label` is displayed as required and the input element is required. */
-  required?: boolean;
-  /** Description or error message */
-  helpText?: string | ReactNode | (() => ReactNode);
-  /**  Helper text icon */
-  helperTextIcon?: UniversalIconSlot;
-  /** If true, the input displays its error state styling, which includes styling the startIcon.  */
-  hasError?: boolean;
-  /**
-   * The size of the input.
-   * @default 'md'
-   */
-  size?: InputSize;
-  /** An icon to be displayed at the start of the input. */
-  startIcon?: UniversalIconSlot;
-  /** An icon to be displayed at the end of the input. */
-  endIcon?: UniversalIconSlot;
-  /** If true, forces reduced motion. Otherwise, respects the user's setting. */
-  reduceMotion?: boolean;
-}
-type DividerVariant = 'primary' | 'secondary' | 'tertiary' | 'muted';
-interface UniversalDividerProps {
-  /**
-   * Use a pre-defined variant.
-   * @default 'primary'
-   */
-  variant?: DividerVariant;
-  /**
-   * Set to true to scale the divider vertically.
-   */
-  vertical?: boolean;
-  /** When there are children, where are they placed?
-   * @default 'center'
-   */
-  contentPosition?: 'start' | 'center' | 'end';
-}
-interface UniversalLinkProps {
-  /** Text style */
-  textVariant?: TextVariantWithoutEmphasized;
-  /** The color style of the link. */
-  variant?: Extract<ForegroundPaletteAlias, 'primary' | 'secondary' | 'tertiary' | 'on-color'>;
-  /** An icon to be displayed at the start of the component. */
-  startIcon?: UniversalIconSlot;
-  /** An icon to be displayed at the end of the component. */
-  endIcon?: UniversalIconSlot;
-}
-type CheckboxValue = boolean | 'indeterminate';
-type CheckboxVariant = 'primary' | 'secondary';
-type CheckboxSize = 'sm' | 'md';
-interface UniversalCheckboxProps {
-  /**
-   * Variant of the checkbox.
-   * @default 'primary'
-   */
-  variant?: CheckboxVariant;
-  /**
-   * Size of the checkbox.
-   * @default 'md'
-   */
-  size?: CheckboxSize;
-  /**
-   * The label of the checkbox. Can be a ReactNode for rich html labels.
-   * Will not be labelled if omitted. User MUST then use `aria-label` attribute,
-   * wrap in a `<label>` tag or `htmlFor` to add an external label for a11y.
-   */
-  label?: string | ReactNode | (() => ReactNode);
-  /**
-   * Controlled value of the checkbox. Will be an uncontrolled input if not present.
-   */
-  checked?: CheckboxValue;
-  /**
-   * If true, the checkbox displays its error state.
-   */
-  hasError?: boolean;
-  /**
-   * Disables animations when true.
-   */
-  reduceMotion?: boolean;
-  /**
-   * On which side of the input is the label displayed.
-   * @default 'start'
-   */
-  labelPosition?: 'start' | 'end';
-}
-type RadioValue = boolean;
-type RadioVariant = 'primary' | 'secondary';
-type RadioSize = 'sm' | 'md';
-interface UniversalRadioProps {
-  /**
-   * Variant of the radio.
-   * @default 'primary'
-   */
-  variant?: RadioVariant;
-  /**
-   * Size of the radio.
-   * @default 'md'
-   */
-  size?: RadioSize;
-  /**
-   * The label of the radio. Can be a ReactNode for rich html labels.
-   * Will not be labelled if omitted. User MUST then use `aria-label` attribute,
-   * wrap in a `<label>` tag or `htmlFor` to add an external label for a11y.
-   */
-  label?: string | ReactNode | (() => ReactNode);
-  /**
-   * The value of the radio.
-   * @default ''
-   */
-  value?: string;
-  /**
-   * Whether the radio is checked.
-   */
-  checked?: boolean;
-  /**
-   * If true, the radio displays its error state.
-   */
-  hasError?: boolean;
-  /**
-   * Disables animations when true.
-   */
-  reduceMotion?: boolean;
-  /**
-   * On which side of the input is the label displayed.
-   * @default 'start'
-   */
-  labelPosition?: 'start' | 'end';
-}
-interface UniversalRadioGroupProps {
-  /**
-   * The name used for all radio inputs in the group.
-   */
-  name?: string;
-  /**
-   * The value of the selected radio item.
-   */
-  value?: string;
-  /**
-   * The default value of the selected radio item for uncontrolled radio groups.
-   */
-  defaultValue?: string;
-  /** Callback when the user interacts to select a different radio item. */
-  onChange?: (value: string | undefined) => void;
-  /**
-   * When asChild is set to true, the component's child will be cloned and passed
-   * the props and behavior required to make it functional.
-   */
-  asChild?: boolean;
-}
-type SwitchSize = 'sm' | 'md';
-interface UniversalSwitchProps {
-  /**
-   * Size of the switch.
-   * @default 'md'
-   */
-  size?: SwitchSize;
-  /**
-   * The label of the switch. Can be a ReactNode for rich html labels.
-   * Will not be labelled if omitted. User MUST then use `aria-label` attribute,
-   * wrap in a `<label>` tag or `htmlFor` to add an external label for a11y.
-   */
-  label?: string | ReactNode | (() => ReactNode);
-  /**
-   * Controlled value of the switch. Will be an uncontrolled input if not present.
-   */
-  isOn?: boolean;
-  /**
-   * Set the initial value to default when uncontrolled.
-   */
-  defaultIsOn?: boolean;
-  /** An icon to be displayed on the on state of the input. */
-  onIcon?: UniversalIconSlot;
-  /** An icon to be displayed on the off state of the input. */
-  offIcon?: UniversalIconSlot;
-  /**
-   * Disables animations when true.
-   */
-  reduceMotion?: boolean;
-  /**
-   * On which side of the input is the label displayed.
-   * @default 'start'
-   */
-  labelPosition?: 'start' | 'end';
-}
-type ChipVariant = 'primary' | 'secondary' | 'brand' | 'brand-secondary';
-type ChipSize = 'sm' | 'md';
-interface UniversalChipBaseProps extends PropsWithChildren {
-  /**
-   * Controls the foreground and background contrast.
-   * @default "primary"
-   */
-  variant?: ChipVariant;
-  /**
-   * Adjusts padding and font size.
-   * @default "md"
-   */
-  size?: ChipSize;
-  /**
-   * Optional icon displayed at the start of the chip.
-   */
-  startIcon?: UniversalIconSlot;
-  /**
-   * Optional icon displayed at the end of the chip.
-   */
-  endIcon?: UniversalIconSlot;
-  /**
-   * Optional minimum width of the chip before label is truncated.
-   */
-  minWidth?: number;
-  /**
-   * Maximum width of the chip before label is truncated.
-   */
-  maxWidth?: number;
-  /**
-   * Customize tag name.
-   */
-  as?: ElementType;
-  /** If true, forces reduced motion. Otherwise, respects the user's setting. */
-  reduceMotion?: boolean;
-  /** Whether the chip is disabled. @default false */
-  disabled?: boolean;
-}
-interface UniversalChipDismissibleProps extends Omit<UniversalChipBaseProps, 'endIcon' | 'asChild' | 'layerClassNames'> {
-  /**
-   * Handler for dismiss action (e.g., closing the chip).
-   */
-  onDismiss?: () => void;
-  /**
-   * Provide an accessible label for the dismiss button.
-   */
-  dismissButtonAriaLabel?: string;
-  /**
-   * Custom icon to use for the dismiss button.
-   */
-  dismissIcon?: UniversalIconSlot;
-}
-interface UniversalChipToggleProps extends Omit<UniversalChipBaseProps, 'asChild' | 'layerClassNames'> {
-  isToggled?: boolean;
-  /**
-   * Handler for toggle action.
-   */
-  onToggle?: (isToggled: boolean) => void;
-}
-type UniversalChipButtonProps = Omit<UniversalChipToggleProps, 'isToggled' | 'onToggle' | 'asChild'>;
-interface UniversalChipLinkProps extends Omit<UniversalChipBaseProps, 'layerClassNames'> {
-  href?: string;
-}
-interface UniversalChipProps extends UniversalChipToggleProps, UniversalChipLinkProps, UniversalChipButtonProps, UniversalChipDismissibleProps {
-  linkProps?: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'type'>;
-}
-type BadgeVariant = 'primary' | 'secondary' | 'brand' | 'brand-secondary' | 'alert' | 'alert-secondary' | 'positive' | 'positive-secondary' | 'warning' | 'warning-secondary' | 'info' | 'info-secondary';
-type BadgeSize = 'xs' | 'sm' | 'md' | 'lg';
-interface UniversalBadgeProps extends PropsWithChildren {
-  /**
-   * Customize tag name.
-   */
-  as?: ElementType;
-  /**
-   * Controls the foreground and background contrast.
-   * @default "primary"
-   */
-  variant?: BadgeVariant;
-  /**
-   * Adjusts padding and font size.
-   * @default "md"
-   */
-  size?: BadgeSize;
-  /**
-   * CSS color override of the background. Defaults to variant definition.
-   */
-  backgroundColor?: string;
-  /**
-   * CSS color override of the text. Defaults to variant definition.
-   */
-  color?: string;
-  /**
-   * CSS color override of the icon. Defaults to variant definition.
-   */
-  iconColor?: string;
-  /**
-   * CSS color override of the border. Defaults to variant definition.
-   */
-  borderColor?: string;
-  /**
-   * Optional icon displayed at the start of the badge.
-   */
-  startIcon?: UniversalIconSlot;
-  /**
-   * Optional icon displayed at the end of the badge.
-   */
-  endIcon?: UniversalIconSlot;
-  /**
-   * Optional minium width of the badge.
-   */
-  minWidth?: number;
-  /**
-   * Maximum width of the badge before label is truncated.
-   */
-  maxWidth?: number | 'full';
-}
-type AvatarVariant = 'primary' | 'secondary';
-type AvatarAbbreviationStrategy = 'first' | 'last' | 'firstAndLast' | 'firstTwo' | 'firstThree' | 'firstOfEach' | ((name: string) => string);
-/** Props common to all Avatar variants */
-interface UniversalAvatarBaseProps {
-  /** Avatar size key. @default "md" */
-  size?: AvatarSize;
-  /** Avatar variant. @default "primary" */
-  variant?: 'primary' | 'secondary';
-  /** Custom size in pixels */
-  customSize?: number;
-  /** Abbreviation strategy for text variant. @default "firstAndLast" */
-  abbreviationStrategy?: AvatarAbbreviationStrategy;
-  /** Alt text for the image */
-  alt?: string;
-  /** Custom class name */
-  className?: string;
-}
-/** Props for Avatar image variant */
-interface UniversalAvatarImageProps extends UniversalAvatarBaseProps {
-  /** Source URL for the image */
-  src: string;
-  /** Optional srcSet for responsive images */
-  srcSet?: string;
-  /**
-   * Additional properties for the img element,
-   * excluding controlled attributes.
-   * @deprecated Use slotProps.image instead
-   */
-  imageProps?: Omit<ImagePropsWithImgProps, 'src' | 'srcSet' | 'alt' | 'className' | 'height' | 'width'>;
-  /** Fallback text if image fails to load */
-  fallback?: string;
-}
-/** Props for Avatar text variant */
-interface UniversalAvatarTextProps extends UniversalAvatarBaseProps {
-  /** Name for generating initials */
-  name?: string;
-  /** Predefined initials */
-  initials?: string;
-}
-/** Props for Avatar icon variant */
-interface UniversalAvatarIconProps extends Omit<UniversalAvatarBaseProps, 'abbreviationStrategy'> {
-  /** Optional icon override */
-  icon?: UniversalIconSlot;
-}
-/** Combined Avatar component props */
-type UniversalAvatarProps = UniversalAvatarImageProps;
-interface UniversalMenuItemProps extends Omit<UniversalPressableProps, 'asChild'>, PropsWithChildren {
-  /** The icon to show at the end */
-  endIcon?: UniversalIconSlot;
-  /** The icon to show at the start */
-  startIcon?: UniversalIconSlot;
-  /**
-   * The variant of text to use.
-   * @default label2 (label1 if checked)
-   */
-  textVariant?: TextVariant;
-  /** HTML name attribute */
-  name?: string;
-  /** Whether the item is in a checked/active state */
-  active?: boolean;
-  /** Whether the item is disabled */
-  disabled?: boolean;
-  /** Slots to customize the rendering */
-  slots?: {
-    root?: (props: HTMLAttributes<any> & {
-      ref?: Ref<any>;
-    }) => ReactNode;
-  };
-}
-//#endregion
-export { type AlwaysPalette, type AlwaysPaletteAlias, type AlwaysPaletteColor, type Animation, type AriaAttribute, type AvatarAbbreviationStrategy, type AvatarShape, type AvatarSize, type AvatarSizeConfig, type AvatarVariant, type BackgroundColor, type BackgroundPalette, type BackgroundPaletteAlias, type BackgroundStyleProps, type BadgeSize, type BadgeVariant, type BorderRadius, type BorderRadiusConfig, type BorderStyleProps, type BorderWidth, type BorderWidthConfig, type Breakpoint, type BreakpointWithBase, type BreakpointsConfig, type ButtonBaseConfig, type ButtonClassMap, type ButtonClassName, type ButtonColorConfig, type ButtonColorEffect, type ButtonColorEffectConfig, type ButtonColorProperty, type ButtonColorPropertyConfig, type ButtonConfig, type ButtonKind, type ButtonMotionEffect, type ButtonMotionProperty, type ButtonMotionPropertyConfig, type ButtonPalette, type ButtonPaletteColor, type ButtonPaletteConfig, type ButtonShadowPropertyConfig, type ButtonSize, type ButtonSizeConfig, type ButtonSizeProperty, type ButtonSpectrumColor, type ButtonState, type ButtonStateConfig, type ButtonStateEffectConfig, type ButtonVariant, type ButtonVariantConfig, type ButtonVariantFlat, type CheckboxSize, type CheckboxValue, type CheckboxVariant, type ChipSize, type ChipVariant, type ColorMode, type ColorModeConfig, type ColorModeForApp, type ColorsConfig, type ConfigurableDropShadowValues, type ConfigurableInsetShadowValues, type CustomSizingStyleProps, type DataAttribute, type Display, type DividerVariant, type Flex, type FlexAlignContent, type FlexAlignItems, type FlexAlignSelf, type FlexBasis, type FlexDirection, type FlexGrow, type FlexJustifyContent, type FlexShrink, type FlexStyleProps, type FlexWrap, type FontAlias, type FontConfig, type FontCssVar, type FontFamilyCDNUrl, type FontFamilyConfig, type FontID, type FontSize, type FontSizeConfig, type FontSlantConfig, type FontType, type FontWeightConfig, type FontWeightDescriptive, type FontWeightNumeric, type FontWidthConfig, type ForegroundColor, type ForegroundPalette, type ForegroundPaletteAlias, type GlobalDefaultsConfig, type HighContrastMode, type Hue, type HueStep, type IconButtonClassMap, type IconButtonClassName, type IconButtonConfig, type IconButtonDefaultsConfig, type IconButtonSize, type IconPropsWithSVGProps, type IconSize, type IconSizeConfig, type IconSlotRenderProps, type IconVariant, type ImagePropsWithImgProps, type ImageStyleProps, type InputSize, type LayoutStyleProps, type LetterSpacing, type LineClampAlias, type LineColor, type LineHeight, type LineHeightConfig, type LinePalette, type LinePaletteAlias, type Modes, type MotionConfig, type MotionCssVar, type MotionSpringConfig, type MotionSpringConfigOptions, type MotionVariant, type MotionVariantSpeed, type MotionVariantValues, type OpacityStep, type Overflow, type Palette, type PaletteConfig, type PaletteType, type PaletteValue, type Percentage, type PercentageUnit, type PixelsUnit, type PlatformMode, type Position, type PropertyToPaletteAliasMap, type RadioSize, type RadioValue, type RadioVariant, type RegionMode, type RemsUnit, type ScaleConfig, type ScaleEffectMap, type ScaleMode, type ScaleModeConfig, type ScaleModeForApp, type ShadowColor, type ShadowColorConfig, type ShadowConfig, type ShadowOffset, type ShadowOpacity, type ShadowPalette, type ShadowPaletteAlias, type ShadowPreset, type ShadowSpreadRadius, type ShadowStyleProps, type ShadowType, type ShadowTypeConfig, type ShadowVariant, type ShadowVariantConfig, type ShadowVariantInvert, type ShadowVariantWithInvert, type SharedPaletteAlias, type SpacingAlias, type SpacingConfig, type SpacingStyleProps, type SpectrumColor, type SpectrumConfig, type StateStyleProps, type StyleProps, type SwitchSize, type TShirtSize, type TShirtSizeCommon, type TextDecorationLine, type TextProperty, type TextStyleProps, type TextTransform, type TextTransformConfig, type TextVariant, type TextVariantTypography, type TextVariantUi, type TextVariantWithoutEmphasized, type TransitionDelay, type TransitionDuration, type TransitionTiming, type TypographyConfig, type TypographyResponsiveProperty, type TypographyStyle, type TypographyStyleProperty, type TypographyUnitValue, type UdsCssVar, type UnitlessUnit, type UniversalAvatarIconProps, type UniversalAvatarImageProps, type UniversalAvatarProps, type UniversalAvatarTextProps, type UniversalBadgeProps, type UniversalBoxProps, type UniversalButtonProps, type UniversalCheckboxProps, type UniversalChipBaseProps, type UniversalChipButtonProps, type UniversalChipDismissibleProps, type UniversalChipLinkProps, type UniversalChipProps, type UniversalChipToggleProps, type UniversalDividerProps, type UniversalFormLabelProps, type UniversalIconButtonProps, type UniversalIconProps, type UniversalIconSlot, type UniversalImageProps, type UniversalInputProps, type UniversalLinkProps, type UniversalMenuItemProps, type UniversalPressableProps, type UniversalRadioGroupProps, type UniversalRadioProps, type UniversalStackProps, type UniversalSwitchProps, type UniversalTextProps, type UniversalTokensConfig, type UniversalTokensConfigAuto };
-//# sourceMappingURL=types.d.cts.map