@sanity/ui 3.0.0-static.20 → 3.0.0-static.21

package/dist/index.d.cts

@@ -9,6 +9,7 @@ import type {BoxStyleProps} from '@sanity/ui/css'
 import {Breakpoint} from '@sanity/ui/css'
 import type {ButtonStyleProps} from '@sanity/ui/css'
 import {CardStyleProps as CardStyleProps_2} from '@sanity/ui/css'
+import {CodeStyleProps} from '@sanity/ui/css'
 import {Component} from 'react'
 import type {ComponentClass} from 'react'
 import type {ComponentProps} from 'react'
@@ -22,16 +23,14 @@ import type {DisplayStyleProps} from '@sanity/ui/css'
 import {ElementType as ElementType_2} from 'react'
 import {ErrorInfo} from 'react'
 import type {ExoticComponent} from 'react'
-import {FlexAlign} from '@sanity/ui/css'
+import {AlignItems as FlexAlign} from '@sanity/ui/css'
 import {FlexDirection} from '@sanity/ui/css'
-import {FlexJustify} from '@sanity/ui/css'
-import type {FlexStyleProps} from '@sanity/ui/css'
-import {FlexValue} from '@sanity/ui/css'
+import {JustifyContent as FlexJustify} from '@sanity/ui/css'
+import {Flex as FlexValue} from '@sanity/ui/css'
 import {FlexWrap} from '@sanity/ui/css'
 import type {FontCodeSize} from '@sanity/ui/theme'
 import type {FontHeadingSize} from '@sanity/ui/theme'
 import type {FontLabelSize} from '@sanity/ui/theme'
-import {FontStyleProps} from '@sanity/ui/css'
 import type {FontTextSize} from '@sanity/ui/theme'
 import {ForwardedRef} from 'react'
 import type {FunctionComponent} from 'react'
@@ -45,7 +44,6 @@ 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 type {GridStyleProps} 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'
@@ -55,6 +53,7 @@ import {InputStyleProps} from '@sanity/ui/css'
 import type {InsetStyleProps} from '@sanity/ui/css'
 import {JSX} from 'react'
 import {LabelStyleProps} from '@sanity/ui/css'
+import {MaxWidth} from '@sanity/ui/css'
 import {MouseEventHandler} from 'react'
 import {multiply as multiply_2} from '@sanity/ui/theme'
 import {MutableRefObject} from 'react'
@@ -140,10 +139,6 @@ export declare function Arrow<E extends ArrowElementType = typeof DEFAULT_ARROW_
   props: ArrowProps<E>,
 ): JSX.Element
 
-export declare namespace Arrow {
-  var displayName: string
-}
-
 /** @internal */
 export declare type ArrowElementType = 'div' | 'span' | ComponentType
 
@@ -183,10 +178,6 @@ export declare function Autocomplete<
   O extends BaseAutocompleteOption = BaseAutocompleteOption,
 >(props: AutocompleteProps<E, O>): JSX.Element
 
-export declare namespace Autocomplete {
-  var displayName: string
-}
-
 /** @public */
 export declare type AutocompleteElementType = 'input' | ComponentType
 
@@ -346,19 +337,11 @@ export declare function Avatar<E extends AvatarElementType = typeof DEFAULT_AVAT
   props: AvatarProps<E>,
 ): JSX.Element
 
-export declare namespace Avatar {
-  var displayName: string
-}
-
 /** @public */
 export declare function AvatarCounter<
   E extends AvatarCounterElementType = typeof DEFAULT_AVATAR_COUNTER_ELEMENT,
 >(props: AvatarCounterProps<E>): JSX.Element
 
-export declare namespace AvatarCounter {
-  var displayName: string
-}
-
 /** @public */
 export declare type AvatarCounterElementType = 'button' | 'div' | 'span' | ComponentType
 
@@ -419,10 +402,6 @@ export declare function AvatarStack<
   E extends AvatarStackElementType = typeof DEFAULT_AVATAR_STACK_ELEMENT,
 >(props: AvatarStackProps<E>): JSX.Element
 
-export declare namespace AvatarStack {
-  var displayName: string
-}
-
 /** @public */
 export declare type AvatarStackChild = ReactElement<AvatarProps<'div'>> | null | undefined | false
 
@@ -430,7 +409,10 @@ export declare type AvatarStackChild = ReactElement<AvatarProps<'div'>> | null |
 export declare type AvatarStackElementType = 'div' | 'span' | ComponentType
 
 /** @public */
