@yahoo/uds 2.11.0 → 3.0.0

package/dist/index.d.cts

@@ -1,42 +1,23 @@
-import * as react from 'react';
-import { Ref, Dispatch, SetStateAction } from 'react';
-import { q as UniversalBoxProps, r as UniversalStackProps, s as UniversalIconProps, t as UniversalImageProps, u as UniversalTextProps } from './types-DPT0rst4.cjs';
-export { A as AVATAR_SIZE_PREFIX, a4 as AlwaysPalette, a5 as AlwaysPaletteAlias, a6 as Animation, a7 as AriaAttribute, a8 as AvatarShape, a9 as AvatarSize, aa as AvatarSizeConfig, x as BORDER_RADIUS_PREFIX, y as BORDER_WIDTH_PREFIX, a0 as BUTTON_CSS_VAR_MAP, ab as BackgroundColor, ac as BackgroundPalette, ad as BackgroundPaletteAlias, ae as BackgroundStyleProps, af as BorderRadius, ag as BorderRadiusConfig, ah as BorderStyleProps, ai as BorderWidth, aj as BorderWidthConfig, ak as BoxShadowConfig, al as ButtonBaseConfig, i as ButtonClassMap, am as ButtonClassName, an as ButtonColorConfig, ao as ButtonColorEffect, ap as ButtonColorEffectConfig, j as ButtonColorProperty, k as ButtonColorPropertyConfig, B as ButtonConfig, aq as ButtonKind, ar as ButtonMotionEffect, as as ButtonMotionProperty, at as ButtonMotionPropertyConfig, au as ButtonPalette, av as ButtonPaletteColor, aw as ButtonPaletteConfig, ax as ButtonSize, ay as ButtonSizeConfig, az as ButtonSizeProperty, aA as ButtonSpectrumColor, aB as ButtonState, aC as ButtonStateConfig, aD as ButtonStateEffectConfig, aE as ButtonVariant, aF as ButtonVariantConfig, C as ColorMode, aG as ColorModeConfig, aH as ColorModeForApp, a as ColorsConfig, aI as CorePalette, aJ as CorePaletteAlias, aK as CustomSizingStyleProps, N as DARK_COLOR_MODE_CLASSNAME, _ as DEFAULT_COLOR_MODE_CLASSNAME, $ as DEFAULT_SCALE_MODE_CLASSNAME, aL as DataAttribute, aM as Display, aN as DividerVariant, a3 as FONT_DECLARATIONS_MAP, z as FONT_FAMILY_PREFIX, D as FONT_SIZE_PREFIX, E as FONT_WEIGHT_PREFIX, aO as Flex, aP as FlexAlignContent, aQ as FlexAlignItems, aR as FlexAlignSelf, aS as FlexBasis, aT as FlexDirection, aU as FlexGrow, aV as FlexJustifyContent, aW as FlexShrink, aX as FlexStyleProps, aY as FlexWrap, aZ as FontAlias, p as FontConfig, a_ as FontCssVar, o as FontDeclarationConfig, a$ as FontFamilyCDNUrl, b0 as FontFamilyConfig, n as FontID, b1 as FontSize, b2 as FontSizeConfig, b3 as FontType, F as FontWeightConfig, b4 as FontWeightDescriptive, d as FontWeightNumeric, b5 as ForegroundColor, b6 as ForegroundPalette, b7 as ForegroundPaletteAlias, b8 as HighContrastMode, H as Hue, b as HueStep, a1 as ICON_BUTTON_CSS_VAR_MAP, G as ICON_SIZE_PREFIX, I as IconButtonClassMap, b9 as IconButtonClassName, ba as IconButtonConfig, bb as IconButtonDefaultsConfig, bc as IconButtonSize, bd as IconSizeConfig, be as ImageStyleProps, V as LARGE_SCALE_MODE_CLASSNAME, O as LIGHT_COLOR_MODE_CLASSNAME, L as LINE_HEIGHT_PREFIX, bf as LayoutStyleProps, bg as LetterSpacing, bh as LineClampAlias, bi as LineColor, bj as LineHeight, bk as LineHeightConfig, bl as LinePalette, bm as LinePaletteAlias, R as MEDIUM_SCALE_MODE_CLASSNAME, J as MOTION_PREFIX, bn as Modes, m as MotionConfig, bo as MotionCssVar, bp as MotionSpringConfig, l as MotionSpringConfigOptions, M as MotionVariant, h as MotionVariantSpeed, bq as MotionVariantValues, br as Overflow, a2 as PSEUDO_STYLE_SELECTOR_MAP, bs as Palette, c as PaletteConfig, P as PaletteType, bt as PaletteValue, bu as PlatformMode, bv as Position, bw as PropertyToPaletteAliasMap, bx as RegionMode, Q as SMALL_SCALE_MODE_CLASSNAME, K as SPECTRUM_COLOR_PREFIX, by as ScaleConfig, bz as ScaleEffectMap, S as ScaleMode, bA as ScaleModeConfig, bB as ScaleModeForApp, bC as SpacingAlias, bD as SpacingAliasWithNegatives, bE as SpacingConfig, bF as SpacingStyleProps, bG as SpectrumColor, bH as SpectrumConfig, bI as StateStyleProps, bJ as StyleProps, T as TEXT_TRANSFORM_PREFIX, bS as TShirtSize, bT as TShirtSizeCommon, bK as TextProperty, bL as TextStyleProps, bM as TextTransform, bN as TextTransformConfig, bO as TextVariant, bP as TransitionDelay, bQ as TransitionDuration, bR as TransitionTiming, w as UDS_PREFIX, bU as UdsCssVar, bV as UniversalAvatarProps, e as UniversalButtonProps, bW as UniversalDividerProps, f as UniversalIconButtonProps, g as UniversalPressableProps, bX as UniversalTextInputProps, U as UniversalTokensConfig, W as XLARGE_SCALE_MODE_CLASSNAME, X as XSMALL_SCALE_MODE_CLASSNAME, Y as XXLARGE_SCALE_MODE_CLASSNAME, Z as XXXLARGE_SCALE_MODE_CLASSNAME, v as alwaysPalette } from './types-DPT0rst4.cjs';
+import { D as DivProps, I as InputProps } from './VStack-GpQHE4xQ.cjs';
+export { B as Box, a as BoxProps, b as Divider, c as DividerProps, V as VStack, d as VStackProps } from './VStack-GpQHE4xQ.cjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-export { Button, ButtonProps, IconButton, IconButtonProps, Pressable, PressableProps, SpringMotionConfig, SpringMotionConfigProps } from '@yahoo/uds/client';
-export { Combination, CombinationsConfig, DEFAULT_COLOR_MODE, DEFAULT_COLOR_MODE_FOR_APP, DEFAULT_HIGH_CONTRAST_MODE, DEFAULT_REGION_MODE, DEFAULT_SCALE_MODE, DEFAULT_SCALE_MODE_FOR_APP, button, defaultTokensConfig, entries, fontWeightMap, fromEntries, generateConfigCombinations, getDefaultButtonBaseMap, mapValues, variants } from './tokens/index.cjs';
+import { r as UniversalFormLabelProps, f as UniversalStackProps, s as IconPropsWithSVGProps, t as ImagePropsWithImgProps, u as UniversalIconSlot, v as UniversalLinkProps, w as UniversalTextProps } from './types-d2CfR7zp.cjs';
+export { A as AVATAR_SIZE_PREFIX, ad as AlwaysPalette, ae as AlwaysPaletteAlias, af as AlwaysPaletteColor, ag as Animation, ah as AriaAttribute, ai as AvatarAbbreviationStrategy, aj as AvatarShape, ak as AvatarSize, al as AvatarSizeConfig, am as AvatarVariant, D as BORDER_RADIUS_PREFIX, E as BORDER_WIDTH_PREFIX, a5 as BUTTON_CSS_VAR_MAP, an as BackgroundColor, ao as BackgroundPalette, ap as BackgroundPaletteAlias, aq as BackgroundStyleProps, ar as BadgeSize, as as BadgeVariant, at as BorderRadius, au as BorderRadiusConfig, av as BorderStyleProps, aw as BorderWidth, ax as BorderWidthConfig, ay as ButtonBaseConfig, i as ButtonClassMap, az as ButtonClassName, aA as ButtonColorConfig, aB as ButtonColorEffect, aC as ButtonColorEffectConfig, j as ButtonColorProperty, k as ButtonColorPropertyConfig, B as ButtonConfig, aD as ButtonKind, aE as ButtonMotionEffect, aF as ButtonMotionProperty, aG as ButtonMotionPropertyConfig, aH as ButtonPalette, aI as ButtonPaletteColor, aJ as ButtonPaletteConfig, aK as ButtonShadowPropertyConfig, aL as ButtonSize, aM as ButtonSizeConfig, aN as ButtonSizeProperty, aO as ButtonSpectrumColor, aP as ButtonState, aQ as ButtonStateConfig, aR as ButtonStateEffectConfig, aS as ButtonVariant, aT as ButtonVariantConfig, aU as ButtonVariantFlat, aV as CheckboxSize, aW as CheckboxValue, aX as CheckboxVariant, aY as ChipSize, aZ as ChipVariant, C as ColorMode, a_ as ColorModeConfig, a$ as ColorModeForApp, a as ColorsConfig, b0 as ConfigurableDropShadowValues, b1 as ConfigurableInsetShadowValues, b2 as CustomSizingStyleProps, W as DARK_COLOR_MODE_CLASSNAME, a3 as DEFAULT_COLOR_MODE_CLASSNAME, a4 as DEFAULT_SCALE_MODE_CLASSNAME, b3 as DataAttribute, b4 as Display, b5 as DividerVariant, a8 as FONT_DECLARATIONS_MAP, G as FONT_FAMILY_PREFIX, J as FONT_SIZE_PREFIX, L as FONT_SLANT_PREFIX, K as FONT_WEIGHT_PREFIX, N as FONT_WIDTH_PREFIX, b6 as Flex, b7 as FlexAlignContent, b8 as FlexAlignItems, b9 as FlexAlignSelf, ba as FlexBasis, bb as FlexDirection, bc as FlexGrow, bd as FlexJustifyContent, be as FlexShrink, bf as FlexStyleProps, bg as FlexWrap, bh as FontAlias, a9 as FontAxisConfig, m as FontConfig, bi as FontCssVar, aa as FontDeclarationConfig, l as FontDeclarationItemConfig, ab as FontDeclarationMap, bj as FontFamilyCDNUrl, bk as FontFamilyConfig, F as FontID, bl as FontSize, bm as FontSizeConfig, bn as FontSlantConfig, bo as FontType, bp as FontWeightConfig, bq as FontWeightDescriptive, ac as FontWeightForFont, br as FontWeightNumeric, bs as FontWidthConfig, bt as ForegroundColor, bu as ForegroundPalette, bv as ForegroundPaletteAlias, bw as HighContrastMode, H as Hue, b as HueStep, a6 as ICON_BUTTON_CSS_VAR_MAP, O as ICON_SIZE_PREFIX, I as IconButtonClassMap, bx as IconButtonClassName, by as IconButtonConfig, bz as IconButtonDefaultsConfig, bA as IconButtonSize, bB as IconSizeConfig, bC as ImageStyleProps, bD as InputSize, $ as LARGE_SCALE_MODE_CLASSNAME, X as LIGHT_COLOR_MODE_CLASSNAME, Q as LINE_HEIGHT_PREFIX, bE as LayoutStyleProps, bF as LetterSpacing, bG as LineClampAlias, bH as LineColor, bI as LineHeight, bJ as LineHeightConfig, bK as LinePalette, bL as LinePaletteAlias, _ as MEDIUM_SCALE_MODE_CLASSNAME, R as MOTION_PREFIX, bM as Modes, p as MotionConfig, bN as MotionCssVar, bO as MotionSpringConfig, o as MotionSpringConfigOptions, M as MotionVariant, n as MotionVariantSpeed, bP as MotionVariantValues, bQ as Overflow, a7 as PSEUDO_STYLE_SELECTOR_MAP, bR as Palette, c as PaletteConfig, P as PaletteType, bS as PaletteValue, bT as PlatformMode, bU as Position, bV as PropertyToPaletteAliasMap, bW as RadioSize, bX as RadioValue, bY as RadioVariant, bZ as RegionMode, Z as SMALL_SCALE_MODE_CLASSNAME, T as SPECTRUM_COLOR_PREFIX, b_ as ScaleConfig, b$ as ScaleEffectMap, S as ScaleMode, c0 as ScaleModeConfig, c1 as ScaleModeForApp, c2 as ShadowColor, c3 as ShadowColorConfig, c4 as ShadowConfig, c5 as ShadowOffset, c6 as ShadowOpacity, c7 as ShadowPalette, c8 as ShadowPaletteAlias, d as ShadowPreset, c9 as ShadowSpreadRadius, ca as ShadowStyleProps, q as ShadowType, cb as ShadowTypeConfig, cc as ShadowVariant, cd as ShadowVariantConfig, ce as ShadowVariantInvert, cf as ShadowVariantWithInvert, cg as SharedPaletteAlias, ch as SpacingAlias, ci as SpacingConfig, cj as SpacingStyleProps, ck as SpectrumColor, cl as SpectrumConfig, cm as StateStyleProps, cn as StyleProps, co as SwitchSize, V as TEXT_TRANSFORM_PREFIX, cx as TShirtSize, cy as TShirtSizeCommon, cp as TextProperty, cq as TextStyleProps, cr as TextTransform, cs as TextTransformConfig, ct as TextVariant, cu as TransitionDelay, cv as TransitionDuration, cw as TransitionTiming, z as UDS_PREFIX, cz as UdsCssVar, cA as UniversalAvatarIconProps, cB as UniversalAvatarImageProps, cC as UniversalAvatarProps, cD as UniversalAvatarTextProps, cE as UniversalBadgeProps, e as UniversalBoxProps, cF as UniversalButtonProps, cG as UniversalCheckboxProps, cH as UniversalChipBaseProps, cI as UniversalChipButtonProps, cJ as UniversalChipDismissibleProps, cK as UniversalChipLinkProps, cL as UniversalChipProps, cM as UniversalChipToggleProps, g as UniversalDividerProps, cN as UniversalIconButtonProps, cO as UniversalIconProps, cP as UniversalImageProps, h as UniversalInputProps, cQ as UniversalMenuItemProps, cR as UniversalPressableProps, cS as UniversalRadioGroupProps, cT as UniversalRadioProps, cU as UniversalSwitchProps, U as UniversalTokensConfig, cV as UniversalTokensConfigAuto, a0 as XLARGE_SCALE_MODE_CLASSNAME, Y as XSMALL_SCALE_MODE_CLASSNAME, a1 as XXLARGE_SCALE_MODE_CLASSNAME, a2 as XXXLARGE_SCALE_MODE_CLASSNAME, x as alwaysPalette, y as defaultUniversalTokensConfigAuto } from './types-d2CfR7zp.cjs';
+import * as react from 'react';
+import { PropsWithChildren, Ref, Dispatch, SetStateAction } from 'react';
+export { Avatar, AvatarIcon, AvatarIconProps, AvatarImage, AvatarImageProps, AvatarProps, AvatarText, AvatarTextProps, Badge, BadgeProps, Button, ButtonProps, Checkbox, CheckboxProps, Chip, ChipButton, ChipButtonProps, ChipDismissible, ChipDismissibleProps, ChipLink, ChipLinkProps, ChipProps, ChipToggle, ChipToggleProps, IconButton, IconButtonProps, Input, InputProps, Menu, MenuContentProps, MenuDividerProps, MenuItemCheckboxProps, MenuItemProps, MenuPlacement, MenuProviderProps, MenuTriggerProps, Pressable, PressableProps, Radio, RadioGroupProvider, RadioGroupProviderProps, RadioProps, SpringMotionConfig, SpringMotionConfigProps, Switch, SwitchProps } from '@yahoo/uds/client';
+export { AllSelectors, BaseSelector, CssStyleObject, DEFAULT_COLOR_MODE, DEFAULT_COLOR_MODE_FOR_APP, DEFAULT_HIGH_CONTRAST_MODE, DEFAULT_REGION_MODE, DEFAULT_SCALE_MODE, DEFAULT_SCALE_MODE_FOR_APP, ParentVariantSelector, button, cartesianProduct, coalesceConfigVariant, defaultTokensConfig, entries, fontWeightMap, fromEntries, generateKeyFromFlatConfigPath, generateSchemaKey, getConfigDefaultValue, getConfigPseudoStateVariables, getConfigPseudoStateVariablesWithSetter, getConfigSubcomponents, getConfigVariantComponentStates, getConfigVariantComponentStatesMatrix, getConfigVariantProperties, getConfigVariantPseudoStates, getConfigVariants, getDefaultButtonBaseMap, isConfigDefaultValue, mapValues, parseButtonVariantFlat, parseDeprecatedButtonPaletteVariant, setConfigPseudoStateVariable, shadow, variants } from './tokens/index.cjs';
+export { AvatarConfig, BadgeConfig, CheckboxConfig, ChipConfig, DividerConfig, InputConfig, LinkConfig, MenuConfig, RadioConfig, SwitchConfig } from './tokens/automation/configs.cjs';
+export { A as AllPossibleProperties, j as AllVariantKeys, i as AutoComponentName, h as AutoComponents, g as ComponentConfig, b as ComponentStateConfig, C as ConfigurablePropertiesName, L as LayerConfig, P as PossibleStates, a as PossibleStatesWithRest, k as SchemaStateValue, S as SelectedConfigurableProperty, d as SubComponentConfig, V as VariantConfig, f as VariantConfigWithComponentStates, e as VariantConfigWithProperties, c as configurableProperties, r as createComponentStateConfig, w as createComponentStates, p as createConfigurableProperty, x as createLayerConfig, y as createSubComponentConfig, q as createVariantConfig, v as createVariantConfigWithComponentStates, u as createVariantConfigWithProperties, l as findFixtureType, m as generateClassName, n as generateDeclaration, o as generateStyles, s as statePseudoMapDocsMode, t as toMinimalDbConfigObject } from './index-DUFUMc1S.cjs';
 export { IconSize, IconVariant } from '@yahoo/uds-icons/types';
 import 'motion/react';
