@sanity/ui 3.0.0-static.0 → 3.0.0-static.10

package/dist/index.d.ts

@@ -1,52 +1,73 @@
 import {AvatarSize} from '@sanity/ui/theme'
 import {BaseTheme as BaseTheme_2} from '@sanity/ui/theme'
+import {Display as BoxDisplay} from '@sanity/ui/css'
+import {BoxHeight} from '@sanity/ui/css'
+import {BoxOverflow} from '@sanity/ui/css'
+import {BoxSizing} from '@sanity/ui/css'
 import {BoxStyleProps} from '@sanity/ui/css'
+import {ButtonStyleProps} from '@sanity/ui/css'
+import {CardContextValue as CardContextValue_2} from './types'
 import {CardStyleProps as CardStyleProps_2} from '@sanity/ui/css'
 import {Component} from 'react'
+import type {ComponentProps} from 'react'
+import {ComponentType} from 'react'
 import {ContainerStyleProps} from '@sanity/ui/css'
 import {Context} from 'react'
 import {createColorTheme as createColorTheme_2} from '@sanity/ui/theme'
 import {CSSObject} from '@sanity/ui/theme'
-import {DetailedHTMLProps} from 'react'
+import {DisplayStyleProps} from '@sanity/ui/css'
+import {ElementProps as ElementProps_2} from '../..'
 import {ElementType} from 'react'
-import {FastOmit} from 'styled-components'
+import {ErrorInfo} from 'react'
 import {FlexAlign} from '@sanity/ui/css'
 import {FlexDirection} from '@sanity/ui/css'
 import {FlexJustify} from '@sanity/ui/css'
+import {FlexStyleProps} from '@sanity/ui/css'
 import {FlexValue} from '@sanity/ui/css'
 import {FlexWrap} from '@sanity/ui/css'
+import {FontCodeSize} from '@sanity/ui/theme'
+import {FontHeadingSize} from '@sanity/ui/theme'
+import {FontLabelSize} from '@sanity/ui/theme'
+import {FontStyleProps} from '@sanity/ui/css'
 import {FontTextSize} from '@sanity/ui/theme'
-import {FontWeight} from '@sanity/ui/theme'
+import {ForwardedRef} from 'react'
 import {ForwardRefExoticComponent} from 'react'
 import {GapStyleProps} from '@sanity/ui/css'
+import {GridAutoCols} from '@sanity/ui/css'
+import {GridAutoFlow} from '@sanity/ui/css'
+import {GridAutoRows} from '@sanity/ui/css'
 import {GridItemColumn} from '@sanity/ui/css'
 import {GridItemColumnEnd} from '@sanity/ui/css'
 import {GridItemColumnStart} from '@sanity/ui/css'
 import {GridItemRow} from '@sanity/ui/css'
 import {GridItemRowEnd} from '@sanity/ui/css'
 import {GridItemRowStart} from '@sanity/ui/css'
+import {HeadingStyleProps} from '@sanity/ui/css'
 import {hexToRgb as hexToRgb_2} from '@sanity/ui/theme'
 import {HSL as HSL_2} from '@sanity/ui/theme'
 import {hslToRgb as hslToRgb_2} from '@sanity/ui/theme'
-import {HTMLAttributes} from 'react'
-import {HTMLProps} from 'react'
-import {IStyledComponentBase} from 'styled-components/dist/types'
-import {MemoExoticComponent} from 'react'
+import {InputStyleProps} from '@sanity/ui/css'
+import {InsetStyleProps} from '@sanity/ui/css'
+import {JSX} from 'react'
+import {LabelSize} from '@sanity/ui/css'
 import {multiply as multiply_2} from '@sanity/ui/theme'
 import {MutableRefObject} from 'react'
 import {NamedExoticComponent} from 'react'
 import {PaddingStyleProps} from '@sanity/ui/css'
 import {parseColor as parseColor_2} from '@sanity/ui/theme'
 import {PartialThemeColorBuilderOpts} from '@sanity/ui/theme'
+import {PolymorphicProps as PolymorphicProps_2} from '../..'
 import {PositionStyleProps} from '@sanity/ui/css'
 import {PropsWithChildren} from 'react'
+import {px} from '@sanity/ui/css'
 import {Radius} from '@sanity/ui/theme'
 import {RadiusStyleProps} from '@sanity/ui/css'
 import {ReactElement} from 'react'
 import {ReactNode} from 'react'
-import {Ref} from 'react'
+import {ReactPortal} from 'react'
 import {RefAttributes} from 'react'
 import {RefCallback} from 'react'
+import {rem} from '@sanity/ui/css'
 import {ResponsiveProp} from '@sanity/ui/css'
 import {RGB as RGB_2} from '@sanity/ui/theme'
 import {rgba as rgba_2} from '@sanity/ui/theme'
@@ -54,10 +75,17 @@ import {rgbToHex as rgbToHex_2} from '@sanity/ui/theme'
 import {rgbToHsl as rgbToHsl_2} from '@sanity/ui/theme'
 import {RootTheme as RootTheme_2} from '@sanity/ui/theme'
 import {screen as screen_3} from '@sanity/ui/theme'
+import {SelectStyleProps} from '@sanity/ui/css'
+import {ShadowStyleProps} from '@sanity/ui/css'
+import {SkeletonStyleProps} from '@sanity/ui/css'
 import {Space} from '@sanity/ui/theme'
+import {TextAlign} from '@sanity/ui/css'
+import {TextAreaStyleProps} from '@sanity/ui/css'
+import {TextOverflowStyleProps} from '@sanity/ui/css'
 import {TextStyleProps} from '@sanity/ui/css'
 import {Theme as Theme_2} from '@sanity/ui/theme'
 import {Theme_v2} from '@sanity/ui/theme'
+import {Theme_v3} from '@sanity/ui/theme'
 import {ThemeAvatar} from '@sanity/ui/theme'
 import {ThemeBoxShadow} from '@sanity/ui/theme'
 import {ThemeColor} from '@sanity/ui/theme'
@@ -104,22 +132,18 @@ import {ThemeShadow as ThemeShadow_2} from '@sanity/ui/theme'
 import {ThemeStyles} from '@sanity/ui/theme'
 import {Width} from '@sanity/ui/css'
 
-/** @beta */
-export declare type ArrayPropPrimitive = string | number | boolean | undefined | null
-
 /** @internal */
 export declare const Arrow: ForwardRefExoticComponent<
-  Omit<
-    {
-      width: number
-      height: number
-      radius?: number
-    } & Omit<HTMLProps<HTMLDivElement>, 'height' | 'width'>,
-    'ref'
-  > &
-    RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, 'radius' | 'height' | 'width'> & {
+    width: number
+    height: number
+    radius?: number
+  } & RefAttributes<HTMLDivElement>
 >
 
+/** @public */
+export declare type Assign<T, U> = Omit<T, keyof U> & U
+
 /**
  * @internal
  */
@@ -132,30 +156,20 @@ export declare function attemptFocus(element: HTMLElement): boolean
  * @public
  */
 export declare const Autocomplete: <Option extends BaseAutocompleteOption>(
-  props: AutocompleteProps<Option> &
-    Omit<
-      HTMLProps<HTMLInputElement>,
-      | 'aria-activedescendant'
-      | 'aria-autocomplete'
-      | 'aria-expanded'
-      | 'aria-owns'
-      | 'as'
-      | 'autoCapitalize'
-      | 'autoComplete'
-      | 'autoCorrect'
-      | 'id'
-      | 'inputMode'
-      | 'onChange'
-      | 'onSelect'
-      | 'prefix'
-      | 'ref'
-      | 'role'
-      | 'spellCheck'
-      | 'type'
-      | 'value'
-    > & {
-      ref?: Ref<HTMLInputElement>
-    },
+  props: Omit<
+    Props<AutocompleteProps<Option>, 'input'>,
+    | 'aria-activedescendant'
+    | 'aria-autocomplete'
+    | 'aria-expanded'
+    | 'aria-owns'
+    | 'autoCapitalize'
+    | 'autoComplete'
+    | 'autoCorrect'
+    | 'inputMode'
+    | 'role'
+    | 'spellCheck'
+    | 'type'
+  >,
 ) => ReactElement
 
 /**
@@ -190,8 +204,7 @@ export declare type AutocompleteMsg =
 /**
  * @public
  */
-export declare type AutocompleteOpenButtonProps = Omit<ButtonProps, 'as'> &
-  Omit<React.HTMLProps<HTMLButtonElement>, 'as' | 'ref'>
+export declare type AutocompleteOpenButtonProps = Omit<Props<ButtonProps, 'button'>, 'as'>
 
 /**
  * @public
@@ -201,6 +214,7 @@ export declare interface AutocompleteProps<
 > {
   border?: boolean
   customValidity?: string
+  disabled?: boolean
   filterOption?: (query: string, option: Option) => boolean
   fontSize?: ResponsiveProp<FontTextSize>
   icon?: ElementType | ReactNode
@@ -218,24 +232,25 @@ export declare interface AutocompleteProps<
   /** The options to render. */
   options?: Option[]
   padding?: ResponsiveProp<Space>