-export declare type AvatarStackOwnProps = Omit<BoxOwnProps, 'align' | 'display'> & {
+export declare type AvatarStackOwnProps = Omit<
+  BoxOwnProps,
+  'align' | 'alignItems' | 'display' | 'justify' | 'justifyContent'
+> & {
   children: AvatarStackChild | AvatarStackChild[]
   maxLength?: number
   size?: ResponsiveProp<AvatarSize>
@@ -458,10 +440,6 @@ export declare function Badge<E extends BadgeElementType = typeof DEFAULT_BADGE_
   props: BadgeProps<E>,
 ): JSX.Element
 
-export declare namespace Badge {
-  var displayName: string
-}
-
 /** @public */
 export declare type BadgeElementType = 'div' | 'span' | ComponentType
 
@@ -507,10 +485,6 @@ export declare interface BoundaryElementContextValue {
 /** @public */
 export declare function BoundaryElementProvider(props: BoundaryElementProviderProps): ReactElement
 
-export declare namespace BoundaryElementProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface BoundaryElementProviderProps {
   children: ReactNode
@@ -527,10 +501,6 @@ export declare function Box<E extends BoxElementType = typeof DEFAULT_BOX_ELEMEN
   props: BoxProps<E>,
 ): JSX.Element
 
-export declare namespace Box {
-  var displayName: string
-}
-
 export {BoxDisplay}
 
 /** @public */
@@ -591,10 +561,6 @@ export declare function Breadcrumbs<
   E extends BreadcrumbsElementType = typeof DEFAULT_BREADCRUMBS_ELEMENT,
 >(props: BreadcrumbsProps<E>): JSX.Element
 
-export declare namespace Breadcrumbs {
-  var displayName: string
-}
-
 /** @beta */
 export declare type BreadcrumbsElementType = 'div' | 'nav' | ComponentType
 
@@ -616,10 +582,6 @@ export declare function Button<E extends ButtonElementType = typeof DEFAULT_BUTT
   props: ButtonProps<E>,
 ): JSX.Element
 
-export declare namespace Button {
-  var displayName: string
-}
-
 /** @public */
 export declare type ButtonElementType = 'a' | 'button' | 'label' | ComponentType
 
@@ -634,14 +596,13 @@ export declare type ButtonOwnProps = ButtonStyleProps &
   DisplayStyleProps &
   GapStyleProps &
   PaddingStyleProps & {
-    'align'?: FlexStyleProps['align']
+    'align'?: BoxStyleProps['alignItems']
     'data-ui'?: string
     'disabled'?: boolean
     'fontSize'?: ResponsiveProp<FontTextSize>
-    'mode'?: ThemeColorButtonModeKey_2
     'icon'?: ElementType_2 | ReactNode
     'iconRight'?: ElementType_2 | ReactNode
-    'justify'?: FlexStyleProps['justify']
+    'justify'?: BoxStyleProps['justifyContent']
     /** @beta Do not use in production, as this might change.*/
     'loading'?: boolean
     'selected'?: boolean
@@ -653,7 +614,6 @@ export declare type ButtonOwnProps = ButtonStyleProps &
     'text'?: ReactNode
     'textOverflow'?: TextOwnProps['textOverflow']
     'textWeight'?: TextOwnProps['weight']
-    'tone'?: ThemeColorStateToneKey
     'width'?: ResponsiveProp<Width>
   }
 
@@ -688,10 +648,6 @@ export declare function Card<E extends CardElementType = typeof DEFAULT_CARD_ELE
   props: CardProps<E>,
 ): JSX.Element
 