+import 'type-fest';
+import '@yahoo/uds/fixtures';
 
-type DivProps = React.HTMLAttributes<HTMLDivElement>;
-interface BoxProps extends UniversalBoxProps, DivProps {
+type HtmlLabelProps = Omit<React.LabelHTMLAttributes<HTMLLabelElement>, 'color'>;
+interface FormLabelProps extends UniversalFormLabelProps, PropsWithChildren, HtmlLabelProps {
 }
-/**
- * **📦 A layout component that can be used to compose other components**
- *
- * @description
- * The most simple component we ship - a div. But with all the power of the UDS design system.
- * By default, `Box` is a flexbox container. When working with vertical or horizontal layouts,
- * consider using [VStack](./v-stack) or [HStack](./h-stack) respectively.
- *
- * @example
- * ```tsx
- * import { Box } from '@yahoo/uds';
- *
- * <Box backgroundColor="primary" spacing="6">
- *   Any kind of content can go here!
- * </Box>
- * ```
- *
- * @usage
- * - If you need to div-like container to apply padding, shapes, or other styling.
- * - If you're creating card components.
- *
- * @see The {@link https://uds.build/docs/components/box Box Docs} for more info
- *
- * @related [HStack](https://uds.build/docs/components/h-stack), [VStack](https://uds.build/docs/components/v-stack)
- */
-declare const Box: react.ForwardRefExoticComponent<BoxProps & react.RefAttributes<HTMLDivElement>>;
+declare const FormLabel: ({ htmlFor, required, label, children, color, variant, hasError, showRequiredAsterisk, as, className, ...rest }: FormLabelProps) => react_jsx_runtime.JSX.Element | null;
 
 interface HStackProps extends UniversalStackProps, DivProps {
 }
@@ -71,9 +52,6 @@ interface HStackProps extends UniversalStackProps, DivProps {
  **/
 declare const HStack: react.ForwardRefExoticComponent<HStackProps & react.RefAttributes<HTMLDivElement>>;
 
-type SVGElementProps = Omit<React.HTMLAttributes<SVGSVGElement>, 'color'>;
-interface IconProps extends UniversalIconProps, SVGElementProps {
-}
 /**
  * **🎨 A component for displaying icons**
  *
@@ -103,11 +81,8 @@ interface IconProps extends UniversalIconProps, SVGElementProps {
  *
  * @related [IconButton](https://uds.build/docs/components/icon-button)
  */
-declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<SVGSVGElement>>;
+declare const Icon: react.ForwardRefExoticComponent<IconPropsWithSVGProps & react.RefAttributes<SVGSVGElement>>;
 
-type NativeImageProps = Omit<React.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
-interface ImageProps extends NativeImageProps, UniversalImageProps {
-}
 /**
  * **📸 A component for displaying images**
  *
@@ -131,15 +106,74 @@ interface ImageProps extends NativeImageProps, UniversalImageProps {
  *
  * @related [Box](https://uds.build/docs/components/box)
  */
-declare function Image({ width: imageWidth, height: imageHeight, src, alt, contentFit, backgroundColor, borderRadius, borderTopStartRadius, borderTopEndRadius, borderBottomStartRadius, borderBottomEndRadius, borderColor, borderStartColor, borderEndColor, borderTopColor, borderBottomColor, borderWidth, borderVerticalWidth, borderHorizontalWidth, borderStartWidth, borderEndWidth, borderTopWidth, borderBottomWidth, alignContent, alignItems, alignSelf, flex, flexDirection, flexGrow, flexShrink, flexWrap, justifyContent, flexBasis, display, overflow, overflowX, overflowY, position, spacing, spacingHorizontal, spacingVertical, spacingBottom, spacingEnd, spacingStart, spacingTop, offset, offsetVertical, offsetHorizontal, offsetBottom, offsetEnd, offsetStart, offsetTop, columnGap, rowGap, ...props }: ImageProps): react_jsx_runtime.JSX.Element;
+declare function Image({ width: imageWidth, height: imageHeight, src, alt, contentFit, backgroundColor, borderRadius, borderTopStartRadius, borderTopEndRadius, borderBottomStartRadius, borderBottomEndRadius, borderColor, borderStartColor, borderEndColor, borderTopColor, borderBottomColor, borderWidth, borderVerticalWidth, borderHorizontalWidth, borderStartWidth, borderEndWidth, borderTopWidth, borderBottomWidth, alignContent, alignItems, alignSelf, flex, flexDirection, flexGrow, flexShrink, flexWrap, justifyContent, flexBasis, display, overflow, overflowX, overflowY, position, spacing, spacingHorizontal, spacingVertical, spacingBottom, spacingEnd, spacingStart, spacingTop, offset, offsetVertical, offsetHorizontal, offsetBottom, offsetEnd, offsetStart, offsetTop, columnGap, rowGap, ...props }: ImagePropsWithImgProps): react_jsx_runtime.JSX.Element;
+
+interface InputHelpTextProps extends PropsWithChildren {
+    /** Icon to render at the start of the content */
+    startIcon?: UniversalIconSlot;
+    /** Icon to render at the end of the content */
+    endIcon?: UniversalIconSlot;
+    /**
+     * Props to pass to the start/end icon. If color is not provided, the icons
+     * will inherit the color from the `color` prop.
+     */
+    iconProps?: Pick<IconPropsWithSVGProps, 'color' | 'size' | 'variant'>;
+    size?: InputProps['size'];
+    isFilled?: boolean;
+}
+declare function InputHelpText({ startIcon, endIcon, iconProps, children, size, isFilled, ...rest }: InputHelpTextProps): react_jsx_runtime.JSX.Element;
+declare const InputHelpTextMemo: react.MemoExoticComponent<typeof InputHelpText>;
+
+type HTMLAnchorProps = React.AnchorHTMLAttributes<HTMLAnchorElement>;
+interface LinkProps extends HTMLAnchorProps, UniversalLinkProps {
+    /** The link's destination. */
+    href?: string;
+    /** Anchor rel property. @default "noopener" **/
+    rel?: string;
+    /** If true, forces an underline to always be shown for a11y purposes.  @default false */
+    alwaysUnderline?: boolean;
+}
+/**
+ * A Link provides navigation or actionable functionality by linking users to
+ * another location within an application, an external resource, or triggering
+ * specific in-page interactions (i.e. scroll-to-section).
+ *
+ * @componentType Client component
+ *
+ * @description
+ * A link component provides navigation or actionable functionality by linking users to another location within an application, an external resource, or triggering specific in-page interactions (i.e. scroll-to-section). This is different than a “button” link which is a button component without a border or fill.
+ *
+ * @see
+ * Check out the {@link https://uds.build/docs/components/link Link Docs} for more info
+ *
+ * @usage
+ * - Provide a way for users to navigate to another location.
+ * - Provide a trigger for in-page interactions.
+ *
+ * @example
+ * ```tsx
+ * 'use client';
+ * import { Link } from '@yahoo/uds';
+ * import { Share, Link as LinkIcon } from '@yahoo/uds-icons';
+ *
+ * <Link href="#">My Link</Link>
+ * <Link href="#" startIcon={Share} />
+ * <Link href="https://yahoo.com" target="_blank" endIcon={LinkIcon} />
+ *```
+ **/
+declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLAnchorElement>>;
 
-type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
+type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
+type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
+type VariantWithInherit = Exclude<UniversalTextProps['variant'], undefined> | 'inherit';
 type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TagName;
-} & JSX.IntrinsicElements[TagName] & UniversalTextProps;
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & JSX.IntrinsicElements[TagName] & Omit<UniversalTextProps, 'variant' | 'color'>;
 /**
  * **💬 A text element that can be used to display text**
  *
@@ -175,64 +209,44 @@ declare const Text: react.ForwardRefExoticComponent<(Omit<{
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLElement> & react.HTMLAttributes<HTMLElement> & UniversalTextProps, "ref"> | Omit<{
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLElement> & react.HTMLAttributes<HTMLElement> & Omit<UniversalTextProps, "color" | "variant">, "ref"> | Omit<{
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLParagraphElement> & react.HTMLAttributes<HTMLParagraphElement> & UniversalTextProps, "ref"> | Omit<{
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLLabelElement> & react.LabelHTMLAttributes<HTMLLabelElement> & Omit<UniversalTextProps, "color" | "variant">, "ref"> | Omit<{
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLHeadingElement> & react.HTMLAttributes<HTMLHeadingElement> & UniversalTextProps, "ref"> | Omit<{
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLHeadingElement> & react.HTMLAttributes<HTMLHeadingElement> & Omit<UniversalTextProps, "color" | "variant">, "ref"> | Omit<{
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLLabelElement> & react.LabelHTMLAttributes<HTMLLabelElement> & UniversalTextProps, "ref"> | Omit<{
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLLIElement> & react.LiHTMLAttributes<HTMLLIElement> & Omit<UniversalTextProps, "color" | "variant">, "ref"> | Omit<{
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLLIElement> & react.LiHTMLAttributes<HTMLLIElement> & UniversalTextProps, "ref"> | Omit<{
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLParagraphElement> & react.HTMLAttributes<HTMLParagraphElement> & Omit<UniversalTextProps, "color" | "variant">, "ref"> | Omit<{
     /** Ref passed to the inner container. */
     ref?: Ref<HTMLElement>;
     /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
     as?: TextElementTagName | undefined;
-} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & UniversalTextProps, "ref">) & react.RefAttributes<HTMLElement>>;
-
-type VStackProps = UniversalStackProps & DivProps;
-/**
- * **🥞 A layout component that arranges its children in rows using flexbox**
- *
- * @description
- * VStack is a layout component that arranges its children in rows using [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)
- * and can be used to compose larger layouts. VStack is similar to [Box](./box) but provides additional features like a `gap` property to
- * add spacing between children.
- *
- * @example
- * ```tsx
- * import { VStack, Text } from '@yahoo/uds';
- *
- * <VStack gap="6">
- *   <Text variant="body1" color="primary">First</Text>
- *   <Text variant="body1" color="primary">Second</Text>
- *   <Text variant="body1" color="primary">Third</Text>
- * </VStack>
- * ```
- *
- * @usage
- * - Create a column of items, optionally with gaps between.
- * - Create rows that are sized to their content (height only). By default each child will fill the width of the VStack.
- * - Create rows that fill the available space within the parent container.
- * - Create rows of proportionate size to each other (also known as a ratio-based layout).
- *
- * @see The {@link https://uds.build/docs/components/v-stack VStack Docs} for more info
- *
- * @related [Box](https://uds.build/docs/components/box), [HStack](https://uds.build/docs/components/h-stack)
- **/
-declare const VStack: react.ForwardRefExoticComponent<UniversalStackProps & DivProps & react.RefAttributes<HTMLDivElement>>;
+    variant?: VariantWithInherit;
+    color?: ColorWithInherit;
+} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & Omit<UniversalTextProps, "color" | "variant">, "ref">) & react.RefAttributes<HTMLElement>>;
 
 type StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T;
 type CvaStyleValue<T> = T | CvaStyleArray<T> | Record<string, unknown> | null | boolean | undefined;