-  popover?: Omit<PopoverProps, 'content' | 'onMouseEnter' | 'onMouseLeave' | 'open'> &
-    Omit<HTMLProps<HTMLDivElement>, 'as' | 'children' | 'content' | 'ref' | 'width'>
+  popover?: Omit<Props<PopoverProps, 'div'>, 'content' | 'onMouseEnter' | 'onMouseLeave' | 'open'>
   prefix?: ReactNode
   radius?: Radius | Radius[]
+  readOnly?: boolean
+  ref?: ForwardedRef<HTMLInputElement>
   /** @beta */
   relatedElements?: HTMLElement[]
   /** The callback function for rendering each option. */
-  renderOption?: (option: Option) => ReactElement
+  renderOption?: (option: Option) => React.JSX.Element
   /** @beta */
   renderPopover?: (
     props: {
-      content: ReactElement | null
+      content: React.JSX.Element | null
       hidden: boolean
       inputElement: HTMLInputElement | null
       onMouseEnter: () => void
       onMouseLeave: () => void
     },
-    ref: Ref<HTMLDivElement>,
+    ref: ForwardedRef<HTMLDivElement>,
   ) => ReactNode
   renderValue?: (value: string, option?: Option) => string
   suffix?: ReactNode
@@ -314,22 +329,27 @@ export declare interface AutocompleteValueChangeMsg {
  * @public
  */
 export declare const Avatar: ForwardRefExoticComponent<
-  AvatarProps & Omit<HTMLProps<HTMLDivElement>, 'ref' | 'as'> & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof AvatarProps> &
+    AvatarProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
 export declare const AvatarCounter: ForwardRefExoticComponent<
-  AvatarCounterProps & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof AvatarCounterProps> &
+    AvatarCounterProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface AvatarCounterProps {
+export declare interface AvatarCounterProps
+  extends Omit<BoxProps, 'align' | 'className' | 'display' | 'justify' | 'paddingX' | 'sizing'> {
   count: number
-  size?: AvatarSize | AvatarSize[]
+  size?: ResponsiveProp<AvatarSize>
   /** @deprecated No longer supported. */
   tone?: 'navbar'
 }
@@ -347,11 +367,10 @@ export declare interface AvatarProps {
   __unstable_hideInnerStroke?: boolean
   animateArrowFrom?: AvatarPosition
   arrowPosition?: AvatarPosition
-  as?: React.ElementType | keyof JSX.IntrinsicElements
   color?: ThemeColorAvatarColorKey
   initials?: string
   onImageLoadError?: (event: Error) => void
-  size?: AvatarSize | AvatarSize[]
+  size?: ResponsiveProp<AvatarSize>
   src?: string
   /**
    * The status of the entity this Avatar represents.
@@ -374,16 +393,28 @@ export {AvatarSize}
  * @public
  */
 export declare const AvatarStack: ForwardRefExoticComponent<
-  AvatarStackProps & Omit<HTMLProps<HTMLDivElement>, 'ref' | 'as'> & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof AvatarStackProps> &
+    AvatarStackProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface AvatarStackProps {
-  children: React.ReactNode
+export declare type AvatarStackChild =
+  | ReactElement<Props<AvatarProps, 'div'>>
+  | null
+  | undefined
+  | false
+
+/**
+ * @public
+ */
+export declare interface AvatarStackProps
+  extends Omit<BoxProps, 'align' | 'className' | 'display'> {
+  children: AvatarStackChild | AvatarStackChild[]
   maxLength?: number
-  size?: AvatarSize | AvatarSize[]
+  size?: ResponsiveProp<AvatarSize>
   /** @deprecated No longer supported. */
   tone?: 'navbar'
 }
@@ -402,7 +433,9 @@ export declare type AvatarStatus = 'online' | 'editing' | 'inactive'
  * @public
  */
 export declare const Badge: ForwardRefExoticComponent<
-  Omit<BadgeProps & HTMLProps<HTMLDivElement>, 'ref'> & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof BadgeProps> &
+    BadgeProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
@@ -415,10 +448,10 @@ export declare type BadgeMode = 'default' | 'outline'
  * @public
  */
 export declare interface BadgeProps extends BoxProps, RadiusStyleProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
   fontSize?: number | number[]
   /** @deprecated No longer used. */
   mode?: BadgeMode
+  textAlign?: TextProps['align']
   tone?: BadgeTone
 }
 
@@ -451,9 +484,7 @@ export declare interface BoundaryElementContextValue {
 /**
  * @public
  */
-export declare function BoundaryElementProvider(
-  props: BoundaryElementProviderProps,
-): React.ReactElement
+export declare function BoundaryElementProvider(props: BoundaryElementProviderProps): ReactElement
 
 export declare namespace BoundaryElementProvider {
   var displayName: string
@@ -463,7 +494,7 @@ export declare namespace BoundaryElementProvider {
  * @public
  */
 export declare interface BoundaryElementProviderProps {
-  children: React.ReactNode
+  children: ReactNode
   element: HTMLElement | null
 }
 
@@ -474,32 +505,25 @@ export declare interface BoundaryElementProviderProps {
  * @public
  */
 export declare const Box: ForwardRefExoticComponent<
-  Omit<BoxProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'width' | 'wrap' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof BoxProps> &
+    BoxProps &
     RefAttributes<HTMLDivElement>
 >
 
-/**
- * @public
- */
-export declare type BoxDisplay = 'none' | 'block' | 'grid' | 'flex' | 'inline-block'
+export {BoxDisplay}
 
-/**
- * @public
- */
-export declare type BoxHeight = 'stretch' | 'fill'
+export {BoxHeight}
 
-/**
- * @public
- */
-export declare type BoxOverflow = 'visible' | 'hidden' | 'auto'
+export {BoxOverflow}
 
 /**
  * @public
  */
-export declare interface BoxProps extends BoxStyleProps, GapStyleProps, PositionStyleProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  forwardedAs?: React.ElementType | keyof JSX.IntrinsicElements
-}
+export declare interface BoxProps
+  extends BoxStyleProps,
+    GapStyleProps,
+    InsetStyleProps,
+    PositionStyleProps {}
 
 /**
  * @public
@@ -507,18 +531,15 @@ export declare interface BoxProps extends BoxStyleProps, GapStyleProps, Position
  */
 export declare type BoxShadow = ThemeBoxShadow
 
-/**
- * @public
- */
-export declare type BoxSizing = 'content' | 'border'
+export {BoxSizing}
 
 /**
  * @beta
  */
 export declare const Breadcrumbs: ForwardRefExoticComponent<
-  BreadcrumbsProps &
-    Omit<HTMLProps<HTMLOListElement>, 'type' | 'ref' | 'as'> &
-    RefAttributes<HTMLOListElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof BreadcrumbsProps> &
+    BreadcrumbsProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
@@ -527,7 +548,7 @@ export declare const Breadcrumbs: ForwardRefExoticComponent<
 export declare interface BreadcrumbsProps extends GapStyleProps {
   expandButton?: Omit<ButtonProps, 'onClick' | 'selected'>
   maxLength?: number
-  separator?: React.ReactNode
+  separator?: ReactNode
   /** @deprecated - Use `gap`, `gapX`, `gapY` instead */
   space?: number | number[]
 }
@@ -536,42 +557,46 @@ export declare interface BreadcrumbsProps extends GapStyleProps {
  * @public
  */
 export declare const Button: ForwardRefExoticComponent<
-  Omit<
-    ButtonProps & Omit<HTMLProps<HTMLButtonElement>, 'height' | 'width' | 'wrap' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'button'> & PolymorphicProps_2, keyof ButtonProps> &
+    ButtonProps &
     RefAttributes<HTMLButtonElement>
 >
 
 /**
  * @public
+ * @deprecated Use `ThemeColorButtonModeKey` instead
  */
 export declare type ButtonMode = ThemeColorButtonModeKey_2
 
 /**
  * @public
  */
-export declare interface ButtonProps extends PaddingStyleProps, RadiusStyleProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  fontSize?: ResponsiveProp<FontTextSize>
-  mode?: ButtonMode
-  icon?: React.ElementType | React.ReactNode
-  iconRight?: React.ElementType | React.ReactNode
-  justify?: ResponsiveProp<FlexJustify>
-  /**
-   * @beta Do not use in production, as this might change.
-   */
-  loading?: boolean
-  selected?: boolean
-  space?: ResponsiveProp<Space>
-  textAlign?: ButtonTextAlign
-  muted?: boolean
-  text?: React.ReactNode
-  textOverflow?: TextProps['textOverflow']
-  textWeight?: TextProps['weight']
-  tone?: ButtonTone
-  type?: 'button' | 'reset' | 'submit'
-  width?: ResponsiveProp<Width>
+export declare interface ButtonProps
+  extends ButtonStyleProps,
+    DisplayStyleProps,
+    FlexStyleProps,
+    GapStyleProps,
+    PaddingStyleProps {
+  'data-ui'?: string
+  'fontSize'?: ResponsiveProp<FontTextSize>
+  'href'?: string
+  'mode'?: ButtonMode
+  'icon'?: ElementType | ReactNode
+  'iconRight'?: ElementType | ReactNode
+  /** @beta Do not use in production, as this might change.*/
+  'loading'?: boolean
+  'selected'?: boolean
+  /** @deprecated Use `gap` instead. */
+  'space'?: ResponsiveProp<Space>
+  'textAlign'?: ButtonTextAlign
+  'muted'?: boolean
+  'target'?: string
+  'text'?: ReactNode
+  'textOverflow'?: TextProps['textOverflow']
+  'textWeight'?: TextProps['weight']
+  'tone'?: ButtonTone
+  'type'?: 'button' | 'reset' | 'submit'
+  'width'?: ResponsiveProp<Width>
 }
 
 /**
@@ -581,6 +606,7 @@ export declare type ButtonTextAlign = 'left' | 'right' | 'center'
 
 /**
  * @public
+ * @deprecated Use `ThemeColorStateToneKey` instead
  */
 export declare type ButtonTone = ThemeColorStateToneKey
 
@@ -597,10 +623,25 @@ export declare type ButtonWidth = 'fill'
  * @public
  */
 export declare const Card: ForwardRefExoticComponent<
-  Omit<CardProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'width' | 'wrap' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof CardProps> &
+    CardProps &
     RefAttributes<HTMLDivElement>
 >
 
+export declare type CardCompatProviderComponent = ComponentType<{
+  children?: ReactNode
+  tone: ThemeColorCardToneKey
+  scheme: ThemeColorSchemeKey_2
+}>
+
+/** @internal */
+export declare interface CardContextValue {
+  compat_provider?: CardCompatProviderComponent
+  rendered: boolean
+  tone: ThemeColorCardToneKey
+  scheme: ThemeColorSchemeKey_2
+}
+
 /**
  * @public
  */
@@ -615,20 +656,30 @@ export declare interface CardProps extends BoxProps, CardStyleProps_2 {
    * @beta
    */
   __unstable_focusRing?: boolean
-  muted?: boolean
+  disabled?: boolean
+  href?: string
   pressed?: boolean
-  scheme?: ThemeColorSchemeKey_2
-  tone?: CardTone
+  selected?: boolean
+  target?: string
 }
 
+export declare function CardProvider(props: {
+  compat_provider?: CardCompatProviderComponent
+  children?: ReactNode
+  rendered?: boolean
+  tone: ThemeColorCardToneKey
+  scheme: ThemeColorSchemeKey_2
+}): JSX.Element
+
 /**
  * @internal
+ * @deprecated Use `CardStyleProps` from `@sanity/ui/css` instead.
  */
 export declare interface CardStyleProps {
   $checkered: boolean
   $focusRing: boolean
   $muted: boolean
-  $tone: ThemeColorToneKey
+  $tone: ThemeColorCardToneKey
 }
 
 /**
@@ -642,7 +693,8 @@ export declare type CardTone = ThemeColorCardToneKey | 'inherit'
  * @public
  */
 export declare const Checkbox: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & CheckboxProps, 'ref'> &
+  Omit<ElementProps_2<'input'> & PolymorphicProps_2, keyof CheckboxProps> &
+    CheckboxProps &
     RefAttributes<HTMLInputElement>
 >
 
@@ -678,19 +730,18 @@ export declare type ClickOutsideListener = (event: MouseEvent) => void
  * @public
  */
 export declare const Code: ForwardRefExoticComponent<
-  Omit<CodeProps & Omit<HTMLProps<HTMLPreElement>, 'size' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'pre'> & PolymorphicProps_2, keyof CodeProps> &
+    CodeProps &
     RefAttributes<HTMLPreElement>
 >
 
 /**
  * @public
  */
-export declare interface CodeProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
+export declare interface CodeProps extends Omit<FontStyleProps, 'align'> {
   /** Define the language to use for syntax highlighting. */
   language?: string
   size?: number | number[]
-  weight?: FontWeight
 }
 
 /**
@@ -698,10 +749,8 @@ export declare interface CodeProps {
  * @beta
  */
 export declare const CodeSkeleton: ForwardRefExoticComponent<
-  Omit<
-    CodeSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'size' | 'children' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof CodeSkeletonProps> &
+    CodeSkeletonProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -710,7 +759,7 @@ export declare const CodeSkeleton: ForwardRefExoticComponent<
  * @beta
  */
 export declare interface CodeSkeletonProps extends SkeletonProps {
-  size?: number | number[]
+  size?: ResponsiveProp<FontCodeSize>
 }
 
 /**
@@ -722,10 +771,10 @@ export declare function ConditionalWrapper({
   condition,
   wrapper,
 }: {
-  children: React.ReactNode
+  children: ReactNode
   condition: boolean
-  wrapper: (children: React.ReactNode) => React.ReactNode
-}): React.ReactNode
+  wrapper: (children: ReactNode) => ReactNode
+}): ReactNode
 
 export declare namespace ConditionalWrapper {
   var displayName: string
@@ -737,7 +786,8 @@ export declare namespace ConditionalWrapper {
  * @public
  */
 export declare const Container: ForwardRefExoticComponent<
-  Omit<ContainerProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'width' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof ContainerProps> &
+    ContainerProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -773,10 +823,8 @@ export declare type Delay =
  * @public
  */
 export declare const Dialog: ForwardRefExoticComponent<
-  Omit<
-    DialogProps & Omit<HTMLProps<HTMLDivElement>, 'id' | 'height' | 'width' | 'wrap' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof DialogProps> &
+    DialogProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -803,7 +851,10 @@ export declare type DialogPosition = 'absolute' | 'fixed'
 /**
  * @public
  */
-export declare interface DialogProps extends PaddingStyleProps, ContainerStyleProps {
+export declare interface DialogProps
+  extends ContainerStyleProps,
+    PaddingStyleProps,
+    ShadowStyleProps {
   /**
    * @beta
    */
@@ -819,19 +870,20 @@ export declare interface DialogProps extends PaddingStyleProps, ContainerStylePr
    * @defaultValue false
    */
   animate?: boolean
-  cardRadius?: Radius | Radius[]
-  cardShadow?: number | number[]
-  contentRef?: React.ForwardedRef<HTMLDivElement>
-  footer?: React.ReactNode
-  header?: React.ReactNode
+  cardRadius?: ResponsiveProp<Radius>
+  contentRef?: ForwardedRef<HTMLDivElement>
+  footer?: ReactNode
+  header?: ReactNode
   id: string
   /** A callback that fires when the dialog becomes the top layer when it was not the top layer before. */
   onActivate?: LayerProps['onActivate']
   onClickOutside?: () => void
   onClose?: () => void
+  open?: boolean
   portal?: string
   position?: DialogPosition | DialogPosition[]
   scheme?: ThemeColorSchemeKey_2
+  tone?: CardTone
   zOffset?: number | number[]
 }
 
@@ -839,7 +891,7 @@ export declare interface DialogProps extends PaddingStyleProps, ContainerStylePr
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare function DialogProvider(props: DialogProviderProps): React.ReactElement
+export declare function DialogProvider(props: DialogProviderProps): ReactElement
 
 export declare namespace DialogProvider {
   var displayName: string
@@ -850,17 +902,21 @@ export declare namespace DialogProvider {
  * @beta
  */
 export declare interface DialogProviderProps {
-  children?: React.ReactNode
+  children?: ReactNode
   position?: DialogPosition | DialogPosition[]
   zOffset?: number | number[]
 }
 
+/** @public */
+export declare type ElementProps<E extends ElementType> = Omit<ComponentProps<E>, 'as' | 'ref'>
+
 /**
  * DO NOT USE IN PRODUCTION.
  * @beta
  */
 export declare const ElementQuery: ForwardRefExoticComponent<
-  Omit<MediaQueryProps & Omit<HTMLProps<HTMLDivElement>, 'media' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, 'media'> &
+    MediaQueryProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -913,8 +969,8 @@ export declare type _ElementSizeSubscriber = (elementRect: ElementSize) => void
 export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
   state: ErrorBoundaryState
   static getDerivedStateFromError(error: Error): ErrorBoundaryState
-  componentDidCatch(error: Error, info: React.ErrorInfo): void
-  render(): React.ReactNode
+  componentDidCatch(error: Error, info: ErrorInfo): void
+  render(): ReactNode
 }
 
 /**
@@ -922,7 +978,7 @@ export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBo
  * @beta
  */
 export declare type ErrorBoundaryProps = PropsWithChildren<{
-  onCatch: (params: {error: Error; info: React.ErrorInfo}) => void
+  onCatch: (params: {error: Error; info: ErrorInfo}) => void
 }>
 
 /**
@@ -933,21 +989,14 @@ export declare interface ErrorBoundaryState {
   error: Error | null
 }
 
-/**
- * @internal
- */
-export declare function _fillCSSObject(
-  keys: string[],
-  value: string | number | CSSObject,
-): CSSObject
-
 /**
  * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
  *
  * @public
  */
 export declare const Flex: ForwardRefExoticComponent<
-  Omit<FlexProps & Omit<HTMLProps<HTMLDivElement>, 'wrap' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof FlexProps> &
+    FlexProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -960,7 +1009,9 @@ export {FlexJustify}
 /**
  * @public
  */
-export declare interface FlexProps extends Omit<BoxProps, 'display'> {}
+export declare interface FlexProps extends Omit<BoxProps, 'display'> {
+  htmlFor?: string
+}
 
 export {FlexValue}
 
@@ -979,23 +1030,7 @@ export declare function focusLastDescendant(element: HTMLElement): boolean
 /**
  * @internal
  */
-export declare interface FontWeightStyleProps {
-  $weight?: ThemeFontWeightKey_2
-}
-
-/**
- * @internal
- */
-export declare function _getArrayProp<T = number>(val: T | T[] | undefined, defaultVal?: T[]): T[]
-
-/**
- * @internal
- */
-export declare function _getResponsiveSpace(
-  theme: Theme_2,
-  props: string[],
-  spaceIndexes?: number[],
-): CSSObject[] | null
+export declare function _getArrayProp<T>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
 /**
  * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
@@ -1003,24 +1038,16 @@ export declare function _getResponsiveSpace(
  * @public
  */
 export declare const Grid: ForwardRefExoticComponent<
-  Omit<GridProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'as' | 'rows'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof GridProps> &
+    GridProps &
     RefAttributes<HTMLDivElement>
 >
 
-/**
- * @public
- */
-export declare type GridAutoCols = 'auto' | 'min' | 'max' | 'fr'
+export {GridAutoCols}
 
-/**
- * @public
- */
-export declare type GridAutoFlow = 'row' | 'column' | 'row dense' | 'column dense'
+export {GridAutoFlow}
 
-/**
- * @public
- */
-export declare type GridAutoRows = 'auto' | 'min' | 'max' | 'fr'
+export {GridAutoRows}
 
 export {GridItemColumn}
 
@@ -1037,7 +1064,7 @@ export {GridItemRowStart}
 /**
  * @public
  */
-export declare interface GridProps extends Omit<BoxProps, 'display'>, ResponsiveGridProps {}
+export declare interface GridProps extends Omit<BoxProps, 'display'> {}
 
 /**
  * @internal
@@ -1050,37 +1077,23 @@ export declare function _hasFocus(element: HTMLElement): boolean
  * @public
  */
 export declare const Heading: ForwardRefExoticComponent<
-  Omit<HeadingProps & Omit<HTMLProps<HTMLElement>, 'size' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof HeadingProps> &
+    HeadingProps &
     RefAttributes<HTMLElement>
 >
 
 /**
  * @public
  */
-export declare interface HeadingProps {
-  accent?: boolean
-  align?: TextAlign | TextAlign[]
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  muted?: boolean
-  size?: number | number[]
-  /**
-   * Controls how overflowing text is treated.
-   * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
-   * @beta
-   */
-  textOverflow?: 'ellipsis'
-  weight?: ThemeFontWeightKey_2
-}
+export declare interface HeadingProps extends HeadingStyleProps, TextOverflowStyleProps {}
 
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
 export declare const HeadingSkeleton: ForwardRefExoticComponent<
-  Omit<
-    HeadingSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'size' | 'children' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof HeadingSkeletonProps> &
+    HeadingSkeletonProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1089,7 +1102,7 @@ export declare const HeadingSkeleton: ForwardRefExoticComponent<
  * @beta
  */
 export declare interface HeadingSkeletonProps extends SkeletonProps {
-  size?: number | number[]
+  size?: ResponsiveProp<FontHeadingSize>
 }
 
 /**
@@ -1104,20 +1117,18 @@ export declare const hexToRgb: typeof hexToRgb_2
  * @public
  */
 export declare const Hotkeys: ForwardRefExoticComponent<
-  HotkeysProps &
-    Omit<
-      HTMLProps<HTMLDivElement>,
-      'display' | 'height' | 'width' | 'size' | 'wrap' | 'ref' | 'as'
-    > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof HotkeysProps> &
+    HotkeysProps &
     RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface HotkeysProps extends RadiusStyleProps {
+export declare interface HotkeysProps extends GapStyleProps, RadiusStyleProps {
   fontSize?: ResponsiveProp<FontTextSize>
   padding?: ResponsiveProp<Space>
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
   keys?: string[]
 }
@@ -1140,15 +1151,16 @@ export declare const hslToRgb: typeof hslToRgb_2
  * @public
  */
 export declare const Inline: ForwardRefExoticComponent<
-  Omit<InlineProps & Omit<HTMLProps<HTMLDivElement>, 'wrap'>, 'ref'> & RefAttributes<unknown>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof InlineProps> &
+    InlineProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface InlineProps
-  extends Omit<BoxProps, 'align' | 'display' | 'gap' | 'gapX' | 'gapY' | 'justify'> {
-  /** The spacing between children. */
+export declare interface InlineProps extends Omit<BoxProps, 'align' | 'display' | 'justify'> {
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
 }
 
@@ -1203,14 +1215,15 @@ export declare function _isScrollable(el: Node): boolean
  * @public
  */
 export declare const KBD: ForwardRefExoticComponent<
-  KBDProps & Omit<HTMLProps<HTMLElement>, 'size' | 'ref' | 'as'> & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof KBDProps> &
+    KBDProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
 export declare interface KBDProps extends BoxProps, RadiusStyleProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
   fontSize?: ResponsiveProp<FontTextSize>
   padding?: ResponsiveProp<Space>
 }
@@ -1221,26 +1234,19 @@ export declare interface KBDProps extends BoxProps, RadiusStyleProps {
  * @public
  */
 export declare const Label: ForwardRefExoticComponent<
-  Omit<LabelProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof LabelProps> &
+    LabelProps &
     RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface LabelProps {
+export declare interface LabelProps extends FontStyleProps, TextOverflowStyleProps {
   accent?: boolean
-  align?: TextAlign | TextAlign[]
-  as?: React.ElementType | keyof JSX.IntrinsicElements
+  htmlFor?: string
   muted?: boolean
-  size?: number | number[]
-  /**
-   * Controls how overflowing text is treated.
-   * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
-   * @beta
-   */
-  textOverflow?: 'ellipsis'
-  weight?: ThemeFontWeightKey_2
+  size?: ResponsiveProp<LabelSize>
 }
 
 /**
@@ -1248,10 +1254,8 @@ export declare interface LabelProps {
  * @beta
  */
 export declare const LabelSkeleton: ForwardRefExoticComponent<
-  Omit<
-    LabelSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'size' | 'children' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof LabelSkeletonProps> &
+    LabelSkeletonProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1260,14 +1264,15 @@ export declare const LabelSkeleton: ForwardRefExoticComponent<
  * @beta
  */
 export declare interface LabelSkeletonProps extends SkeletonProps {
-  size?: number | number[]
+  size?: ResponsiveProp<FontLabelSize>
 }
 
 /**
  * @public
  */
 export declare const Layer: ForwardRefExoticComponent<
-  Omit<LayerProps & Omit<HTMLProps<HTMLDivElement>, 'width' | 'wrap' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof LayerProps> &
+    LayerProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1293,7 +1298,7 @@ export declare interface LayerProps extends BoxProps {
 /**
  * @public
  */
-export declare function LayerProvider(props: LayerProviderProps): React.ReactElement
+export declare function LayerProvider(props: LayerProviderProps): ReactElement
 
 export declare namespace LayerProvider {
   var displayName: string
@@ -1303,7 +1308,7 @@ export declare namespace LayerProvider {
  * @public
  */
 export declare interface LayerProviderProps {
-  children?: React.ReactNode
+  children?: ReactNode
   zOffset?: number | number[]
 }
 
@@ -1312,7 +1317,6 @@ export declare interface LayerProviderProps {
  * @beta
  */
 export declare interface MediaQueryProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
   media?: number[]
 }
 
@@ -1330,11 +1334,8 @@ export declare interface _MediaStore {
  * @public
  */
 export declare const Menu: ForwardRefExoticComponent<
-  Omit<
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof MenuProps> &
     MenuProps &
-      Omit<HTMLProps<HTMLDivElement>, 'height' | 'width' | 'wrap' | 'role' | 'tabIndex' | 'as'>,
-    'ref'
-  > &
     RefAttributes<HTMLDivElement>
 >
 
@@ -1359,9 +1360,9 @@ export declare interface MenuButtonProps {
    * @deprecated Use `popover={{boundaryElement: element}}` instead.
    */
   boundaryElement?: HTMLElement
-  button: React.ReactElement
+  button: ReactElement<Props<ButtonProps, 'button'>>
   id: string
-  menu?: React.ReactElement
+  menu?: ReactElement
   onClose?: () => void
   onOpen?: () => void
   /**
@@ -1391,22 +1392,19 @@ export declare interface MenuButtonProps {
 /**
  * @public
  */
-export declare const MenuDivider: IStyledComponentBase<
-  'web',
-  FastOmit<DetailedHTMLProps<HTMLAttributes<HTMLHRElement>, HTMLHRElement>, never>
-> &
-  string
+export declare const MenuDivider: ForwardRefExoticComponent<
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, never> &
+    MenuDividerProps &
+    RefAttributes<HTMLHRElement>
+>
+
+/** @public */
+export declare interface MenuDividerProps {}
 
 /**
  * @public
  */
-export declare function MenuGroup(
-  props: Omit<
-    React.HTMLProps<HTMLDivElement>,
-    'as' | 'height' | 'popover' | 'ref' | 'tabIndex' | 'width' | 'wrap'
-  > &
-    MenuGroupProps,
-): React.ReactElement
+export declare function MenuGroup(props: Props<MenuGroupProps, 'div'>): ReactElement
 
 export declare namespace MenuGroup {
   var displayName: string
@@ -1415,15 +1413,27 @@ export declare namespace MenuGroup {
 /**
  * @public
  */
-export declare interface MenuGroupProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  fontSize?: number | number[]
-  icon?: React.ElementType | React.ReactNode
-  padding?: number | number[]
+export declare interface MenuGroupProps extends GapStyleProps {
+  disabled?: boolean
+  fontSize?: ResponsiveProp<FontTextSize>
+  icon?: ElementType | ReactNode
+  menu?: Omit<
+    MenuProps,
+    | 'onClickOutside'
+    | 'onEscape'
+    | 'onItemClick'
+    | 'onKeyDown'
+    | 'onMouseEnter'
+    | 'registerElement'
+    | 'shouldFocus'
+    | 'onBlurCapture'
+  >
+  padding?: ResponsiveProp<Space>
   popover?: Omit<PopoverProps, 'content' | 'open'>
   radius?: Radius | Radius[]
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
-  text: React.ReactNode
+  text: ReactNode
   tone?: SelectableTone
 }
 
@@ -1431,50 +1441,50 @@ export declare interface MenuGroupProps {
  * @public
  */
 export declare const MenuItem: ForwardRefExoticComponent<
-  MenuItemProps &
-    Omit<
-      HTMLProps<HTMLDivElement>,
-      'selected' | 'height' | 'width' | 'wrap' | 'tabIndex' | 'ref' | 'as'
-    > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof MenuItemProps> &
+    MenuItemProps &
     RefAttributes<HTMLDivElement>
 >
 
 /**
  * @public
  */
-export declare interface MenuItemProps extends PaddingStyleProps, RadiusStyleProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
+export declare interface MenuItemProps extends GapStyleProps, PaddingStyleProps, RadiusStyleProps {
+  disabled?: boolean
   fontSize?: number | number[]
   hotkeys?: string[]
-  icon?: React.ElementType | React.ReactNode
-  iconRight?: React.ElementType | React.ReactNode
+  icon?: ElementType | ReactNode
+  iconRight?: ElementType | ReactNode
   pressed?: boolean
   selected?: boolean
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
-  text?: React.ReactNode
+  text?: ReactNode
   tone?: SelectableTone
 }
 
 /**
  * @public
  */
-export declare interface MenuProps extends PaddingStyleProps {
+export declare interface MenuProps extends PaddingStyleProps, Pick<GapStyleProps, 'gap'> {
   /**
    * @deprecated Use `shouldFocus="first"` instead.
    */
-  focusFirst?: boolean
+  'focusFirst'?: boolean
   /**
    * @deprecated Use `shouldFocus="last"` instead.
    */
-  focusLast?: boolean
-  onClickOutside?: (event: MouseEvent) => void
-  onEscape?: () => void
-  onItemClick?: () => void
-  onItemSelect?: (index: number) => void
-  originElement?: HTMLElement | null
-  registerElement?: (el: HTMLElement) => () => void
-  shouldFocus?: 'first' | 'last' | null
-  space?: ResponsiveProp<Space>
+  'focusLast'?: boolean
+  'onClickOutside'?: (event: MouseEvent) => void
+  'onEscape'?: () => void
+  'onItemClick'?: () => void
+  'onItemSelect'?: (index: number) => void
+  'originElement'?: HTMLElement | null
+  'registerElement'?: (el: HTMLElement) => () => void
+  'shouldFocus'?: 'first' | 'last' | null
+  /** @deprecated Use `gap` property instead. */
+  'space'?: ResponsiveProp<Space>
+  'aria-labelledby'?: string
 }
 
 /**
@@ -1510,23 +1520,19 @@ export declare type Placement =
   | 'left-start'
   | 'left-end'
 
+export declare interface PolymorphicProps {
+  as?: ElementType
+}
+
 /**
  * The `Popover` component is used to display some content on top of another.
  *
  * @public
  */
-export declare const Popover: MemoExoticComponent<
-  ForwardRefExoticComponent<
-    Omit<
-      PopoverProps &
-        Omit<
-          HTMLProps<HTMLDivElement>,
-          'content' | 'height' | 'width' | 'wrap' | 'children' | 'as'
-        >,
-      'ref'
-    > &
-      RefAttributes<HTMLDivElement>
-  >
+export declare const Popover: NamedExoticComponent<
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof PopoverProps> &
+    PopoverProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
@@ -1535,10 +1541,7 @@ export declare const Popover: MemoExoticComponent<
 export declare type PopoverMargins = [number, number, number, number]
 
 /** @public */
-export declare interface PopoverProps
-  extends Omit<LayerProps, 'width'>,
-    RadiusStyleProps,
-    ResponsiveShadowProps {
+export declare interface PopoverProps extends CardProps, LayerProps {
   /** @beta */
   __unstable_margins?: PopoverMargins
   /**
@@ -1551,20 +1554,22 @@ export declare interface PopoverProps
   arrow?: boolean
   /** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */
   boundaryElement?: HTMLElement | null
-  children?: React.ReactElement
+  children?: ReactElement<{
+    ref: ForwardedRef<HTMLElement>
+  }>
   /**
-     * When `true`, prevent overflow within the current boundary:
-     * - by flipping on its side axis
-     * - by resizing
-     /*
-     * Note that:
-     * - setting `preventOverflow` to `true` also prevents overflow on its side axis
-     * - setting `matchReferenceWidth` to `true` also causes the popover to resize
-     *
-     * @defaultValue false
-     */
+   * When `true`, prevent overflow within the current boundary:
+   * - by flipping on its side axis
+   * - by resizing
+   *
+   * Note that:
+   * - setting `preventOverflow` to `true` also prevents overflow on its side axis
+   * - setting `matchReferenceWidth` to `true` also causes the popover to resize
+   *
+   * @defaultValue false
+   */
   constrainSize?: boolean
-  content?: React.ReactNode
+  content?: ReactNode
   disabled?: boolean
   fallbackPlacements?: Placement[]
   floatingBoundary?: HTMLElement | null
@@ -1577,9 +1582,14 @@ export declare interface PopoverProps
    * @defaultValue false
    */
   matchReferenceWidth?: boolean
+  /**
+   * When true, blocks all pointer interaction with elements beneath the popover until closed.
+   *
+   * @beta
+   * @defaultValue false
+   */
+  modal?: boolean
   open?: boolean
-  overflow?: BoxOverflow
-  padding?: number | number[]
   placement?: Placement
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
@@ -1590,13 +1600,10 @@ export declare interface PopoverProps
    * The children of the popover won't be rendered.
    */
   referenceElement?: HTMLElement | null
-  scheme?: ThemeColorSchemeKey_2
-  tone?: CardTone
   /** @beta */
   updateRef?:
     | MutableRefObject<PopoverUpdateCallback | undefined>
     | RefCallback<PopoverUpdateCallback | undefined>
-  width?: PopoverWidth | PopoverWidth[]
 }
 
 /** @beta */
@@ -1608,7 +1615,7 @@ export declare type PopoverWidth = number | 'auto'
 /**
  * @public
  */
-export declare function Portal(props: PortalProps): React.ReactPortal | null
+export declare function Portal(props: PortalProps): ReactPortal | null
 
 export declare namespace Portal {
   var displayName: string
@@ -1628,7 +1635,7 @@ export declare interface PortalContextValue {
  * @public
  */
 export declare interface PortalProps {
-  children: React.ReactNode
+  children: ReactNode
   /**
    * @beta This API might change. DO NOT USE IN PRODUCTION.
    */
@@ -1638,7 +1645,7 @@ export declare interface PortalProps {
 /**
  * @public
  */
-export declare function PortalProvider(props: PortalProviderProps): React.ReactElement
+export declare function PortalProvider(props: PortalProviderProps): ReactElement
 
 export declare namespace PortalProvider {
   var displayName: string
@@ -1652,7 +1659,7 @@ export declare interface PortalProviderProps {
    * @deprecated Use `<BoundaryElementProvider element={...} />` instead
    */
   boundaryElement?: HTMLElement | null
-  children: React.ReactNode
+  children: ReactNode
   element?: HTMLElement | null
   /**
    * @beta
@@ -1660,10 +1667,13 @@ export declare interface PortalProviderProps {
   __unstable_elements?: Record<string, HTMLElement | null | undefined>
 }
 
-/**
- * @public
- */
-export declare function px(pixelValue: number): string | 0
+/** @public */
+export declare type Props<P extends {} = {}, E extends ElementType = ElementType> = Assign<
+  ElementProps<E> & PolymorphicProps,
+  P
+>
+
+export {px}
 
 /**
  * The `Radio` component allows the user to select one option from a set.
@@ -1671,7 +1681,8 @@ export declare function px(pixelValue: number): string | 0
  * @public
  */
 export declare const Radio: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & RadioProps, 'ref'> &
+  Omit<ElementProps_2<'input'> & PolymorphicProps_2, 'customValidity'> &
+    RadioProps &
     RefAttributes<HTMLInputElement>
 >
 
@@ -1694,10 +1705,7 @@ export declare function _raf(fn: () => void): () => void
  */
 export declare function _raf2(fn: () => void): () => void
 
-/**
- * @public
- */
-export declare function rem(pixelValue: number): string | 0
+export {rem}
 
 /**
  * @internal
@@ -1706,6 +1714,7 @@ export declare const _ResizeObserver: typeof ResizeObserver
 
 /**
  * @internal
+ * @deprecated do not use
  */
 export declare function _responsive<T>(
   media: number[],
@@ -1743,14 +1752,6 @@ export declare interface ResponsiveBoxProps {
   sizing?: BoxSizing | BoxSizing[]
 }
 
-/**
- * Get responsive CSS for the `code` font style.
- * @internal
- */
-export declare function responsiveCodeFontStyle(
-  props: ResponsiveFontStyleProps & ThemeProps,
-): CSSObject[]
-
 /**
  * @public
  * @deprecated
@@ -1771,24 +1772,6 @@ export declare interface ResponsiveFlexProps {
   wrap?: FlexWrap | FlexWrap[]
 }
 
-/**
- * @internal
- */
-export declare interface ResponsiveFontSizeStyleProps {
-  $size: number[]
-}
-
-/**
- * @internal
- */
-export declare interface ResponsiveFontStyleProps
-  extends FontWeightStyleProps,
-    ResponsiveFontSizeStyleProps,
-    ResponsiveTextAlignStyleProps {
-  $accent?: boolean
-  $muted?: boolean
-}
-
 /**
  * @public
  * @deprecated
@@ -1804,6 +1787,7 @@ export declare interface ResponsiveGridItemProps {
 
 /**
  * @public
+ * @deprecated
  */
 export declare interface ResponsiveGridProps {
   autoRows?: GridAutoRows | GridAutoRows[]
@@ -1813,22 +1797,6 @@ export declare interface ResponsiveGridProps {
   rows?: number | number[]
 }
 
-/**
- * Get responsive CSS for the `heading` font style.
- * @internal
- */
-export declare function responsiveHeadingFont(
-  props: ResponsiveFontStyleProps & ThemeProps,
-): CSSObject[]
-
-/**
- * Get responsive CSS for the `label` font style.
- * @internal
- */
-export declare function responsiveLabelFont(
-  props: ResponsiveFontStyleProps & ThemeProps,
-): CSSObject[]
-
 /**
  * @public
  * @deprecated
@@ -1876,29 +1844,6 @@ export declare interface ResponsiveShadowProps {
   shadow?: number | number[]
 }
 
-/**
- * Get responsive text align styles.
- * @internal
- */
-export declare function responsiveTextAlignStyle(
-  props: ResponsiveTextAlignStyleProps & ThemeProps,
-): CSSObject[]
-
-/**
- * @internal
- */
-export declare interface ResponsiveTextAlignStyleProps {
-  $align: TextAlign[]
-}
-
-/**
- * Get responsive CSS for the `text` font style.
- * @internal
- */
-export declare function responsiveTextFont(
-  props: ResponsiveFontStyleProps & ThemeProps,
-): CSSObject[]
-
 /**
  * @public
  * @deprecated
@@ -1957,24 +1902,25 @@ export {screen_2 as screen}
  * @public
  */
 export declare const Select: ForwardRefExoticComponent<
-  Omit<SelectProps & Omit<HTMLProps<HTMLSelectElement>, 'as'>, 'ref'> &
+  Omit<ElementProps_2<'select'> & PolymorphicProps_2, keyof SelectProps> &
+    SelectProps &
     RefAttributes<HTMLSelectElement>
 >
 
 /**
  * @public
+ * @deprecated Use `ThemeColorStateToneKey` instead
  */
 export declare type SelectableTone = ThemeColorStateToneKey
 
 /**
  * @public
  */
-export declare interface SelectProps {
-  fontSize?: number | number[]
-  padding?: number | number[]
-  radius?: Radius | Radius[]
-  space?: number | number[]
+export declare interface SelectProps extends SelectStyleProps {
   customValidity?: string
+  readOnly?: boolean
+  /** @deprecated Use `gap` instead. */
+  space?: ResponsiveProp<Space>
 }
 
 /**
@@ -1982,14 +1928,16 @@ export declare interface SelectProps {
  * @beta
  */
 export declare const Skeleton: ForwardRefExoticComponent<
-  Omit<SkeletonProps & HTMLProps<HTMLDivElement>, 'ref'> & RefAttributes<HTMLDivElement>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof SkeletonProps> &
+    SkeletonProps &
+    RefAttributes<HTMLDivElement>
 >
 
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare interface SkeletonProps extends ResponsiveRadiusProps, Omit<BoxProps, 'children'> {
+export declare interface SkeletonProps extends SkeletonStyleProps, Omit<BoxProps, 'children'> {
   animated?: boolean
   delay?: number
 }
@@ -2000,7 +1948,8 @@ export declare interface SkeletonProps extends ResponsiveRadiusProps, Omit<BoxPr
  * @public
  */
 export declare const Spinner: ForwardRefExoticComponent<
-  Omit<SpinnerProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof SpinnerProps> &
+    SpinnerProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2016,7 +1965,8 @@ export declare interface SpinnerProps {
  * @public
  */
 export declare const SrOnly: ForwardRefExoticComponent<
-  Omit<SrOnlyProps & Omit<HTMLProps<HTMLDivElement>, 'aria-hidden' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, 'children'> &
+    SrOnlyProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2024,8 +1974,7 @@ export declare const SrOnly: ForwardRefExoticComponent<
  * @public
  */
 export declare interface SrOnlyProps {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  children?: React.ReactNode
+  children?: ReactNode
 }
 
 /**
@@ -2034,8 +1983,8 @@ export declare interface SrOnlyProps {
  * @public
  */
 export declare const Stack: ForwardRefExoticComponent<
-  StackProps &
-    Omit<HTMLProps<HTMLDivElement>, 'width' | 'ref' | 'as'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof StackProps> &
+    StackProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2043,8 +1992,11 @@ export declare const Stack: ForwardRefExoticComponent<
  * @public
  */
 export declare interface StackProps
-  extends Omit<BoxProps, 'direction' | 'display' | 'gap' | 'gapX' | 'gapY'> {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
+  extends Omit<
+    BoxProps,
+    'align' | 'columns' | 'direction' | 'display' | 'gapX' | 'gapY' | 'justify'
+  > {
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
 }
 
@@ -2052,7 +2004,9 @@ export declare interface StackProps
  * @public
  * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
  */
-export declare const studioTheme: BaseTheme_2
+export declare const studioTheme: {
+  readonly value: RootTheme_2
+}
 
 /**
  * @public
@@ -2060,6 +2014,8 @@ export declare const studioTheme: BaseTheme_2
  */
 export declare type Styles = ThemeStyles
 
+export declare function StyleTags(props: {theme?: Theme_v3}): ReactNode
+
 /**
  * The `Switch` component allows the user to toggle a setting on and off.
  *
@@ -2068,7 +2024,8 @@ export declare type Styles = ThemeStyles
  * @public
  */
 export declare const Switch: ForwardRefExoticComponent<
-  Omit<Omit<HTMLProps<HTMLInputElement>, 'type' | 'as'> & SwitchProps, 'ref'> &
+  Omit<ElementProps_2<'input'> & PolymorphicProps_2, 'indeterminate'> &
+    SwitchProps &
     RefAttributes<HTMLInputElement>
 >
 
@@ -2083,14 +2040,8 @@ export declare interface SwitchProps {
  * @public
  */
 export declare const Tab: ForwardRefExoticComponent<
-  Omit<
+  Omit<ElementProps_2<'button'> & PolymorphicProps_2, keyof TabProps> &
     TabProps &
-      Omit<
-        HTMLProps<HTMLButtonElement>,
-        'label' | 'id' | 'type' | 'width' | 'aria-controls' | 'as'
-      >,
-    'ref'
-  > &
     RefAttributes<HTMLButtonElement>
 >
 
@@ -2098,25 +2049,33 @@ export declare const Tab: ForwardRefExoticComponent<
  * @public
  */
 export declare const TabList: ForwardRefExoticComponent<
-  Omit<TabListProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'as'>, 'ref'> &
-    RefAttributes<unknown>
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TabListProps> &
+    TabListProps &
+    RefAttributes<HTMLDivElement>
 >
 
+/**
+ * @public
+ */
+export declare type TabListChild =
+  | ReactElement<Props<TabProps, 'button'>>
+  | null
+  | undefined
+  | false
+
 /**
  * @public
  */
 export declare interface TabListProps extends Omit<InlineProps, 'as' | 'height'> {
-  children: Array<React.ReactElement | null | undefined | false>
+  children: TabListChild[]
 }
 
 /**
  * @public
  */
 export declare const TabPanel: ForwardRefExoticComponent<
-  Omit<
-    TabPanelProps & Omit<HTMLProps<HTMLDivElement>, 'id' | 'role' | 'aria-labelledby' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TabPanelProps> &
+    TabPanelProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2136,15 +2095,15 @@ export declare interface TabPanelProps extends BoxProps {
  */
 export declare interface TabProps {
   /**
-   * The `id` of the correlating `TabPanel` component.
+   * The `id` of the corresponding `TabPanel` component.
    */
   'aria-controls': string
   'id': string
-  'icon'?: React.ElementType | React.ReactNode
+  'icon'?: ElementType | ReactNode
   'focused'?: boolean
   'fontSize'?: ResponsiveProp<FontTextSize>
-  'label'?: React.ReactNode
-  'padding'?: number | number[]
+  'label'?: ReactNode
+  'padding'?: ResponsiveProp<Space>
   'selected'?: boolean
   'tone'?: ButtonTone
 }
@@ -2155,39 +2114,36 @@ export declare interface TabProps {
  * @public
  */
 declare const Text_2: ForwardRefExoticComponent<
-  Omit<TextProps & Omit<HTMLProps<HTMLDivElement>, 'size' | 'as'>, 'ref'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TextProps> &
+    TextProps &
     RefAttributes<HTMLDivElement>
 >
 export {Text_2 as Text}
 
-/**
- * @public
- */
-export declare type TextAlign = 'left' | 'right' | 'center' | 'justify' | 'initial'
+export {TextAlign}
 
 /**
  * A multiline text input.
  *
-
  * @public
  */
 export declare const TextArea: ForwardRefExoticComponent<
-  Omit<TextAreaProps & Omit<HTMLProps<HTMLTextAreaElement>, 'as'>, 'ref'> &
+  Omit<ElementProps_2<'textarea'> & PolymorphicProps_2, keyof TextAreaProps> &
+    TextAreaProps &
     RefAttributes<HTMLTextAreaElement>
 >
 
 /**
  * @public
  */
-export declare interface TextAreaProps extends ResponsiveRadiusProps {
+export declare interface TextAreaProps extends TextAreaStyleProps {
   /**
    * @beta
    */
   __unstable_disableFocusRing?: boolean
-  border?: boolean
   customValidity?: string
-  fontSize?: number | number[]
-  padding?: number | number[]
+  /** @deprecated Use `gap` instead. */
+  space?: ResponsiveProp<Space>
   weight?: ThemeFontWeightKey_2
 }
 
@@ -2197,41 +2153,42 @@ export declare interface TextAreaProps extends ResponsiveRadiusProps {
  * @public
  */
 export declare const TextInput: ForwardRefExoticComponent<
-  Omit<TextInputProps & Omit<HTMLProps<HTMLInputElement>, 'type' | 'as' | 'prefix'>, 'ref'> &
+  Omit<ElementProps_2<'input'> & PolymorphicProps_2, keyof TextInputProps> &
+    TextInputProps &
     RefAttributes<HTMLInputElement>
 >
 
 /**
  * @public
  */
-export declare type TextInputClearButtonProps = Omit<ButtonProps, 'as'> &
-  Omit<React.HTMLProps<HTMLButtonElement>, 'as' | 'onClick' | 'onMouseDown' | 'ref'>
+export declare type TextInputClearButtonProps = Omit<
+  Props<ButtonProps, 'button'>,
+  'as' | 'onClick' | 'onMouseDown'
+>
 
 /**
  * @public
  */
-export declare interface TextInputProps extends RadiusStyleProps {
+export declare interface TextInputProps extends InputStyleProps {
   /**
    * @beta
    */
   __unstable_disableFocusRing?: boolean
-  border?: boolean
   /**
    * @beta
    */
   clearButton?: boolean | TextInputClearButtonProps
   customValidity?: string
-  fontSize?: ResponsiveProp<FontTextSize>
-  icon?: React.ElementType | React.ReactNode
-  iconRight?: React.ElementType | React.ReactNode
+  icon?: ElementType | ReactNode
+  iconRight?: ElementType | ReactNode
   /**
    * @beta
    */
   onClear?: () => void
-  padding: ResponsiveProp<Space>
-  prefix?: React.ReactNode
+  prefix?: ReactNode
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
-  suffix?: React.ReactNode
+  suffix?: ReactNode
   type?: TextInputType
   weight?: ThemeFontWeightKey_2
 }
@@ -2240,6 +2197,7 @@ export declare interface TextInputProps extends RadiusStyleProps {
  * @public
  */
 export declare type TextInputType =
+  | 'search'
   | 'date'
   | 'datetime-local'
   | 'email'
@@ -2256,19 +2214,8 @@ export declare type TextInputType =
 /**
  * @public
  */
-export declare interface TextProps extends TextStyleProps {
-  accent?: boolean
-  align?: TextAlign | TextAlign[]
-  as?: React.ElementType | keyof JSX.IntrinsicElements
-  /** When `true` the text color will be muted. */
-  muted?: boolean
-  /**
-   * Controls how overflowing text is treated.
-   * Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
-   * @beta
-   */
-  textOverflow?: 'ellipsis' | 'none'
-  weight?: ThemeFontWeightKey_2
+export declare interface TextProps extends TextStyleProps, TextOverflowStyleProps {
+  htmlFor?: string
 }
 
 /**
@@ -2276,10 +2223,8 @@ export declare interface TextProps extends TextStyleProps {
  * @beta
  */
 export declare const TextSkeleton: ForwardRefExoticComponent<
-  Omit<
-    TextSkeletonProps & Omit<HTMLProps<HTMLDivElement>, 'height' | 'size' | 'children' | 'as'>,
-    'ref'
-  > &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TextSkeletonProps> &
+    TextSkeletonProps &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2288,7 +2233,7 @@ export declare const TextSkeleton: ForwardRefExoticComponent<
  * @beta
  */
 export declare interface TextSkeletonProps extends SkeletonProps {
-  size?: number | number[]
+  size?: ResponsiveProp<FontTextSize>
 }
 
 /**
@@ -2340,7 +2285,7 @@ export {ThemeColorName}
 /**
  * @public
  */
-export declare function ThemeColorProvider(props: ThemeColorProviderProps): React.ReactElement
+export declare function ThemeColorProvider(props: ThemeColorProviderProps): ReactElement
 
 export declare namespace ThemeColorProvider {
   var displayName: string
@@ -2350,7 +2295,7 @@ export declare namespace ThemeColorProvider {
  * @public
  */
 export declare interface ThemeColorProviderProps {
-  children?: React.ReactNode
+  children?: ReactNode
   scheme?: ThemeColorSchemeKey_2
   tone?: ThemeColorCardToneKey
 }
@@ -2442,17 +2387,10 @@ export {ThemeInput}
  */
 export declare type ThemeLayer = ThemeLayer_2
 
-/**
- * @internal
- */
-export declare interface ThemeProps {
-  theme: Theme_2
-}
-
 /**
  * @public
  */
-export declare function ThemeProvider(props: ThemeProviderProps): React.ReactElement
+export declare function ThemeProvider(props: ThemeProviderProps): ReactElement
 
 export declare namespace ThemeProvider {
   var displayName: string
@@ -2462,7 +2400,7 @@ export declare namespace ThemeProvider {
  * @public
  */
 export declare interface ThemeProviderProps {
-  children?: React.ReactNode
+  children?: ReactNode
   scheme?: ThemeColorSchemeKey_2
   theme?: RootTheme_2
   tone?: ThemeColorCardToneKey
@@ -2482,9 +2420,11 @@ export declare type ThemeShadow = ThemeShadow_2
  * @public
  */
 export declare function Toast(
-  props: ToastProps &
-    Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'height' | 'ref' | 'title' | 'width' | 'wrap'>,
-): React.ReactElement
+  props: Omit<
+    Props<ToastProps, 'div'>,
+    'onDrag' | 'onDragEnd' | 'onDragStart' | 'onAnimationStart'
+  >,
+): ReactElement
 
 export declare namespace Toast {
   var displayName: string
@@ -2495,19 +2435,32 @@ export declare namespace Toast {
  */
 export declare interface ToastContextValue {
   version: 0.0
+  /**
+   * Creates or updates a toast notification.
+   * If a toast with the same ID already exists, it will be updated.
+   * If an ID is not provided, a random one will be generated.
+   * The returned ID can be used to programatically update a toast.
+   */
   push: (params: ToastParams) => string
 }
 
+/**
+ * @public
+ */
+declare interface ToastLayerProps extends GapStyleProps, PaddingStyleProps {
+  children: ReactNode
+}
+
 /**
  * @public
  */
 export declare interface ToastParams {
   closable?: boolean
-  description?: React.ReactNode
+  description?: ReactNode
   duration?: number
   id?: string
   onClose?: () => void
-  title?: React.ReactNode
+  title?: ReactNode
   status?: 'error' | 'warning' | 'success' | 'info'
 }
 
@@ -2516,17 +2469,18 @@ export declare interface ToastParams {
  */
 export declare interface ToastProps extends RadiusStyleProps {
   closable?: boolean
-  description?: React.ReactNode
+  description?: ReactNode
   onClose?: () => void
-  title?: React.ReactNode
+  title?: ReactNode
   status?: 'error' | 'warning' | 'success' | 'info'
   duration?: number
+  updatedAt?: number
 }
 
 /**
  * @public
  */
-export declare function ToastProvider(props: ToastProviderProps): React.ReactElement
+export declare function ToastProvider(props: ToastProviderProps): React.JSX.Element
 
 export declare namespace ToastProvider {
   var displayName: string
@@ -2535,11 +2489,8 @@ export declare namespace ToastProvider {
 /**
  * @public
  */
-export declare interface ToastProviderProps {
+export declare interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {
   children?: React.ReactNode
-  padding?: number | number[]
-  paddingX?: number | number[]
-  paddingY?: number | number[]
   zOffset?: number | number[]
 }
 
@@ -2549,11 +2500,8 @@ export declare interface ToastProviderProps {
  * @public
  */
 export declare const Tooltip: ForwardRefExoticComponent<
-  Omit<
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TooltipProps> &
     TooltipProps &
-      Omit<HTMLProps<HTMLDivElement>, 'content' | 'width' | 'wrap' | 'children' | 'as'>,
-    'ref'
-  > &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2566,7 +2514,6 @@ export declare const TooltipDelayGroupContext: Context<TooltipDelayGroupContextV
  * @beta
  */
 export declare interface TooltipDelayGroupContextValue {
-  isGroupActive: boolean
   setIsGroupActive: (nextState: React.SetStateAction<boolean>, delay?: number | undefined) => void
   setOpenTooltipId: (nextId: string | null, delay?: number | undefined) => void
   openDelay: number
@@ -2581,7 +2528,7 @@ export declare interface TooltipDelayGroupContextValue {
  */
 export declare function TooltipDelayGroupProvider(
   props: TooltipDelayGroupProviderProps,
-): React.ReactElement
+): ReactElement
 
 export declare namespace TooltipDelayGroupProvider {
   var displayName: string
@@ -2591,7 +2538,7 @@ export declare namespace TooltipDelayGroupProvider {
  * @public
  * */
 export declare interface TooltipDelayGroupProviderProps {
-  children?: React.ReactNode
+  children?: ReactNode
   /**
    * Handles the delays to open or close a tooltip inside a group
    *
@@ -2607,21 +2554,23 @@ export declare interface TooltipDelayGroupProviderProps {
 /**
  * @public
  */
-export declare interface TooltipProps extends Omit<LayerProps, 'as'>, RadiusStyleProps {
+export declare interface TooltipProps
+  extends Omit<LayerProps, 'as'>,
+    RadiusStyleProps,
+    ShadowStyleProps {
   /** @deprecated Use `fallbackPlacements` instead. */
   allowedAutoPlacements?: Placement[]
+  /**
+   * Whether the tooltip should animate in and out.
+   *
+   * @beta
+   * @defaultValue false
+   */
+  animate?: boolean
   arrow?: boolean
   boundaryElement?: HTMLElement | null
-  children?: React.ReactElement
-  content?: React.ReactNode
-  disabled?: boolean
-  fallbackPlacements?: Placement[]
-  padding?: number | number[]
-  placement?: Placement
-  /** Whether or not to render the tooltip in a portal element. */
-  portal?: boolean | string
-  scheme?: ThemeColorSchemeKey_2
-  shadow?: number | number[]
+  children?: ReactElement<Props>
+  content?: ReactNode
   /**
    * Adds a delay to open or close the tooltip.
    *
@@ -2633,28 +2582,23 @@ export declare interface TooltipProps extends Omit<LayerProps, 'as'>, RadiusStyl
    * @defaultValue 0
    */
   delay?: Delay
-  /**
-   * Whether the tooltip should animate in and out.
-   *
-   * @beta
-   * @defaultValue false
-   */
-  animate?: boolean
+  disabled?: boolean
+  fallbackPlacements?: Placement[]
+  placement?: Placement
+  /** Whether or not to render the tooltip in a portal element. */
+  portal?: boolean | string
+  scheme?: ThemeColorSchemeKey_2
+  tone?: ThemeColorCardToneKey
 }
 
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare const Tree: MemoExoticComponent<
-  ForwardRefExoticComponent<
+export declare const Tree: NamedExoticComponent<
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof TreeProps> &
     TreeProps &
-      Omit<
-        HTMLProps<HTMLDivElement>,
-        'height' | 'width' | 'wrap' | 'role' | 'ref' | 'as' | 'align'
-      > &
-      RefAttributes<HTMLDivElement>
-  >
+    RefAttributes<HTMLDivElement>
 >
 
 /**
@@ -2676,25 +2620,22 @@ export declare interface TreeContextValue {
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare const TreeItem: NamedExoticComponent<
-  TreeItemProps &
-    Omit<HTMLProps<HTMLDivElement>, 'height' | 'width' | 'wrap' | 'role' | 'ref' | 'as'>
->
+export declare const TreeItem: NamedExoticComponent<Omit<Props<TreeItemProps, 'div'>, 'as'>>
 
 /**
  * @beta
  */
-export declare interface TreeItemProps {
+export declare interface TreeItemProps extends CardProps {
   expanded?: boolean
-  fontSize?: number | number[]
-  icon?: React.ElementType
+  fontSize?: ResponsiveProp<FontTextSize>
+  icon?: ElementType
   /**
    * Allows passing a custom element type to the link component
    */
-  linkAs?: BoxProps['as']
-  padding?: number | number[]
+  linkAs?: ElementType
+  padding?: ResponsiveProp<Space>
   space?: ResponsiveProp<Space>
-  text?: React.ReactNode
+  text?: ReactNode
   weight?: ThemeFontWeightKey_2
 }
 
@@ -2702,7 +2643,8 @@ export declare interface TreeItemProps {
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare interface TreeProps {
+export declare interface TreeProps extends Pick<GapStyleProps, 'gap'> {
+  /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
 }
 
@@ -2718,20 +2660,20 @@ export declare interface TreeState {
     | undefined
 }
 
+/** @beta */
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
-export declare function useArrayProp<T extends ArrayPropPrimitive = ArrayPropPrimitive>(
-  val: T | T[] | undefined,
-  defaultVal?: T[],
-): T[]
+export declare function useArrayProp<T>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
 /**
  * @public
  */
 export declare function useBoundaryElement(): BoundaryElementContextValue
 
+export declare function useCard(): CardContextValue_2 | null
+
 /**
  * @public
  * @deprecated replaced by the new `useClickOutsideEvent` hook, instead of:
@@ -2804,9 +2746,7 @@ export declare function useElementSize(element: HTMLElement | null): ElementSize
  * +useImperativeHandle(forwardedRef, () => ref.current)
  * ```
  */
-export declare function useForwardedRef<T>(
-  ref: React.ForwardedRef<T>,
-): React.MutableRefObject<T | null>
+export declare function useForwardedRef<T>(ref: ForwardedRef<T>): MutableRefObject<T | null>
 
 /**
  * @beta
@@ -2821,7 +2761,7 @@ export declare function useLayer(): LayerContextValue
 /**
  * Efficiently subscribes to `window.matchMedia` queries
  *
- * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Required if the hook is called during SSR (https://react.dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
+ * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Required if the hook is called during SSR (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
  *
  * @public
  */
@@ -2844,7 +2784,7 @@ export declare function usePortal(): PortalContextValue
 /**
  * Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
  *
- * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-color-scheme: light)` since it's the most common scheme (https://react.dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
+ * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-color-scheme: light)` since it's the most common scheme (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
  *
  * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
  * Chrome supports reading the `prefers-color-scheme` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Color-Scheme
@@ -2857,7 +2797,7 @@ export declare function usePrefersDark(getServerSnapshot?: () => boolean): boole
 /**
  * Returns true if motion should be reduced
  *
- * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-reduced-motion: no-preference)` since it's the most common scheme (https://react.dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
+ * @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-reduced-motion: no-preference)` since it's the most common scheme (https://dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
  *
  * If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
  * Chrome supports reading the `prefers-reduced-motion` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Reduced-Motion
@@ -2901,9 +2841,8 @@ export declare function useTree(): TreeContextValue
  * @beta
  */
 export declare const VirtualList: ForwardRefExoticComponent<
-  VirtualListProps<any> &
-    StackProps &
-    Omit<HTMLProps<HTMLDivElement>, 'children' | 'onChange' | 'ref' | 'as'> &
+  Omit<ElementProps_2<'div'> & PolymorphicProps_2, keyof VirtualListProps<any>> &
+    VirtualListProps<any> &
     RefAttributes<HTMLDivElement>
 >
 
@@ -2922,13 +2861,12 @@ export declare interface VirtualListChangeOpts {
 /**
  * @beta
  */
-export declare interface VirtualListProps<Item = any> {
-  as?: React.ElementType | keyof JSX.IntrinsicElements
+export declare interface VirtualListProps<Item = any> extends Omit<StackProps, 'gap'> {
   gap?: number
   getItemKey?: (item: Item, itemIndex: number) => string
   items?: Item[]
   onChange?: (opts: VirtualListChangeOpts) => void
-  renderItem?: (item: Item) => React.ReactNode
+  renderItem?: (item: Item) => ReactNode
 }
 
 export {}