-export declare namespace Card {
-  var displayName: string
-}
-
 /** @internal */
 export declare type _CardCompatProviderComponent = ComponentType_2<{
   children?: ReactNode
@@ -731,17 +687,15 @@ export declare interface CardOwnProps extends BoxOwnProps, CardStyleProps_2 {
 /** @public */
 export declare type CardProps<E extends CardElementType = CardElementType> = Props<CardOwnProps, E>
 
+/** @public */
 export declare function CardProvider(props: {
   children?: ReactNode
   tone: ThemeColorCardToneKey
   scheme: ThemeColorSchemeKey_2
+  /** @internal */
   unstable_CompatProvider?: _CardCompatProviderComponent
 }): JSX.Element
 
-export declare namespace CardProvider {
-  var displayName: string
-}
-
 /**
  * @internal
  * @deprecated Use `CardStyleProps` from `@sanity/ui/css` instead.
@@ -765,10 +719,6 @@ export declare function Checkbox<E extends CheckboxElementType = typeof DEFAULT_
   props: CheckboxProps<E>,
 ): JSX.Element
 
-export declare namespace Checkbox {
-  var displayName: string
-}
-
 /** @public */
 export declare type CheckboxElementType = 'input' | ComponentType
 
@@ -801,18 +751,14 @@ export declare function Code<E extends CodeElementType = typeof DEFAULT_CODE_ELE
   props: CodeProps<E>,
 ): JSX.Element
 
-export declare namespace Code {
-  var displayName: string
-}
-
 /** @public */
 export declare type CodeElementType = 'div' | 'pre' | ComponentType
 
 /** @public */
-export declare type CodeOwnProps = Omit<FontStyleProps, 'align'> & {
+export declare type CodeOwnProps = CodeStyleProps & {
   /** Define the language to use for syntax highlighting. */
   language?: string
-  size?: number | number[]
+  size?: ResponsiveProp<FontCodeSize>
 }
 
 /** @public */
@@ -826,11 +772,7 @@ export declare function CodeSkeleton<
   E extends CodeSkeletonElementType = typeof DEFAULT_CODE_SKELETON_ELEMENT,
 >(props: CodeSkeletonProps<E>): JSX.Element
 
-export declare namespace CodeSkeleton {
-  var displayName: string
-}
-
-/** @public */
+/** @beta */
 export declare type CodeSkeletonElementType = SkeletonElementType
 
 /** @beta */
@@ -860,10 +802,6 @@ export declare function Container<
   E extends ContainerElementType = typeof DEFAULT_CONTAINER_ELEMENT,
 >(props: ContainerProps<E>): JSX.Element
 
-export declare namespace Container {
-  var displayName: string
-}
-
 /** @public */
 export declare type ContainerElementType = BoxElementType
 
@@ -897,7 +835,7 @@ export declare const DEFAULT_AUTOCOMPLETE_ELEMENT = 'input'
 export declare const DEFAULT_AVATAR_COUNTER_ELEMENT = 'div'
 
 /** @public */
-export declare const DEFAULT_AVATAR_ELEMENT = 'div'
+export declare const DEFAULT_AVATAR_ELEMENT = 'span'
 
 /** @public */
 export declare const DEFAULT_AVATAR_STACK_ELEMENT = 'div'
@@ -923,7 +861,7 @@ export declare const DEFAULT_CHECKBOX_ELEMENT = 'input'
 /** @public */
 export declare const DEFAULT_CODE_ELEMENT = 'pre'
 
-/** @public */
+/** @beta */
 export declare const DEFAULT_CODE_SKELETON_ELEMENT = 'div'
 
 /** @public */
@@ -944,7 +882,7 @@ export declare const DEFAULT_GRID_ELEMENT = 'div'
 /** @public */
 export declare const DEFAULT_HEADING_ELEMENT = 'div'
 
-/** @public */
+/** @beta */
 export declare const DEFAULT_HEADING_SKELETON_ELEMENT = 'div'
 
 /** @public */
@@ -959,7 +897,7 @@ export declare const DEFAULT_KBD_ELEMENT = 'kbd'
 /** @public */
 export declare const DEFAULT_LABEL_ELEMENT = 'div'
 
-/** @public */
+/** @beta */
 export declare const DEFAULT_LABEL_SKELETON_ELEMENT = 'div'
 
 /** @public */
@@ -1019,7 +957,7 @@ export declare const DEFAULT_TEXT_ELEMENT = 'div'
 /** @public */
 export declare const DEFAULT_TEXT_INPUT_ELEMENT = 'input'
 
-/** @public */
+/** @beta */
 export declare const DEFAULT_TEXT_SKELETON_ELEMENT = 'div'
 
 /** @public */
@@ -1054,10 +992,6 @@ export declare function Dialog<E extends DialogElementType = typeof DEFAULT_DIAL
   props: DialogProps<E>,
 ): JSX.Element
 
-export declare namespace Dialog {
-  var displayName: string
-}
-
 /**
  * @internal
  */
@@ -1069,8 +1003,8 @@ export declare const DialogContext: Context<DialogContextValue>
  */
 export declare interface DialogContextValue {
   version: 0.0
-  position?: DialogPosition | DialogPosition[]
-  zOffset?: number | number[]
+  position?: ResponsiveProp<DialogPosition>
+  zOffset?: ResponsiveProp<number>
 }
 
 /** @public */
@@ -1105,7 +1039,7 @@ export declare type DialogOwnProps = ContainerStyleProps &
     onClose?: () => void
     open?: boolean
     portal?: string
-    position?: DialogPosition | DialogPosition[]
+    position?: ResponsiveProp<DialogPosition>
     scheme?: ThemeColorSchemeKey_2
     tone?: CardTone
     zOffset?: number | number[]
@@ -1126,18 +1060,14 @@ export declare type DialogProps<E extends DialogElementType = DialogElementType>
  */
 export declare function DialogProvider(props: DialogProviderProps): ReactElement
 
-export declare namespace DialogProvider {
-  var displayName: string
-}
-
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
  */
 export declare interface DialogProviderProps {
   children?: ReactNode
-  position?: DialogPosition | DialogPosition[]
-  zOffset?: number | number[]
+  position?: ResponsiveProp<DialogPosition>
+  zOffset?: ResponsiveProp<number>
 }
 
 /**
@@ -1148,10 +1078,6 @@ export declare function ElementQuery<
   E extends ElementQueryElementType = typeof DEFAULT_ELEMENT_QUERY_ELEMENT,
 >(props: ElementQueryProps<E>): JSX.Element
 
-export declare namespace ElementQuery {
-  var displayName: string
-}
-
 /** @beta */
 export declare type ElementQueryElementType = 'div' | ComponentType
 
@@ -1255,10 +1181,6 @@ export declare function Flex<E extends FlexElementType = typeof DEFAULT_FLEX_ELE
   props: FlexProps<E>,
 ): JSX.Element
 