@@ -270,57 +284,158 @@ interface CX<T> {
 declare const cx: CX<string>;
 declare const cva: CVA<string>;
 declare const getStylesInternal: (props?: ({
-    color?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "transparent" | "white" | "black" | "current" | undefined;
-    placeholderColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "transparent" | "white" | "black" | "current" | undefined;
-    fontFamily?: "serif" | "sans" | "mono" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "sans-alt" | "serif-alt" | undefined;
-    fontSize?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
-    fontWeight?: "black" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "bold" | "extrabold" | undefined;
-    lineHeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
+    avatarSizeRoot?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    avatarSizeIcon?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    avatarTextVariantRoot?: "primary" | "secondary" | undefined;
+    avatarImageVariantRoot?: "primary" | "secondary" | undefined;
+    avatarIconVariantRoot?: "primary" | "secondary" | undefined;
+    badgeSizeRoot?: "xs" | "sm" | "md" | "lg" | undefined;
+    badgeSizeIcon?: "xs" | "sm" | "md" | "lg" | undefined;
+    badgeVariantRoot?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | undefined;
+    badgeVariantIcon?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | undefined;
+    checkboxSizeRoot?: "sm" | "md" | undefined;
+    checkboxSizeCheckbox?: "sm" | "md" | undefined;
+    checkboxVariantValueRoot?: "checked" | "unchecked" | "indeterminate" | undefined;
+    checkboxVariantRoot?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    checkboxVariantValueCheckbox?: "checked" | "unchecked" | "indeterminate" | undefined;
+    checkboxVariantCheckbox?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    checkboxVariantValueCheckboxIcon?: "checked" | "unchecked" | "indeterminate" | undefined;
+    checkboxVariantCheckboxIcon?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    chipSizeRoot?: "sm" | "md" | undefined;
+    chipToggleVariantActiveRoot?: "on" | "off" | undefined;
+    chipToggleVariantRoot?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    chipToggleVariantActiveIcon?: "on" | "off" | undefined;
+    chipToggleVariantIcon?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    chipDismissibleVariantRoot?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    chipDismissibleVariantIcon?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    chipLinkVariantRoot?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    chipLinkVariantIcon?: "primary" | "secondary" | "brand" | "brand-secondary" | undefined;
+    dividerVariantRoot?: "primary" | "secondary" | "tertiary" | "muted" | undefined;
+    dividerVariantLine?: "primary" | "secondary" | "tertiary" | "muted" | undefined;
+    dividerVariantLabel?: "primary" | "secondary" | "tertiary" | "muted" | undefined;
+    inputSizeRoot?: "md" | "lg" | undefined;
+    inputSizeInputWrapper?: "md" | "lg" | undefined;
+    inputSizeInput?: "md" | "lg" | undefined;
+    inputSizeStartIcon?: "md" | "lg" | undefined;
+    inputSizeEndIcon?: "md" | "lg" | undefined;
+    inputSizeLabel?: "md" | "lg" | undefined;
+    inputSizeHelperIcon?: "md" | "lg" | undefined;
+    inputSizeHelperText?: "md" | "lg" | undefined;
+    inputVariantValueRoot?: "filled" | "empty" | undefined;
+    inputVariantRoot?: "default" | undefined;
+    inputVariantValueInputWrapper?: "filled" | "empty" | undefined;
+    inputVariantInputWrapper?: "default" | undefined;
+    inputVariantValueInput?: "filled" | "empty" | undefined;
+    inputVariantInput?: "default" | undefined;
+    inputVariantValueInputPlaceholder?: "filled" | "empty" | undefined;
+    inputVariantInputPlaceholder?: "default" | undefined;
+    inputVariantValueStartIcon?: "filled" | "empty" | undefined;
+    inputVariantStartIcon?: "default" | undefined;
+    inputVariantValueEndIcon?: "filled" | "empty" | undefined;
+    inputVariantEndIcon?: "default" | undefined;
+    inputVariantValueLabel?: "filled" | "empty" | undefined;
+    inputVariantLabel?: "default" | undefined;
+    inputVariantValueLabelRequired?: "filled" | "empty" | undefined;
+    inputVariantLabelRequired?: "default" | undefined;
+    inputVariantValueHelperIcon?: "filled" | "empty" | undefined;
+    inputVariantHelperIcon?: "default" | undefined;
+    inputVariantValueHelperText?: "filled" | "empty" | undefined;
+    inputVariantHelperText?: "default" | undefined;
+    linkTextStyleRoot?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | undefined;
+    linkTextStyleIcon?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | undefined;
+    linkVariantRoot?: "primary" | "secondary" | "tertiary" | "on-color" | undefined;
+    linkVariantIconStart?: "primary" | "secondary" | "tertiary" | "on-color" | undefined;
+    linkVariantIconEnd?: "primary" | "secondary" | "tertiary" | "on-color" | undefined;
+    menuSizeRoot?: "default" | undefined;
+    menuSizeStartIcon?: "default" | undefined;
+    menuSizeEndIcon?: "default" | undefined;
+    menuItemVariantActiveRoot?: "on" | "off" | undefined;
+    menuItemVariantRoot?: "default" | undefined;
+    menuItemVariantActiveText?: "on" | "off" | undefined;
+    menuItemVariantText?: "default" | undefined;
+    menuItemVariantActiveIcon?: "on" | "off" | undefined;
+    menuItemVariantIcon?: "default" | undefined;
+    menuItemCheckboxVariantActiveRoot?: "on" | "off" | undefined;
+    menuItemCheckboxVariantRoot?: "default" | undefined;
+    menuItemCheckboxVariantActiveText?: "on" | "off" | undefined;
+    menuItemCheckboxVariantText?: "default" | undefined;
+    menuItemCheckboxVariantActiveStartIcon?: "on" | "off" | undefined;
+    menuItemCheckboxVariantStartIcon?: "default" | undefined;
+    menuItemCheckboxVariantActiveEndIcon?: "on" | "off" | undefined;
+    menuItemCheckboxVariantEndIcon?: "default" | undefined;
+    menuDividerVariantRoot?: "default" | undefined;
+    menuDividerVariantText?: "default" | undefined;
+    radioVariantValueRoot?: "checked" | "unchecked" | undefined;
+    radioVariantRoot?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    radioVariantValueRadio?: "checked" | "unchecked" | undefined;
+    radioVariantRadio?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    radioVariantValueRadioCircle?: "checked" | "unchecked" | undefined;
+    radioVariantRadioCircle?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
+    radioSizeRoot?: "sm" | "md" | undefined;
+    radioSizeRadio?: "sm" | "md" | undefined;
+    switchVariantActiveRoot?: "on" | "off" | undefined;
+    switchVariantRoot?: "default" | undefined;
+    switchVariantActiveSwitch?: "on" | "off" | undefined;
+    switchVariantSwitch?: "default" | undefined;
+    switchVariantActiveHandle?: "on" | "off" | undefined;
+    switchVariantHandle?: "default" | undefined;
+    switchVariantActiveHandleIcon?: "on" | "off" | undefined;
+    switchVariantHandleIcon?: "default" | undefined;
+    switchSizeRoot?: "sm" | "md" | undefined;
+    switchSizeSwitch?: "sm" | "md" | undefined;
+    switchSizeHandle?: "sm" | "md" | undefined;
+    switchSizeHandleIcon?: "sm" | "md" | undefined;
+    color?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "on-color" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    placeholderColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "on-color" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    fontFamily?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "serif" | "sans" | "mono" | "sans-alt" | "serif-alt" | undefined;
+    fontSize?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | undefined;
+    fontWeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "thin" | "black" | "extralight" | "light" | "regular" | "medium" | "semibold" | "bold" | "extrabold" | undefined;
+    lineHeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | undefined;
     textAlign?: "center" | "end" | "start" | "justify" | undefined;
-    textTransform?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | undefined;
-    spacing?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingHorizontal?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingVertical?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingBottom?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingEnd?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingStart?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    spacingTop?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offset?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetVertical?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetHorizontal?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetBottom?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetEnd?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetStart?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    offsetTop?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    columnGap?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    rowGap?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "14" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
-    backgroundColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "transparent" | "white" | "black" | "current" | undefined;
-    borderColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "transparent" | "white" | "black" | "current" | undefined;
-    borderStartColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "transparent" | "white" | "black" | "current" | undefined;
-    borderEndColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "transparent" | "white" | "black" | "current" | undefined;
-    borderBottomColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "transparent" | "white" | "black" | "current" | undefined;
-    borderTopColor?: "brand" | "accent" | "alert" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "transparent" | "white" | "black" | "current" | undefined;
-    borderRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
-    borderTopStartRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
-    borderTopEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
-    borderBottomStartRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
-    borderBottomEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
-    borderWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderVerticalWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderHorizontalWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderStartWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderEndWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderTopWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    borderBottomWidth?: "thin" | "medium" | "none" | "thick" | undefined;
-    avatarSize?: "sm" | "md" | "lg" | undefined;
+    textTransform?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | undefined;
+    spacing?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingHorizontal?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingVertical?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingBottom?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingEnd?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingStart?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    spacingTop?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offset?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetVertical?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetHorizontal?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetBottom?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetEnd?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetStart?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    offsetTop?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    columnGap?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    rowGap?: "6" | "7" | "10" | "12" | "16" | "2" | "0.5" | "4" | "1" | "1.5" | "8" | "2.5" | "5" | "3" | "3.5" | "0" | "9" | "11" | "14" | "px" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
+    backgroundColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderStartColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderEndColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderBottomColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderTopColor?: "primary" | "secondary" | "brand" | "brand-secondary" | "alert" | "alert-secondary" | "warning" | "warning-secondary" | "positive" | "positive-secondary" | "info" | "info-secondary" | "tertiary" | "muted" | "accent" | "transparent" | "white" | "black" | "current" | undefined;
+    borderRadius?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
+    borderTopStartRadius?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
+    borderTopEndRadius?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
+    borderBottomStartRadius?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
+    borderBottomEndRadius?: "xs" | "sm" | "md" | "lg" | "xl" | "full" | "none" | undefined;
+    borderWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderVerticalWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderHorizontalWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderStartWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderEndWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderTopWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    borderBottomWidth?: "thin" | "none" | "medium" | "thick" | undefined;
+    avatarSize?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
     iconSize?: "sm" | "md" | "lg" | undefined;
     alignContent?: "center" | "flex-end" | "flex-start" | "stretch" | "space-between" | "space-around" | undefined;
     alignItems?: "center" | "flex-end" | "flex-start" | "baseline" | "stretch" | undefined;
     alignSelf?: "center" | "flex-end" | "flex-start" | "baseline" | "stretch" | "auto" | undefined;
     flex?: "1" | "none" | "initial" | "auto" | undefined;
     flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
-    flexGrow?: "0" | "1" | "2" | "3" | undefined;
-    flexShrink?: "0" | "1" | undefined;
+    flexGrow?: "2" | "1" | "3" | "0" | undefined;
+    flexShrink?: "1" | "0" | undefined;
     flexWrap?: "nowrap" | "wrap" | "wrap-reverse" | undefined;
     justifyContent?: "center" | "flex-end" | "flex-start" | "space-between" | "space-around" | "space-evenly" | undefined;
     flexBasis?: "min-content" | undefined;
@@ -332,12 +447,14 @@ declare const getStylesInternal: (props?: ({
     contentFit?: "none" | "fill" | "cover" | "contain" | "scale-down" | undefined;
     colorMode?: "light" | "dark" | undefined;
     scaleMode?: "medium" | "xSmall" | "small" | "large" | "xLarge" | "xxLarge" | "xxxLarge" | undefined;
-    buttonPalette?: "brand" | "accent" | "alert" | "positive" | "warning" | undefined;
+    buttonPalette?: "brand" | "alert" | "warning" | "positive" | "info" | "accent" | undefined;
     buttonVariant?: "primary" | "secondary" | "tertiary" | undefined;
     buttonSize?: "sm" | "md" | "lg" | undefined;
     iconButtonSize?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
     width?: "full" | "fit" | "screen" | undefined;
     height?: "full" | "fit" | "screen" | undefined;
+    dropShadow?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "none" | undefined;
+    insetShadow?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "2xl-invert" | "none" | "md-invert" | "xl-invert" | "xs-invert" | "sm-invert" | "lg-invert" | undefined;
 } & {
     className?: string | undefined;
 }) | undefined) => string;
@@ -346,4 +463,4 @@ declare const getStyles: (props: GetStylesInternalProps) => string;
 
 type SetState<T> = Dispatch<SetStateAction<T>>;
 
-export { Box, type BoxProps, HStack, type HStackProps, Icon, type IconProps, Image, type ImageProps, type SetState, Text, type TextProps, UniversalBoxProps, UniversalIconProps, UniversalImageProps, UniversalStackProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles };
+export { FormLabel, type FormLabelProps, HStack, type HStackProps, Icon, IconPropsWithSVGProps as IconProps, IconPropsWithSVGProps, Image, ImagePropsWithImgProps as ImageProps, ImagePropsWithImgProps, InputHelpTextMemo as InputHelpText, type InputHelpTextProps, Link, type LinkProps, type SetState, Text, type TextProps, UniversalFormLabelProps, UniversalIconSlot, UniversalLinkProps, UniversalStackProps, UniversalTextProps, cva, cx, getStyles };