-export declare namespace Flex {
-  var displayName: string
-}
-
 export {FlexAlign}
 
 export {FlexDirection}
@@ -1269,7 +1191,15 @@ export declare type FlexElementType = BoxElementType
 export {FlexJustify}
 
 /** @public */
-export declare type FlexOwnProps = Omit<BoxOwnProps, 'display'>
+export declare type FlexOwnProps = Omit<
+  BoxOwnProps,
+  'align' | 'display' | 'flexDirection' | 'flexWrap'
+> & {
+  align?: ResponsiveProp<FlexAlign>
+  direction?: ResponsiveProp<FlexDirection>
+  justify?: ResponsiveProp<FlexJustify>
+  wrap?: ResponsiveProp<FlexWrap>
+}
 
 /** @public */
 export declare type FlexProps<E extends FlexElementType = FlexElementType> = Props<FlexOwnProps, E>
@@ -1293,6 +1223,14 @@ export declare function focusLastDescendant(element: HTMLElement): boolean
  */
 export declare function _getArrayProp<T>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
+/**
+ * @internal
+ */
+export declare function _getResponsiveProp<T>(
+  val: ResponsiveProp<T> | undefined,
+  defaultVal?: Partial<Record<Breakpoint, T>>,
+): Partial<Record<Breakpoint, T>>
+
 /**
  * The `Grid` component is for building 2-dimensional layers (based on CSS grid).
  *
@@ -1302,10 +1240,6 @@ export declare function Grid<E extends GridElementType = typeof DEFAULT_GRID_ELE
   props: GridProps<E>,
 ): JSX.Element
 
-export declare namespace Grid {
-  var displayName: string
-}
-
 export {GridAutoCols}
 
 export {GridAutoFlow}
@@ -1347,10 +1281,6 @@ export declare function Heading<E extends HeadingElementType = typeof DEFAULT_HE
   props: HeadingProps<E>,
 ): JSX.Element
 
-export declare namespace Heading {
-  var displayName: string
-}
-
 /** @public */
 export declare type HeadingElementType =
   | 'div'
@@ -1381,11 +1311,7 @@ export declare function HeadingSkeleton<
   E extends HeadingSkeletonElementType = typeof DEFAULT_HEADING_SKELETON_ELEMENT,
 >(props: HeadingSkeletonProps<E>): JSX.Element
 
-export declare namespace HeadingSkeleton {
-  var displayName: string
-}
-
-/** @public */
+/** @beta */
 export declare type HeadingSkeletonElementType = SkeletonElementType
 
 /** @beta */
@@ -1416,10 +1342,6 @@ export declare function Hotkeys<E extends HotkeysElementType = typeof DEFAULT_HO
   props: HotkeysProps<E>,
 ): JSX.Element | undefined
 
-export declare namespace Hotkeys {
-  var displayName: string
-}
-
 /** @public */
 export declare type HotkeysElementType = 'kbd' | ComponentType
 
@@ -1459,17 +1381,27 @@ export declare function Inline<E extends InlineElementType = typeof DEFAULT_INLI
   props: InlineProps<E>,
 ): JSX.Element
 
-export declare namespace Inline {
-  var displayName: string
-}
-
 /** @public */
 export declare type InlineElementType = BoxElementType
 
 /** @public */
 export declare type InlineOwnProps = Omit<
   BoxOwnProps,
-  keyof FlexStyleProps | keyof GridStyleProps
+  | 'alignItems'
+  | 'flexDirection'
+  | 'flexWrap'
+  | 'justifyContent'
+  | 'gridAutoColumns'
+  | 'gridAutoFlow'
+  | 'gridAutoRows'
+  | 'gridColumnEnd'
+  | 'gridColumnStart'
+  | 'gridColumn'
+  | 'gridRowEnd'
+  | 'gridRowStart'
+  | 'gridRow'
+  | 'gridTemplateColumns'
+  | 'gridTemplateRows'
 > & {
   /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
@@ -1535,10 +1467,6 @@ export declare function KBD<E extends KBDElementType = typeof DEFAULT_KBD_ELEMEN
   props: KBDProps<E>,
 ): JSX.Element
 
-export declare namespace KBD {
-  var displayName: string
-}
-
 /** @public */
 export declare type KBDElementType = 'kbd' | ComponentType
 
@@ -1560,10 +1488,6 @@ export declare function Label<E extends LabelElementType = typeof DEFAULT_LABEL_
   props: LabelProps<E>,
 ): JSX.Element
 
-export declare namespace Label {
-  var displayName: string
-}
-
 /** @public */
 export declare type LabelElementType =
   | 'div'
@@ -1596,11 +1520,7 @@ export declare function LabelSkeleton<
   E extends LabelSkeletonElementType = typeof DEFAULT_LABEL_SKELETON_ELEMENT,
 >(props: LabelSkeletonProps<E>): JSX.Element
 
-export declare namespace LabelSkeleton {
-  var displayName: string
-}
-
-/** @public */
+/** @beta */
 export declare type LabelSkeletonElementType = SkeletonElementType
 
 /** @beta */
@@ -1621,10 +1541,6 @@ export declare function Layer<E extends LayerElementType = typeof DEFAULT_LAYER_
   props: LayerProps<E>,
 ): JSX.Element
 
-export declare namespace Layer {
-  var displayName: string
-}
-
 /** @public */
 export declare interface LayerContextValue {
   version: 0.0
@@ -1642,7 +1558,7 @@ export declare type LayerElementType = CardElementType
 export declare type LayerOwnProps = CardOwnProps & {
   /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
   onActivate?: (props: {activeElement: HTMLElement | null}) => void
-  zOffset?: number | number[]
+  zOffset?: ResponsiveProp<number>
 }
 
 /** @public */
@@ -1654,14 +1570,10 @@ export declare type LayerProps<E extends LayerElementType = LayerElementType> =
 /** @public */
 export declare function LayerProvider(props: LayerProviderProps): ReactElement
 
-export declare namespace LayerProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface LayerProviderProps {
   children?: ReactNode
-  zOffset?: number | number[]
+  zOffset?: ResponsiveProp<number>
 }
 
 /**
@@ -1681,10 +1593,6 @@ export declare function Menu<E extends MenuElementType = typeof DEFAULT_MENU_ELE
   props: MenuProps<E>,
 ): JSX.Element
 
-export declare namespace Menu {
-  var displayName: string
-}
-
 /**
  * The `MenuButton` component follows the WAI-ARIA specification for menu buttons.
  *
@@ -1692,10 +1600,6 @@ export declare namespace Menu {
  */
 export declare function MenuButton(props: MenuButtonProps): JSX.Element
 
-export declare namespace MenuButton {
-  var displayName: string
-}
-
 /** @public */
 export declare type MenuButtonProps = {
   /**
@@ -1741,10 +1645,6 @@ export declare function MenuDivider<
   E extends MenuDividerElementType = typeof DEFAULT_MENU_DIVIDER_ELEMENT,
 >(props: MenuDividerProps<E>): JSX.Element
 
-export declare namespace MenuDivider {
-  var displayName: string
-}
-
 /** @public */
 export declare type MenuDividerElementType = 'div' | 'hr' | 'span' | ComponentType
 
@@ -1763,10 +1663,6 @@ export declare function MenuGroup<
   E extends MenuGroupElementType = typeof DEFAULT_MENU_GROUP_ELEMENT,
 >(props: MenuGroupProps<E>): JSX.Element
 
-export declare namespace MenuGroup {
-  var displayName: string
-}
-
 /** @public */
 export declare type MenuGroupElementType = 'button' | ComponentType
 
@@ -1806,10 +1702,6 @@ export declare function MenuItem<E extends MenuItemElementType = typeof DEFAULT_
   props: MenuItemProps<E>,
 ): JSX.Element
 
-export declare namespace MenuItem {
-  var displayName: string
-}
-
 /** @public */
 export declare type MenuItemElementType = 'button' | 'a' | ComponentType
 
@@ -1818,7 +1710,7 @@ export declare type MenuItemOwnProps = GapStyleProps &
   PaddingStyleProps &
   RadiusStyleProps & {
     disabled?: boolean
-    fontSize?: number | number[]
+    fontSize?: ResponsiveProp<FontTextSize>
     hotkeys?: string[]
     icon?: ElementType_2 | ReactNode
     iconRight?: ElementType_2 | ReactNode
@@ -1904,10 +1796,6 @@ export declare function Popover<E extends PopoverElementType = typeof DEFAULT_PO
   props: PopoverProps<E>,
 ): JSX.Element
 
-export declare namespace Popover {
-  var displayName: string
-}
-
 /** @public */
 export declare type PopoverElementType = 'div' | ComponentType
 
@@ -1917,7 +1805,7 @@ export declare type PopoverElementType = 'div' | ComponentType
 export declare type PopoverMargins = [number, number, number, number]
 
 /** @public */
-export declare type PopoverOwnProps = LayerOwnProps & {
+export declare type PopoverOwnProps = Omit<LayerOwnProps, 'maxWidth'> & {
   /** @beta */
   __unstable_margins?: PopoverMargins
   /**
@@ -1978,6 +1866,7 @@ export declare type PopoverOwnProps = LayerOwnProps & {
   referenceElement?: HTMLElement | null
   /** @beta */
   updateRef?: Ref<PopoverUpdateCallback | undefined>
+  width?: ResponsiveProp<MaxWidth>
 }
 
 /** @public */
@@ -1995,10 +1884,6 @@ export declare type PopoverWidth = Exclude<ContainerWidth, 'auto'>
 /** @public */
 export declare function Portal(props: PortalProps): ReactPortal | null
 
-export declare namespace Portal {
-  var displayName: string
-}
-
 /** @public */
 export declare interface PortalContextValue {
   version: 0.0
@@ -2019,10 +1904,6 @@ export declare interface PortalProps {
 /** @public */
 export declare function PortalProvider(props: PortalProviderProps): ReactElement
 
-export declare namespace PortalProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface PortalProviderProps {
   /**
@@ -2056,10 +1937,6 @@ export declare function Radio<E extends RadioElementType = typeof DEFAULT_RADIO_
   props: RadioProps<E>,
 ): JSX.Element
 
-export declare namespace Radio {
-  var displayName: string
-}
-
 /** @public */
 export declare type RadioElementType = 'input' | ComponentType
 
@@ -2287,10 +2164,6 @@ export declare function Select<E extends SelectElementType = typeof DEFAULT_SELE
   props: SelectProps<E>,
 ): JSX.Element
 
-export declare namespace Select {
-  var displayName: string
-}
-
 /** @internal */
 declare type SelectableElementType = 'button' | 'a' | ComponentType
 
@@ -2325,10 +2198,6 @@ export declare function Skeleton<E extends SkeletonElementType = typeof DEFAULT_
   props: SkeletonProps<E>,
 ): JSX.Element
 
-export declare namespace Skeleton {
-  var displayName: string
-}
-
 /** @beta */
 export declare type SkeletonElementType = 'div' | 'span' | ComponentType
 
@@ -2357,10 +2226,6 @@ export declare function Spinner<E extends SpinnerElementType = typeof DEFAULT_SP
   props: SpinnerProps<E>,
 ): JSX.Element
 
-export declare namespace Spinner {
-  var displayName: string
-}
-
 /** @public */
 export declare type SpinnerElementType = 'div' | 'span' | ComponentType
 
@@ -2381,10 +2246,6 @@ export declare function SrOnly<E extends SrOnlyElementType = typeof DEFAULT_SR_O
   props: SrOnlyProps<E>,
 ): JSX.Element
 
-export declare namespace SrOnly {
-  var displayName: string
-}
-
 /** @public */
 export declare type SrOnlyElementType = 'span' | ComponentType
 
@@ -2406,17 +2267,25 @@ export declare function Stack<E extends StackElementType = typeof DEFAULT_STACK_
   props: StackProps<E>,
 ): JSX.Element
 
-export declare namespace Stack {
-  var displayName: string
-}
-
 /** @public */
 export declare type StackElementType = BoxElementType
 
 /** @public */
 export declare type StackOwnProps = Omit<
   BoxOwnProps,
-  'align' | 'columns' | 'direction' | 'display' | 'gapX' | 'gapY' | 'justify'
+  | 'align'
+  | 'alignItems'
+  | 'columns'
+  | 'gridTemplateColumns'
+  | 'direction'
+  | 'display'
+  | 'flexDirection'
+  | 'gapX'
+  | 'gapY'
+  | 'justify'
+  | 'justifyContent'
+  | 'rows'
+  | 'gridTemplateRows'
 > & {
   /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
@@ -2434,13 +2303,6 @@ export declare type StackProps<E extends StackElementType = StackElementType> =
  */
 export declare type Styles = ThemeStyles
 
-/** @beta */
-export declare function StyleTags(): ReactNode
-
-export declare namespace StyleTags {
-  var displayName: string
-}
-
 /**
  * The `Switch` component allows the user to toggle a setting on and off.
  *
@@ -2452,10 +2314,6 @@ export declare function Switch<E extends SwitchElementType = typeof DEFAULT_SWIT
   props: SwitchProps<E>,
 ): JSX.Element
 
-export declare namespace Switch {
-  var displayName: string
-}
-
 /** @public */
 export declare type SwitchElementType = 'input' | ComponentType
 
@@ -2475,10 +2333,6 @@ export declare function Tab<E extends TabElementType = typeof DEFAULT_TAB_ELEMEN
   props: TabProps<E>,
 ): JSX.Element
 
-export declare namespace Tab {
-  var displayName: string
-}
-
 /** @public */
 export declare type TabElementType = 'button' | ComponentType
 
@@ -2487,10 +2341,6 @@ export declare function TabList<E extends TabListElementType = typeof DEFAULT_TA
   props: TabListProps<E>,
 ): JSX.Element
 
-export declare namespace TabList {
-  var displayName: string
-}
-
 /** @public */
 export declare type TabListChild =
   | ReactElement<Props<TabProps, 'button'>>
@@ -2535,10 +2385,6 @@ export declare function TabPanel<E extends TabPanelElementType = typeof DEFAULT_
   props: TabPanelProps<E>,
 ): JSX.Element
 
-export declare namespace TabPanel {
-  var displayName: string
-}
-
 /** @public */
 export declare type TabPanelElementType = 'div' | 'span' | ComponentType
 
@@ -2571,10 +2417,6 @@ export declare type TagType = keyof JSX.IntrinsicElements
 declare function Text_2<E extends TextElementType = typeof DEFAULT_TEXT_ELEMENT>(
   props: TextProps<E>,
 ): JSX.Element
-
-declare namespace Text_2 {
-  var displayName: string
-}
 export {Text_2 as Text}
 
 export {TextAlign}
@@ -2588,10 +2430,6 @@ export declare function TextArea<E extends TextAreaElementType = typeof DEFAULT_
   props: TextAreaProps<E>,
 ): JSX.Element
 
-export declare namespace TextArea {
-  var displayName: string
-}
-
 /** @public */
 export declare type TextAreaElementType = 'textarea' | ComponentType
 
@@ -2636,10 +2474,6 @@ export declare function TextInput<
   E extends TextInputElementType = typeof DEFAULT_TEXT_INPUT_ELEMENT,
 >(props: TextInputProps<E>): JSX.Element
 
-export declare namespace TextInput {
-  var displayName: string
-}
-
 /** @public */
 export declare type TextInputClearButtonProps = Omit<
   ButtonProps<'button'>,
@@ -2693,11 +2527,7 @@ export declare function TextSkeleton<
   E extends TextSkeletonElementType = typeof DEFAULT_TEXT_SKELETON_ELEMENT,
 >(props: TextSkeletonProps<E>): JSX.Element
 
-export declare namespace TextSkeleton {
-  var displayName: string
-}
-
-/** @public */
+/** @beta */
 export declare type TextSkeletonElementType = SkeletonElementType
 
 /** @beta */
@@ -2761,10 +2591,6 @@ export {ThemeColorName}
 /** @public */
 export declare function ThemeColorProvider(props: ThemeColorProviderProps): ReactElement
 
-export declare namespace ThemeColorProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface ThemeColorProviderProps {
   children?: ReactNode
@@ -2860,10 +2686,6 @@ export declare type ThemeLayer = ThemeLayer_2
 /** @public */
 export declare function ThemeProvider(props: ThemeProviderProps): ReactElement
 
-export declare namespace ThemeProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface ThemeProviderProps {
   children?: ReactNode
@@ -2889,10 +2711,6 @@ export declare function Toast<E extends ToastElementType = typeof DEFAULT_TOAST_
   props: ToastProps<E>,
 ): JSX.Element
 
-export declare namespace Toast {
-  var displayName: string
-}
-
 /** @public */
 export declare interface ToastContextValue {
   version: 0.0
@@ -2927,7 +2745,9 @@ export declare type ToastOwnProps = RadiusStyleProps & {
   onClose?: () => void
   title?: ReactNode
   status?: 'error' | 'warning' | 'success' | 'info'
+  /** @deprecated */
   duration?: number
+  /** @deprecated */
   updatedAt?: number
 }
 
@@ -2951,14 +2771,10 @@ export declare type ToastProps<E extends ToastElementType = ToastElementType> =
 /** @public */
 export declare function ToastProvider(props: ToastProviderProps): React.JSX.Element
 
-export declare namespace ToastProvider {
-  var displayName: string
-}
-
 /** @public */
 export declare interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {
   children?: React.ReactNode
-  zOffset?: number | number[]
+  zOffset?: ResponsiveProp<number>
 }
 
 /**
@@ -2970,10 +2786,6 @@ export declare function Tooltip<E extends TooltipElementType = typeof DEFAULT_TO
   props: TooltipProps<E>,
 ): JSX.Element
 
-export declare namespace Tooltip {
-  var displayName: string
-}
-
 /**
  * @beta
  */
@@ -2999,10 +2811,6 @@ export declare function TooltipDelayGroupProvider(
   props: TooltipDelayGroupProviderProps,
 ): ReactElement
 
-export declare namespace TooltipDelayGroupProvider {
-  var displayName: string
-}
-
 /**
  * @public
  * */
@@ -3074,10 +2882,6 @@ export declare function Tree<E extends TreeElementType = typeof DEFAULT_TREE_ELE
   props: TreeProps<E>,
 ): JSX.Element
 
-export declare namespace Tree {
-  var displayName: string
-}
-
 /**
  * @beta
  */
@@ -3104,10 +2908,6 @@ export declare function TreeItem<E extends TreeItemElementType = typeof DEFAULT_
   props: TreeItemProps<E>,
 ): JSX.Element
 
-export declare namespace TreeItem {
-  var displayName: string
-}
-
 /** @beta */
 export declare type TreeItemElementType = 'a' | 'li' | ComponentType
 
@@ -3158,16 +2958,17 @@ export declare interface TreeState {
     | undefined
 }
 
-/** @beta */
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
  * @beta
+ * @deprecated Use `useResponsiveProp` instead.
  */
 export declare function useArrayProp<T>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
 /** @public */
 export declare function useBoundaryElement(): BoundaryElementContextValue
 
+/** @public */
 export declare function useCard(): CardContextValue | null
 
 /**
@@ -3297,6 +3098,15 @@ export declare function usePrefersDark(getServerSnapshot?: () => boolean): boole
  */
 export declare function usePrefersReducedMotion(getServerSnapshot?: () => boolean): boolean
 
+/**
+ * This API might change. DO NOT USE IN PRODUCTION.
+ * @beta
+ */
+export declare function useResponsiveProp<T>(
+  val: ResponsiveProp<T> | undefined,
+  defaultVal?: Partial<Record<Breakpoint, T>>,
+): Partial<Record<Breakpoint, T>>
+
 /** @public */
 export declare function useRootTheme(): ThemeContextValue
 
@@ -3324,10 +3134,6 @@ export declare function VirtualList<
   E extends VirtualListElementType = typeof DEFAULT_VIRTUAL_LIST_ELEMENT,
 >(props: VirtualListProps<E>): JSX.Element
 
-export declare namespace VirtualList {
-  var displayName: string
-}
-
 /** @beta */
 export declare interface VirtualListChangeOpts {
   fromIndex: number